/* =========================================================
   CSS VARIABLES - Resto Bridge brand palette
   Primary brand: var(--primary)
   Dark text:    #2b1d15
   Mint accent:  #69daaf
   Yellow accent:#fcd34d
   Coral:        #FF492C
   ========================================================= */
:root {
  /* Primary brand color. Change this one value to reskin the main brand/background. */
  --primary:     #1f0c41;
  --bg:          var(--primary);
  --bg-2:        rgb(from var(--primary) calc(r + 11) calc(g + 5) calc(b + 23));
  --bg-3:        rgb(from var(--primary) calc(r + 22) calc(g + 12) calc(b + 46));
  --bg-4:        rgba(255,255,255,0.08);
  --bg-glass:    rgba(255,255,255,0.12);
  --brand:       var(--primary);
  --card-white:  #FFFFFF;
  --card-dark:   #2b1d15;
  /* Foreground */
  --fg:          #FFFFFF;
  --fg-muted:    rgba(255,255,255,0.65);
  --fg-subtle:   rgba(255,255,255,0.28);
  --fg-on-white: #2b1d15;
  --fg-on-white-mut: #6B5D5A;
  /* Accents */
  --accent:      #69daaf;     /* mint green */
  --accent-dim:  rgba(105,218,175,0.16);
  --accent-border: rgba(105,218,175,0.4);
  --accent-2:    #fcd34d;     /* yellow */
  --accent-2-dim:rgba(252,211,77,0.18);
  --accent-3:    #FF492C;     /* coral */
  /* Borders */
  --border:      rgba(255,255,255,0.12);
  --border-2:    rgba(255,255,255,0.22);
  --card-bg:     rgba(255,255,255,0.07);
  /* Misc */
  --radius:      18px;
  --radius-sm:   10px;
  --radius-lg:   24px;
  --radius-pill: 999px;
  --font-head:   'Inter Tight', 'Inter', sans-serif;
  --font-body:   'Inter', sans-serif;
  --nav-h:       72px;
  --section-y:   120px;
  --section-x:   32px;
  --trans:       0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
[data-theme="light"] {
  --bg:       #FAF7FF;
  --bg-2:     #F0EAFF;
  --bg-3:     #E3DBFF;
  --bg-4:     rgba(43,29,21,0.04);
  --bg-glass: rgba(43,29,21,0.06);
  --fg:       #2b1d15;
  --fg-muted: #6B5D5A;
  --fg-subtle:#B5ABA8;
  --border:   rgba(43,29,21,0.08);
  --border-2: rgba(43,29,21,0.16);
  --card-bg:  rgba(43,29,21,0.03);
}
[data-theme="navy"] {
  --bg:       #060D1B;
  --bg-2:     #0A1428;
  --bg-3:     #122035;
  --bg-4:     rgba(255,255,255,0.05);
  --accent:   #fcd34d;
  --accent-dim:  rgba(252,211,77,0.15);
  --accent-border: rgba(252,211,77,0.35);
}
[dir="rtl"] {
  --font-head: 'Noto Sans Arabic', 'Segoe UI', Tahoma, Arial, sans-serif;
  --font-body: 'Noto Sans Arabic', 'Segoe UI', Tahoma, Arial, sans-serif;
}

/* =========================================================
   BASE
   ========================================================= */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--fg);font-family:var(--font-body);font-size:16px;line-height:1.5;overflow-x:hidden;letter-spacing:-0.005em;-webkit-font-smoothing:antialiased;transition:background var(--trans),color var(--trans);}
[dir="rtl"] body{letter-spacing:0;}
body::before{content:'';position:fixed;inset:0;background-image:radial-gradient(rgba(255,255,255,.3) .6px, transparent .6px);background-size:18px 18px;pointer-events:none;z-index:9999;opacity:0.04;}
.page-signal-lines{position:fixed;inset:0;z-index:2;pointer-events:none;overflow:hidden;opacity:.13;mix-blend-mode:screen;mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.45) 12%,black 24%,black 76%,rgba(0,0,0,.45) 88%,transparent 100%);-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.45) 12%,black 24%,black 76%,rgba(0,0,0,.45) 88%,transparent 100%);}
.page-signal-lines span{position:absolute;top:0;bottom:0;left:var(--line-x);width:1px;transform:translateX(-50%);background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.05) 16%,rgba(255,255,255,.12) 54%,rgba(255,255,255,.04) 90%,transparent 100%);}
.page-signal-lines span::after{content:'';position:absolute;top:28vh;left:50%;width:18px;height:34vh;transform:translateX(-50%);border-radius:var(--radius-pill);background:linear-gradient(to bottom,transparent 0%,rgba(255,255,255,.2) 34%,rgba(255,255,255,.06) 70%,transparent 100%);filter:blur(9px);animation:none;}
body[data-theme="light"] .page-signal-lines{opacity:.14;mix-blend-mode:multiply;}
a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;}
img{display:block;max-width:100%;}
button{cursor:pointer;font-family:var(--font-body);-webkit-tap-highlight-color:transparent;}
.container{max-width:1160px;margin:0 auto;padding:0 var(--section-x);}
.skip-link{position:fixed;top:12px;left:12px;z-index:10000;padding:10px 14px;border-radius:var(--radius-sm);background:var(--accent);color:var(--primary);font-weight:800;font-size:14px;transform:translateY(-150%);transition:transform .2s ease;}
.skip-link:focus-visible{transform:translateY(0);outline:none;box-shadow:0 0 0 3px rgba(255,255,255,.9);}

/* reveal — base + variants */
.reveal{opacity:0;clip-path:inset(0 0 14% 0);transform:translateY(22px);transition:opacity 0.72s cubic-bezier(0.16,1,0.3,1),clip-path 0.72s cubic-bezier(0.16,1,0.3,1),transform 0.72s cubic-bezier(0.16,1,0.3,1);}
.reveal.visible{opacity:1;clip-path:inset(0);transform:none;}
.btn.reveal.visible,
.plan-btn.reveal.visible,
.toggle-btn.reveal.visible{clip-path:none;}
.rd1{transition-delay:.08s;}.rd2{transition-delay:.16s;}.rd3{transition-delay:.24s;}.rd4{transition-delay:.32s;}.rd5{transition-delay:.4s;}

/* slide from left */
.reveal-l{opacity:0;transform:translateX(-28px);transition:opacity 0.72s cubic-bezier(0.16,1,0.3,1),transform 0.72s cubic-bezier(0.16,1,0.3,1);}
.reveal-l.visible{opacity:1;transform:none;}

/* slide from right */
.reveal-r{opacity:0;transform:translateX(28px);transition:opacity 0.72s cubic-bezier(0.16,1,0.3,1),transform 0.72s cubic-bezier(0.16,1,0.3,1);}
.reveal-r.visible{opacity:1;transform:none;}

/* scale up */
.reveal-scale{opacity:0;transform:scale(0.94);transition:opacity 0.72s cubic-bezier(0.16,1,0.3,1),transform 0.72s cubic-bezier(0.16,1,0.3,1);}
.reveal-scale.visible{opacity:1;transform:none;}

/* blur in */
.reveal-blur{opacity:0;filter:blur(4px);transform:translateY(14px);transition:opacity 0.72s ease,filter 0.72s ease,transform 0.72s ease;}
.reveal-blur.visible{opacity:1;filter:blur(0);transform:none;}

/* text mask — words rise from bottom */
.reveal-words{display:inline-block;}
.reveal-words .word{display:inline-block;overflow:hidden;vertical-align:bottom;}
.reveal-words .word > span{display:inline-block;transform:translateY(110%);opacity:0;transition:transform 0.8s cubic-bezier(0.16,1,0.3,1),opacity 0.6s ease;}
.reveal-words.visible .word > span{transform:none;opacity:1;}
.reveal-words.visible .word:nth-child(1) > span{transition-delay:0s;}
.reveal-words.visible .word:nth-child(2) > span{transition-delay:.08s;}
.reveal-words.visible .word:nth-child(3) > span{transition-delay:.16s;}
.reveal-words.visible .word:nth-child(4) > span{transition-delay:.24s;}
.reveal-words.visible .word:nth-child(5) > span{transition-delay:.32s;}
.reveal-words.visible .word:nth-child(6) > span{transition-delay:.4s;}

/* staggered children — auto-delay via :nth-child */
.stagger > .reveal{transition-delay:calc(var(--stagger-step,0.08s) * var(--i, 0));}

/* card hover lift */
.lift{transition:transform .35s cubic-bezier(0.16,1,0.3,1),box-shadow .35s ease,background .25s;}
.lift:hover{transform:translateY(-6px);}

/* button shimmer */
.btn{position:relative;overflow:hidden;isolation:isolate;-webkit-tap-highlight-color:transparent;touch-action:manipulation;}
.btn::before{content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.25),transparent);transform:skewX(-20deg);transition:left 0.5s ease;}
.btn:hover::before{left:130%;}
.btn::after,
.plan-btn::after,
.toggle-btn::after{content:'';position:absolute;inset:0;border-radius:inherit;background:radial-gradient(circle at var(--motion-x,50%) var(--motion-y,50%),rgba(105,218,175,.32),transparent 42%);opacity:0;transition:opacity .3s ease;pointer-events:none;}
.btn:hover::after,
.plan-btn:hover::after,
.toggle-btn:hover::after{opacity:1;}
.btn:focus,
.plan-btn:focus,
.toggle-btn:focus{outline:none;}
.btn:focus-visible,
.plan-btn:focus-visible,
.toggle-btn:focus-visible{box-shadow:0 0 0 3px rgba(105,218,175,.38),0 0 0 6px rgb(from var(--primary) r g b / .18);}
.btn:active,
.plan-btn:active,
.toggle-btn:active{transform:translate3d(var(--magnet-x,0),var(--magnet-y,0),0) scale(.985);}
.btn > *,
.plan-btn > *,
.toggle-btn > *{position:relative;z-index:1;}

/* Pixion-inspired interaction layer */
.motion-card{--shine-x:50%;--shine-y:50%;--tilt-x:0deg;--tilt-y:0deg;--motion-lift:0px;--reveal-y:0px;--reveal-scale:1;position:relative;overflow:hidden;transform:perspective(900px) rotateX(var(--tilt-y)) rotateY(var(--tilt-x)) translateY(calc(var(--motion-lift) + var(--reveal-y))) scale(var(--reveal-scale));transform-style:preserve-3d;transition:transform .9s cubic-bezier(.16,1,.3,1),box-shadow .28s ease,background .25s ease;}
.motion-card::before{content:'';position:absolute;inset:0;z-index:0;border-radius:inherit;background:radial-gradient(circle at var(--shine-x) var(--shine-y),rgba(105,218,175,.16),transparent 38%);opacity:0;transition:opacity .28s ease;pointer-events:none;}
.motion-card:hover{--motion-lift:-5px;}
.motion-card:hover::before{opacity:1;}
.motion-card > *{position:relative;z-index:1;}
@keyframes logoMarquee{to{transform:translateX(-50%);}}
.proof-band .container{overflow:hidden;}
.logos-row.is-marquee{width:max-content;flex-wrap:nowrap;justify-content:flex-start;gap:42px;animation:logoMarquee 28s linear infinite;}
.logos-row.is-marquee:hover{animation-play-state:paused;}

/* =========================================================
   FLOATING ANIMATIONS — subtle perpetual motion
   Uses CSS `translate` property which is independent of `transform`,
   so it composes cleanly with reveal animations
   ========================================================= */
@keyframes floatSoft {
  0%, 100% { translate: 0 0; }
  50%      { translate: 0 -6px; }
}
@keyframes floatSoftAlt {
  0%, 100% { translate: 0 0; }
  50%      { translate: 0 -10px; }
}
@keyframes floatRot {
  0%, 100% { translate: 0 0; rotate: 0deg; }
  50%      { translate: 0 -4px; rotate: 1.5deg; }
}
@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(105,218,175,0.4); }
  50%      { box-shadow: 0 0 0 8px rgba(105,218,175,0); }
}

.float-soft     { animation: floatSoft     5s ease-in-out infinite; }
.float-soft-2   { animation: floatSoftAlt  6.5s ease-in-out -1.5s infinite; }
.float-rot      { animation: floatRot      7s ease-in-out infinite; }
.pulse-glow     { animation: pulseGlow     2.4s ease-in-out infinite; }

/* =========================================================
   NAV
   ========================================================= */
nav{position:fixed;top:0;left:0;right:0;height:var(--nav-h);z-index:1000;display:flex;align-items:center;transition:background .3s,border-color .3s,backdrop-filter .3s;}
nav.scrolled{background:var(--bg);border-bottom:1px solid var(--border);backdrop-filter:none;}
[data-theme="light"] nav.scrolled{background:#FAF7FF;}
[data-theme="navy"] nav.scrolled{background:#060D1B;}
nav .container{max-width:1280px;}
.nav-inner{display:flex;align-items:center;justify-content:space-between;width:100%;gap:22px;}
.nav-logo{font-family:var(--font-head);font-weight:700;font-size:20px;letter-spacing:-.5px;display:flex;align-items:center;gap:8px;white-space:nowrap;flex:0 0 auto;}
.nav-logo-img{display:block;width:clamp(118px,10vw,142px);height:auto;max-height:44px;object-fit:contain;object-position:center;}
.nav-logo-dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 12px var(--accent);flex:0 0 auto;}
.nav-links{display:flex;align-items:center;justify-content:center;gap:6px;list-style:none;flex:1 1 auto;min-width:0;}
.nav-links a{display:inline-flex;align-items:center;min-height:38px;padding:0 11px;border-radius:8px;font-size:13.5px;font-weight:700;color:#fff;line-height:1;letter-spacing:0;opacity:.88;transition:opacity .18s ease,background-color .18s ease,box-shadow .18s ease;white-space:nowrap;}
.nav-links a:hover,
.nav-links a:focus-visible{background:rgba(255,255,255,.11);color:#fff;opacity:1;outline:none;}
.nav-links a:focus-visible{box-shadow:0 0 0 3px var(--accent-dim);}
.nav-menu{position:relative;}
.nav-menu-trigger{display:inline-flex;align-items:center;gap:8px;min-height:38px;padding:0 11px;border:0;border-radius:8px;background:transparent;color:#fff;font:inherit;font-size:13.5px;font-weight:700;line-height:1;letter-spacing:0;opacity:.88;white-space:nowrap;cursor:pointer;transition:opacity .18s ease,background-color .18s ease,box-shadow .18s ease;}
.nav-menu-trigger::after{content:"";width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .16s ease;opacity:.78;}
.nav-menu.is-open .nav-menu-trigger::after{transform:translateY(2px) rotate(225deg);}
.nav-menu-trigger:hover,
.nav-menu-trigger:focus-visible,
.nav-menu.is-open .nav-menu-trigger{background:rgba(255,255,255,.11);color:#fff;opacity:1;outline:none;}
.nav-menu-trigger:focus-visible{box-shadow:0 0 0 3px var(--accent-dim);}
.nav-menu-panel{position:absolute;top:calc(100% + 12px);right:0;z-index:1010;min-width:210px;padding:7px;border:1px solid rgba(255,255,255,.18);border-radius:8px;background:rgb(from var(--primary) r g b / .97);box-shadow:0 20px 48px rgba(0,0,0,.32);backdrop-filter:blur(16px);}
.nav-menu-panel[hidden]{display:none;}
.nav-menu-panel a{display:flex;align-items:center;min-height:38px;padding:0 12px;border-radius:7px;color:#fff;font-size:13.5px;font-weight:700;line-height:1.1;opacity:.9;}
.nav-menu-panel a:hover,
.nav-menu-panel a:focus-visible{background:rgba(255,255,255,.13);color:#fff;opacity:1;outline:none;}
.btn{display:inline-flex;align-items:center;gap:8px;padding:12px 24px;border-radius:var(--radius-pill);font-size:14px;font-weight:600;border:none;transition:all .2s;white-space:nowrap;letter-spacing:-0.01em;}
.nav-ctas{gap:10px !important;}
.nav-ctas .btn{min-height:38px;padding:0 16px !important;font-size:13.5px !important;font-weight:750;line-height:1;letter-spacing:0;}
.btn-primary{background:#FFFFFF;color:var(--fg-on-white);}
.btn-primary:hover{transform:translateY(-1px);box-shadow:0 12px 32px rgba(255,255,255,.18);background:#fcd34d;}
.btn-ghost{background:transparent;color:var(--fg);border:1px solid var(--border-2);}
.btn-ghost:hover{background:var(--bg-glass);border-color:rgba(255,255,255,.4);}
.btn:hover{transform:translate3d(var(--magnet-x,0),calc(var(--magnet-y,0) - 2px),0);}
.nav-language{height:38px;min-width:58px;padding:0 10px;border:1px solid var(--border-2);border-radius:var(--radius-pill);background:var(--bg-glass);color:var(--fg);font:inherit;font-size:13px;font-weight:650;letter-spacing:0;outline:none;}
.nav-language:focus{border-color:var(--accent-border);box-shadow:0 0 0 3px var(--accent-dim);}
.nav-language option{background:var(--bg);color:#FFFFFF;}
[data-theme="light"] .nav-language option{background:#FFFFFF;color:#2b1d15;}
.mobile-language{width:100%;height:52px;text-align:center;}
.nav-language-native{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none;}
.language-select{position:relative;min-width:104px;z-index:1002;}
.language-select-trigger{width:100%;height:38px;display:inline-flex;align-items:center;justify-content:space-between;gap:8px;padding:0 32px 0 10px;border:1px solid var(--border-2);border-radius:var(--radius-pill);background:var(--bg-glass);color:var(--fg);font:inherit;font-size:13px;font-weight:700;letter-spacing:0;outline:none;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease;}
.language-select-trigger::after{content:"";position:absolute;right:13px;top:50%;width:8px;height:8px;border-right:2px solid var(--fg-muted);border-bottom:2px solid var(--fg-muted);transform:translateY(-65%) rotate(45deg);pointer-events:none;}
.language-select-trigger:hover{border-color:var(--border-2);background:rgba(255,255,255,0.16);}
.language-select.is-open .language-select-trigger,
.language-select-trigger:focus{border-color:var(--accent-border);box-shadow:0 0 0 3px var(--accent-dim);}
.language-select-code{display:inline-flex;align-items:center;justify-content:center;min-width:26px;height:22px;padding:0 6px;border-radius:6px;background:rgba(105,218,175,.16);color:var(--accent);font-size:11px;font-weight:800;}
.language-select-current{max-width:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.language-select-menu{position:absolute;top:calc(100% + 8px);left:0;right:0;z-index:1010;padding:6px;border:1px solid var(--border);border-radius:8px;background:rgb(from var(--primary) r g b / .96);box-shadow:0 14px 30px rgba(0,0,0,.22);backdrop-filter:blur(16px);}
.language-select-menu[hidden]{display:none;}
.language-select-menu button{display:flex;align-items:center;gap:8px;width:100%;min-height:36px;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:var(--fg);font:inherit;font-size:14px;font-weight:650;text-align:left;letter-spacing:0;}
.language-select-menu button span{display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:22px;border-radius:6px;background:rgba(255,255,255,.1);color:var(--accent);font-size:11px;font-weight:800;}
.language-select-menu button:hover,
.language-select-menu button[aria-selected="true"]{background:rgba(255,255,255,.12);}
.language-select-mobile{width:100%;}
.language-select-mobile .language-select-trigger{height:52px;justify-content:center;padding:0 36px;}
[dir="rtl"] .nav-logo,
[dir="rtl"] .nav-links a,
[dir="rtl"] .nav-menu-trigger,
[dir="rtl"] .btn,
[dir="rtl"] .mobile-menu a,
[dir="rtl"] .mobile-nav-menu-trigger,
[dir="rtl"] .language-select-trigger,
[dir="rtl"] .language-select-menu button{font-weight:700;}
[dir="rtl"] nav .btn,
[dir="rtl"] .mobile-menu .btn{font-weight:700 !important;}
[dir="rtl"] .hero h1,
[dir="rtl"] .blog-hero h1,
[dir="rtl"] .blog-index-hero h1,
[dir="rtl"] .product-hero h1{font-weight:750;}
[dir="rtl"] .nav-links a,
[dir="rtl"] .nav-menu-trigger,
[dir="rtl"] .language-select-trigger{font-size:14px;}
[dir="rtl"] .nav-menu-panel{left:0;right:auto;}
[dir="rtl"] .language-select-trigger{padding:0 10px 0 32px;}
[dir="rtl"] .language-select-trigger::after{right:auto;left:13px;}
[dir="rtl"] .language-select-menu button{text-align:right;}
[dir="rtl"] .features-intro,
[dir="rtl"] .bento-card,
[dir="rtl"] .split-text,
[dir="rtl"] .how-card,
[dir="rtl"] .pc,
[dir="rtl"] .footer-brand,
[dir="rtl"] .footer-col{text-align:right;}
[dir="rtl"] .footer-grid{direction:rtl;}
[dir="rtl"] .footer-brand{display:flex;flex-direction:column;align-items:flex-start;}
[dir="rtl"] .footer-brand .nav-logo{justify-content:flex-end;}
[dir="rtl"] .footer-brand .nav-logo-img{transform:none;}
[dir="rtl"] .footer-brand p{margin-left:0;margin-right:0;}
[dir="rtl"] .nav-links,
[dir="rtl"] .hero-note,
[dir="rtl"] .hero-ctas,
[dir="rtl"] .split-bullets li,
[dir="rtl"] .plan-feats li,
[dir="rtl"] .footer-bottom{direction:rtl;}

/* =========================================================
   HERO
   ========================================================= */
.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;text-align:center;padding-top:148px;padding-left:var(--section-x);padding-right:var(--section-x);padding-bottom:var(--section-y);position:relative;overflow:hidden;background:var(--bg);}
.hero::after{content:'';position:absolute;left:0;right:0;bottom:0;height:min(22%,280px);z-index:2;pointer-events:none;background:linear-gradient(to bottom,rgb(from var(--primary) r g b / 0) 0%,rgb(from var(--primary) r g b / .5) 54%,var(--bg-2) 100%);}
.hero > :not(.hero-bg-img):not(.hero-glow):not(.hero-dots){position:relative;z-index:3;}
.hero-glow{position:absolute;width:1200px;height:1000px;border-radius:50%;background:radial-gradient(ellipse at center,rgba(105,218,175,.28) 0%,rgba(252,211,77,.12) 32%,transparent 70%);top:-20%;left:50%;transform:translateX(-50%);pointer-events:none;filter:blur(40px);}
/* dot pattern overlay */
.hero-dots{position:absolute;inset:0;background-image:radial-gradient(circle,rgba(255,255,255,0.08) 1px,transparent 1px);background-size:24px 24px;background-position:0 0;pointer-events:none;mask-image:radial-gradient(ellipse at center,black 30%,transparent 75%);-webkit-mask-image:radial-gradient(ellipse at center,black 30%,transparent 75%);}

/* Hero background image */
.hero-bg-img{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;background:linear-gradient(to bottom,rgb(from var(--primary) r g b / .9) 0%,rgb(from var(--primary) r g b / .68) 46%,rgb(from var(--primary) r g b / .76) 100%),url("../assets/images/hero-restaurant-background.jpg") center/cover no-repeat;opacity:1;mix-blend-mode:normal;}
.hero-bg-img::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(105,218,175,.14),transparent 62%);opacity:.55;}

.hero-badge{display:inline-flex;align-items:center;gap:8px;padding:7px 16px;border-radius:var(--radius-pill);border:1px solid var(--border-2);background:var(--bg-glass);font-size:13px;font-weight:500;color:var(--fg);margin-bottom:28px;backdrop-filter:blur(10px);}
.hero-badge-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);animation:pulsedot 2s infinite;}
@keyframes pulsedot{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.5;transform:scale(.7);}}

.hero-title-mobile,
.hero-sub-mobile,
.cta-label-mobile{display:none;}
.hero h1{font-family:var(--font-head);font-weight:850;font-size:clamp(42px,7.4vw,88px);line-height:1.02;letter-spacing:0;max-width:980px;margin:0 auto 28px;text-wrap:balance;}
[dir="rtl"] .hero h1,
[dir="rtl"] .section-title,
[dir="rtl"] .stat-big,
[dir="rtl"] .plan-num,
[dir="rtl"] .cta-content h2{letter-spacing:0;}
[dir="rtl"] .hero h1,
[dir="rtl"] .section-title,
[dir="rtl"] .mission-copy h2,
[dir="rtl"] .suite-card h3,
[dir="rtl"] .segment-card h3,
[dir="rtl"] .resource-card h3,
[dir="rtl"] .resource-featured-card h3,
[dir="rtl"] .cta-content h2{
  line-height:1.22;
  padding-bottom:.08em;
}
[dir="rtl"] .reveal.visible:is(h1,h2,h3,.section-title){
  clip-path:inset(-.18em 0 -.24em 0);
}
.hero h1 em{font-style:normal;background:linear-gradient(135deg,var(--accent) 0%,#fcd34d 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.hero-title-mobile em{display:inline-block;white-space:nowrap;text-shadow:none;}
.hero-sub{font-size:clamp(17px,2vw,21px);color:rgba(255,255,255,0.78);max-width:720px;margin:0 auto 34px;font-weight:500;line-height:1.55;letter-spacing:0;}
.hero-ctas{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:center;margin-bottom:24px;overflow:visible;}
.hero-ctas.reveal.visible{clip-path:inset(-18px);}
.hero-ctas .btn{will-change:transform;}
.btn-lg{padding:16px 32px;font-size:16px;border-radius:var(--radius-pill);}
.hero-note{font-size:13px;color:var(--fg-muted);display:flex;align-items:center;gap:6px;margin-bottom:56px;}
.hero-note svg{color:var(--accent);}
.hero-proof-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;width:min(100%,760px);margin:0 auto 52px;}
.hero-proof-item{display:grid;gap:3px;padding:14px 16px;border:1px solid rgba(255,255,255,0.13);border-radius:8px;background:rgba(255,255,255,0.09);backdrop-filter:blur(14px);text-align:left;}
.hero-proof-item strong{font-family:var(--font-head);font-size:22px;line-height:1;color:#ffffff;letter-spacing:0;}
.hero-proof-item span{font-size:12px;font-weight:700;line-height:1.35;color:rgba(255,255,255,0.66);}

/* Mockup - white cards on purple */
.hero-mockup{width:100%;max-width:960px;margin:0 auto;overflow:visible;}
.hero-mockup.reveal.visible{clip-path:inset(-80px -120px -100px -120px);}
@keyframes floatY{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
.float-anim{animation:floatY 6s ease-in-out infinite;}
.mockup-window{background:#FFFFFF;border:1px solid rgba(0,0,0,0.05);border-radius:20px;overflow:hidden;box-shadow:0 26px 64px rgba(0,0,0,.22),0 10px 28px rgb(from var(--primary) r g b / .16),0 0 0 1px rgba(255,255,255,.08),inset 0 1px 0 rgba(255,255,255,.5);}
.mockup-bar{background:#F4F1FA;height:44px;display:flex;align-items:center;padding:0 18px;gap:8px;border-bottom:1px solid rgba(43,29,21,0.06);}
.mdot{width:12px;height:12px;border-radius:50%;}
.mdot-r{background:#FF5F57;}.mdot-y{background:#FEBC2E;}.mdot-g{background:#28C840;}
.mockup-bar-title{flex:1;text-align:center;font-size:12px;color:var(--fg-on-white-mut);margin-right:52px;font-weight:500;}
.mockup-content{display:grid;grid-template-columns:200px 1fr;min-height:380px;background:#FFFFFF;}
.mockup-sidebar{background:#FAF8FE;border-right:1px solid rgba(43,29,21,0.06);padding:20px 14px;display:flex;flex-direction:column;gap:4px;}
.mnav{padding:8px 12px;border-radius:8px;font-size:12px;color:var(--fg-on-white-mut);display:flex;align-items:center;gap:8px;font-weight:500;}
.mnav.act{background:#F0E9FF;color:var(--brand);}
.mnav-ico{width:15px;height:15px;border-radius:4px;background:currentColor;opacity:.45;flex-shrink:0;}
.mockup-main{padding:22px;display:flex;flex-direction:column;gap:14px;color:var(--fg-on-white);}
.mockup-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.ms-card{background:#FAF8FE;border:1px solid rgba(43,29,21,0.06);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:5px;}
.ms-label{font-size:10px;color:var(--fg-on-white-mut);text-transform:uppercase;letter-spacing:.6px;font-weight:600;}
.ms-val{font-family:var(--font-head);font-size:22px;font-weight:700;line-height:1;letter-spacing:-0.5px;color:var(--fg-on-white);}
.ms-chg{font-size:11px;color:#1ABE7E;font-weight:600;}
.mockup-bottom{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.mc-box{background:#FAF8FE;border:1px solid rgba(43,29,21,0.06);border-radius:12px;padding:14px;}
.mc-title{font-size:11px;font-weight:600;color:var(--fg-on-white-mut);margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px;}
.chart-bars{display:flex;align-items:flex-end;gap:5px;height:72px;}
.cb{flex:1;border-radius:4px 4px 0 0;background:#E8E0F4;transition:height 1.2s cubic-bezier(.16,1,.3,1);}
.cb.ac{background:linear-gradient(to top,var(--brand),#7950C8);}
.order-list{display:flex;flex-direction:column;gap:8px;}
.order-row{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--fg-on-white);}
.order-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;}
.order-name{flex:1;font-weight:500;}
.order-val{color:var(--brand);font-weight:700;}
/* Dashboard status text with dot prefix */
.order-status{padding:0;border-radius:0;font-size:10px;font-weight:700;display:inline-flex;align-items:center;gap:5px;border:0;}
.order-status::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;}
.s-new{background:transparent;color:#0F8050;border-color:transparent;}
.s-prep{background:transparent;color:#9F7400;border-color:transparent;}
.s-done{background:transparent;color:#6B5D5A;border-color:transparent;}

/* Supy-inspired hero composition */
.hero-supy-inspired{
  min-height:auto;
  isolation:isolate;
  align-items:stretch;
  padding-top:154px;
  padding-bottom:64px;
  background:var(--primary);
}
.hero-supy-inspired::after{
  content:"";
  position:absolute;
  left:-12vw;
  right:-12vw;
  bottom:-34px;
  z-index:4;
  display:block;
  height:84px;
  pointer-events:none;
  background:#ffffff;
  border-radius:50% 50% 0 0 / 70% 70% 0 0;
  box-shadow:0 -10px 28px rgb(from var(--primary) r g b / .1);
  transform:none;
  transform-origin:50% 100%;
}
.hero-supy-inspired > :not(.hero-bg-img):not(.hero-glow):not(.hero-dots){
  position:relative;
  z-index:3;
}
.hero-supy-inspired .hero-bg-img{
  background:var(--primary) url("../assets/images/supy-hero-gradient-bg.avif") center center / cover no-repeat;
  opacity:1;
}
.hero-supy-inspired .hero-bg-img::before{
  background:
    repeating-linear-gradient(90deg,transparent 0,transparent 16.62%,rgba(255,255,255,.04) 16.68%,transparent 16.78%),
    linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,0) 45%);
  background-size:100% 100%,100% 100%;
  opacity:.5;
}
.hero-supy-inspired .hero-bg-img::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgb(from var(--primary) r g b / .08) 0%,transparent 24%,transparent 76%,rgb(from var(--primary) r g b / .16) 100%);
  opacity:1;
}
.hero-supy-inspired .hero-glow{
  display:none;
}
.hero-supy-inspired .hero-dots{
  background-image:
    linear-gradient(rgba(255,255,255,.032) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.034) 1px,transparent 1px);
  background-size: 100% 240px, min(18vw, 280px) 100%;
  background-position: center top;
  mask-image:linear-gradient(90deg,transparent 0%,black 8%,black 92%,transparent 100%);
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,black 8%,black 92%,transparent 100%);
  opacity:.34;
}
.hero-shell{
  position:relative;
  width:min(100%,1220px);
  margin:0 auto;
  display:grid;
  grid-template-rows:auto auto;
  justify-items:center;
}
.hero-shell::before,
.hero-shell::after{
  content:"";
  position:absolute;
  z-index:0;
  pointer-events:none;
  mix-blend-mode:screen;
}
.hero-shell::before{
  display:none;
}
.hero-shell::after{
  display:none;
}
.hero-copy{
  position:relative;
  z-index:1;
  display:grid;
  justify-items:center;
  text-align:center;
}
.hero-supy-inspired .hero h1,
.hero-supy-inspired h1{
  max-width:1060px;
  margin-bottom:20px;
  font-weight:520;
  font-size:clamp(52px,5.2vw,74px);
  line-height:1.05;
  letter-spacing:0;
}
.hero-supy-inspired h1 em{
  display:inline;
  white-space:normal;
  font-style:normal;
  color:#fff;
  background:none;
  -webkit-text-fill-color:currentColor;
}
.hero-supy-inspired .hero-title-mobile::after{
  display:none;
}
.hero-supy-inspired .hero-sub{
  max-width:760px;
  margin-bottom:40px;
  font-size:clamp(16px,1.4vw,19px);
  color:rgba(255,255,255,.82);
  line-height:1.55;
  font-weight:400;
}
.hero-supy-inspired .hero-ctas{
  margin-bottom:56px;
  gap:12px;
}
.hero-supy-inspired .hero-ctas .btn{
  justify-content:center;
  min-width:fit-content;
  max-width:min(100%,360px);
  white-space:normal;
  text-align:center;
  line-height:1.2;
}
.hero-supy-inspired .hero-ctas .btn span{
  min-width:0;
}
.hero-supy-inspired .hero-secondary-cta{
  gap:9px;
  color:#fff;
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.24);
}
.hero-supy-inspired .hero-secondary-cta:hover{
  background:rgba(255,255,255,.11);
}
.hero-supy-inspired .hero-secondary-cta::before,
.hero-supy-inspired .hero-secondary-cta::after{
  display:none;
}
.hero-product-stage{
  position:relative;
  width:min(100%,1040px);
  min-height:440px;
  display:flex;
  justify-content:center;
  overflow:visible;
  padding:0 42px 0 0;
  margin-left:clamp(24px,3.8vw,52px);
}
.hero-product-stage.reveal.visible{
  clip-path:inset(-80px -140px -110px -140px);
}
.ops-dashboard{
  position:relative;
  z-index:1;
  width:min(100%,800px);
  min-height:418px;
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  grid-template-rows:auto auto auto auto;
  column-gap:16px;
  padding:18px 20px 22px;
  color:#2b1d15;
  text-align:left;
  border:1px solid rgba(255,255,255,.3);
  border-radius:20px;
  background:rgba(255,255,255,.2);
  box-shadow:0 16px 48px rgba(15,5,48,.12), inset 0 1px 0 rgba(255,255,255,.24);
  backdrop-filter:blur(10px);
  overflow:hidden;
}
.ops-dashboard::after{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:3;
  border-radius:inherit;
  background:linear-gradient(108deg,transparent 16%,rgba(255,255,255,.08) 36%,rgba(255,255,255,.42) 48%,rgba(255,255,255,.08) 60%,transparent 78%);
  opacity:0;
  translate:-118% 0;
  pointer-events:none;
}
.ops-dashboard-topbar{
  display:grid;
  grid-column:1 / -1;
  grid-template-columns:28px auto 1fr;
  align-items:center;
  gap:16px;
  margin-bottom:14px;
  color:rgba(255,255,255,.88);
}
.ops-menu-icon{
  display:grid;
  gap:4px;
  width:18px;
}
.ops-menu-icon span{
  height:1px;
  background:rgba(255,255,255,.82);
}
.ops-dashboard-title{
  font-size:14px;
  font-weight:500;
  letter-spacing:0;
}
.ops-topbar-actions{
  display:flex;
  align-items:center;
  justify-self:end;
  gap:8px;
}
.ops-topbar-actions span{
  width:22px;
  height:24px;
  display:flex;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.23);
  background:rgba(255,255,255,.065);
}
.ops-topbar-actions .ops-branch-pill{
  width:160px;
  height:24px;
  justify-content:flex-start;
  align-items:center;
  padding:0 12px;
  border-radius:999px;
  color:rgba(255,255,255,.86);
  font-size:10px;
  font-weight:650;
}
.ops-topbar-actions .ops-avatar{
  width:24px;
  background:linear-gradient(135deg,#ffe2b4,#5ed5ae 48%,#774fc0);
  border:0;
}
.ops-sidebar{
  grid-column:1;
  grid-row:2 / span 4;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:16px;
  padding-top:1px;
}
.ops-sidebar span{
  width:28px;
  height:28px;
  position:relative;
  display:block;
  border-radius:8px;
  color:rgba(255,255,255,.55);
}
.ops-sidebar span::before,
.ops-sidebar span::after{
  content:"";
  position:absolute;
  inset:8px;
  border:1px solid currentColor;
  border-radius:2px;
}
.ops-sidebar span::after{
  inset:auto 9px 7px;
  height:1px;
  border:0;
  background:currentColor;
}
.ops-sidebar .is-active{
  background:#fff;
  color:var(--primary);
  box-shadow:0 10px 24px rgba(255,255,255,.22);
}
.ops-sidebar .is-active::before{
  width:5px;
  height:5px;
  inset:7px auto auto 7px;
  border:0;
  border-radius:2px;
  background:currentColor;
  box-shadow:9px 0 0 currentColor,0 9px 0 currentColor,9px 9px 0 currentColor;
}
.ops-sidebar .is-active::after{
  display:none;
}
.ops-filter-row{
  grid-column:2;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  max-width:330px;
  margin-bottom:10px;
  color:rgba(255,255,255,.78);
  font-size:11px;
  font-weight:650;
}
.ops-filter-row span{
  min-height:26px;
  display:inline-flex;
  align-items:center;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:6px;
  background:rgb(from var(--primary) r g b / .2);
}
.ops-filter-row .ops-filter-label{
  color:#fff;
  background:rgb(from var(--primary) r g b / .2);
}
.ops-toggle-row{
  grid-column:2;
  justify-self:end;
  display:flex;
  align-items:center;
  gap:8px;
  min-height:22px;
  margin-top:-32px;
  margin-bottom:10px;
  color:rgba(255,255,255,.75);
  font-size:9px;
  font-weight:600;
}
.ops-toggle-row i{
  width:24px;
  height:14px;
  position:relative;
  display:block;
  border-radius:999px;
  background:rgba(255,255,255,.34);
}
.ops-toggle-row i::before{
  content:"";
  position:absolute;
  top:2px;
  right:2px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#fff;
}
.ops-metric-grid{
  grid-column:2;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:12px;
}
.ops-metric-card,
.ops-chart-card{
  border:1px solid rgb(from var(--primary) r g b / .09);
  border-radius:8px;
  background:rgba(255,255,255,.92);
  box-shadow:0 0 0 3px rgba(255,255,255,.1),0 10px 24px rgba(31,13,73,.06);
}
.ops-metric-card{
  min-height:88px;
  display:grid;
  align-content:center;
  gap:12px;
  padding:16px 14px;
}
.ops-metric-card span{
  color:#241b32;
  font-size:11px;
  font-weight:680;
}
.ops-metric-card strong{
  color:#0e071e;
  font-family:var(--font-head);
  font-size:24px;
  line-height:1;
  letter-spacing:0;
}
.ops-metric-card small{
  color:var(--primary);
  font-size:10px;
  font-weight:700;
  text-transform:uppercase;
}
.ops-chart-grid{
  grid-column:2;
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:12px;
}
.ops-chart-card{
  min-height:196px;
  padding:16px 18px;
}
.ops-chart-heading{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:20px;
}
.ops-chart-heading strong{
  color:#120a22;
  font-size:13px;
  line-height:1.2;
  font-weight:740;
}
.ops-chart-heading span{
  color:#7f748b;
  font-size:10px;
  font-weight:650;
}
.ops-bar-chart{
  display:grid;
  gap:13px;
}
.ops-bar-row{
  display:grid;
  grid-template-columns:64px repeat(4,minmax(0,1fr));
  align-items:center;
  gap:6px;
}
.ops-bar-row span{
  color:#2d2436;
  font-size:10px;
  font-weight:680;
}
.ops-bar-row i{
  width:var(--w);
  max-width:100%;
  height:6px;
  display:block;
  border-radius:999px;
  background:var(--primary);
}
.ops-bar-row i.is-pos{
  background:#ff783c;
}
.ops-bar-row i.is-qr{
  background:#fbd24d;
}
.ops-bar-row i.is-delivery{
  background:#6adcb0;
}
.ops-legend{
  display:flex;
  align-items:center;
  gap:18px;
  margin-top:18px;
  color:#2d2436;
  font-size:9px;
  font-weight:600;
}
.ops-legend span{
  display:inline-flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
}
.ops-legend i{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--primary);
}
.ops-legend span:nth-child(2) i{background:#ff783c;}
.ops-legend span:nth-child(3) i{background:#fbd24d;}
.ops-legend span:nth-child(4) i{background:#6adcb0;}
.ops-line-chart{
  display:grid;
  gap:18px;
  padding-top:3px;
}
.ops-line-chart span{
  width:var(--w);
  height:6px;
  display:block;
  border-radius:999px;
  background:var(--primary);
  box-shadow:90px 0 0 #fbd24d;
}
.ops-cost-chart{
  display:grid;
  gap:16px;
  padding-top:5px;
}
.ops-cost-row{
  display:grid;
  grid-template-columns:64px 1fr;
  align-items:center;
  gap:8px;
}
.ops-cost-row span{
  color:#2d2436;
  font-size:10px;
  font-weight:680;
}
.ops-cost-row i{
  position:relative;
  height:7px;
  display:block;
}
.ops-cost-row i::before,
.ops-cost-row i::after{
  content:"";
  position:absolute;
  top:0;
  left:0;
  height:6px;
  border-radius:999px;
}
.ops-cost-row i::before{
  width:var(--a);
  background:var(--primary);
  z-index:2;
}
.ops-cost-row i::after{
  width:var(--t);
  background:#fbd24d;
  z-index:1;
}
.ops-legend-cost{
  justify-content:center;
}
.ops-legend-cost span:nth-child(2) i{background:#fbd24d;}
.scan-phone{
  position:absolute;
  z-index:5;
  right:-14px;
  top:64px;
  bottom:auto;
  width:208px;
  min-height:352px;
  padding:18px 12px 20px;
  display:grid;
  justify-items:center;
  align-content:start;
  color:#fff;
  border:1px solid rgba(255,255,255,.3);
  border-radius:20px;
  background:rgba(255,255,255,.2);
  box-shadow:0 16px 48px rgba(15,5,48,.12), inset 0 1px 0 rgba(255,255,255,.24);
  backdrop-filter:blur(10px);
}
.scan-phone::before{
  content:"";
  position:absolute;
  z-index:0;
  left:10px;
  top:58px;
  width:58px;
  height:132px;
  background:linear-gradient(90deg,rgba(255,255,255,.96),rgba(255,255,255,0));
  filter:blur(12px);
  opacity:.48;
  pointer-events:none;
}
.scan-phone > *{
  position:relative;
  z-index:1;
}
.scan-phone-top{
  position:relative;
  z-index:1;
  width:100%;
  display:grid;
  grid-template-columns:28px 1fr 28px;
  align-items:center;
  gap:8px;
  margin-bottom:14px;
}
.scan-phone-top strong{
  min-width:0;
  overflow:hidden;
  text-align:center;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:14px;
  font-weight:750;
  letter-spacing:0;
}
.scan-back,
.scan-filter{
  width:24px;
  height:24px;
  display:block;
  border-radius:50%;
  background:#fff;
  color:var(--primary);
  box-shadow:0 10px 24px rgba(255,255,255,.28);
}
.scan-back::before{
  content:"";
  display:block;
  width:7px;
  height:7px;
  margin:8px 0 0 9px;
  border-left:2px solid currentColor;
  border-bottom:2px solid currentColor;
  transform:rotate(45deg);
}
.scan-filter::before,
.scan-filter::after{
  content:"";
  display:block;
  width:10px;
  height:2px;
  margin:7px auto 0;
  border-radius:999px;
  background:currentColor;
}
.scan-filter::after{
  width:6px;
  margin-top:3px;
}
.scan-location{
  position:relative;
  z-index:1;
  min-height:24px;
  display:inline-flex;
  align-items:center;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.17);
  border-radius:999px;
  color:rgba(255,255,255,.72);
  font-size:10px;
  font-weight:650;
}
.scan-phone p{
  position:relative;
  z-index:1;
  margin:16px 0 10px;
  color:rgba(255,255,255,.78);
  font-size:12px;
  font-weight:700;
}
.qr-card{
  position:relative;
  z-index:2;
  width:136px;
  height:136px;
  display:block;
  max-width:100%;
  padding:18px;
  border:4px solid rgba(255,255,255,.75);
  border-radius:20px;
  background:#fff;
  box-shadow:0 -10px 24px rgba(255,255,255,.36);
  overflow:hidden;
}
.qr-card::after{
  content:"";
  position:absolute;
  left:14px;
  right:14px;
  top:18px;
  height:12px;
  border-radius:999px;
  background:linear-gradient(180deg,rgba(255,255,255,0),rgb(from var(--primary) r g b / .2) 42%,rgba(105,218,175,.92) 52%,rgba(255,255,255,0));
  box-shadow:0 0 20px rgba(105,218,175,.5),0 0 34px rgba(255,255,255,.55);
  opacity:0;
  pointer-events:none;
}
.qr-code-svg{
  width:100%;
  height:100%;
  display:block;
  color:#0e071e;
  shape-rendering:crispEdges;
}
.qr-code-svg path{
  fill:currentColor;
}
.scan-button{
  position:relative;
  z-index:2;
  min-height:30px;
  margin-top:10px;
  padding:0 13px;
  border:0;
  border-radius:5px;
  background:#fbd24d;
  color:var(--primary);
  font-size:10px;
  font-weight:850;
}
.hero-rating-badge{
  position:absolute;
  left:0;
  bottom:18px;
  z-index:2;
  min-height:42px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:8px 13px;
  border-radius:8px;
  background:rgba(255,255,255,.14);
  color:#fff;
  box-shadow:0 16px 34px rgba(15,5,48,.16);
  backdrop-filter:blur(14px);
}
.rating-mark{
  width:25px;
  height:25px;
  display:inline-grid;
  place-items:center;
  border-radius:50%;
  background:#ff492c;
  font-weight:900;
  font-size:13px;
}
.hero-rating-badge strong{
  font-size:18px;
  line-height:1;
  letter-spacing:0;
}
.rating-stars{
  color:#fff;
  font-size:13px;
  letter-spacing:1px;
  white-space:nowrap;
}

.hero-product-stage .ops-dashboard,
.hero-product-stage .ops-dashboard-topbar,
.hero-product-stage .ops-sidebar,
.hero-product-stage .ops-filter-row,
.hero-product-stage .ops-toggle-row,
.hero-product-stage .ops-metric-card,
.hero-product-stage .ops-chart-card,
.hero-product-stage .ops-legend span,
.hero-product-stage .ops-bar-row span,
.hero-product-stage .ops-cost-row span,
.hero-product-stage .scan-phone,
.hero-product-stage .hero-rating-badge{
  opacity:0;
  will-change:opacity,translate,scale,filter,clip-path;
}
.hero-product-stage .ops-bar-row i{
  transform:scaleX(0);
  transform-origin:left center;
  will-change:transform,opacity;
}
.hero-product-stage .ops-cost-row i::before,
.hero-product-stage .ops-cost-row i::after{
  transform:scaleX(0);
  transform-origin:left center;
  will-change:transform;
}
.hero-product-stage.visible .ops-dashboard{
  animation:heroDashboardIn 1.25s cubic-bezier(.16,1,.3,1) .65s both;
}
.hero-product-stage.visible .ops-dashboard::after{
  animation:heroDashboardSweep 1.8s cubic-bezier(.16,1,.3,1) 1.5s both;
}
.hero-product-stage.visible .ops-dashboard-topbar{
  animation:heroUiRise .85s cubic-bezier(.16,1,.3,1) 1.2s both;
}
.hero-product-stage.visible .ops-sidebar{
  animation:heroSidebarIn .9s cubic-bezier(.16,1,.3,1) 1.35s both;
}
.hero-product-stage.visible .ops-filter-row{
  animation:heroUiRise .8s cubic-bezier(.16,1,.3,1) 1.5s both;
}
.hero-product-stage.visible .ops-toggle-row{
  animation:heroUiRise .8s cubic-bezier(.16,1,.3,1) 1.65s both;
}
.hero-product-stage.visible .ops-metric-card{
  animation:heroCardIn .9s cubic-bezier(.16,1,.3,1) both;
}
.hero-product-stage.visible .ops-metric-card:nth-child(1){animation-delay:1.85s;}
.hero-product-stage.visible .ops-metric-card:nth-child(2){animation-delay:2.05s;}
.hero-product-stage.visible .ops-metric-card:nth-child(3){animation-delay:2.25s;}
.hero-product-stage.visible .ops-metric-card:nth-child(4){animation-delay:2.45s;}
.hero-product-stage.visible .ops-chart-card{
  animation:heroChartIn 1s cubic-bezier(.16,1,.3,1) both;
}
.hero-product-stage.visible .ops-chart-card:nth-child(1){animation-delay:2.75s;}
.hero-product-stage.visible .ops-chart-card:nth-child(2){animation-delay:2.95s;}
.hero-product-stage.visible .ops-bar-row span,
.hero-product-stage.visible .ops-cost-row span{
  animation:heroLabelIn .55s ease both;
}
.hero-product-stage.visible .ops-bar-row i,
.hero-product-stage.visible .ops-cost-row i::before,
.hero-product-stage.visible .ops-cost-row i::after{
  animation:heroTrackGrow .9s cubic-bezier(.16,1,.3,1) both;
}
.hero-product-stage.visible .ops-bar-row:nth-child(1) span,
.hero-product-stage.visible .ops-cost-row:nth-child(1) span{animation-delay:3.45s;}
.hero-product-stage.visible .ops-bar-row:nth-child(2) span,
.hero-product-stage.visible .ops-cost-row:nth-child(2) span{animation-delay:3.62s;}
.hero-product-stage.visible .ops-bar-row:nth-child(3) span,
.hero-product-stage.visible .ops-cost-row:nth-child(3) span{animation-delay:3.79s;}
.hero-product-stage.visible .ops-bar-row:nth-child(4) span,
.hero-product-stage.visible .ops-cost-row:nth-child(4) span{animation-delay:3.96s;}
.hero-product-stage.visible .ops-bar-row:nth-child(1) i,
.hero-product-stage.visible .ops-cost-row:nth-child(1) i::before,
.hero-product-stage.visible .ops-cost-row:nth-child(1) i::after{animation-delay:3.52s;}
.hero-product-stage.visible .ops-bar-row:nth-child(2) i,
.hero-product-stage.visible .ops-cost-row:nth-child(2) i::before,
.hero-product-stage.visible .ops-cost-row:nth-child(2) i::after{animation-delay:3.69s;}
.hero-product-stage.visible .ops-bar-row:nth-child(3) i,
.hero-product-stage.visible .ops-cost-row:nth-child(3) i::before,
.hero-product-stage.visible .ops-cost-row:nth-child(3) i::after{animation-delay:3.86s;}
.hero-product-stage.visible .ops-bar-row:nth-child(4) i,
.hero-product-stage.visible .ops-cost-row:nth-child(4) i::before,
.hero-product-stage.visible .ops-cost-row:nth-child(4) i::after{animation-delay:4.03s;}
.hero-product-stage.visible .ops-legend span{
  animation:heroLegendIn .55s ease both;
}
.hero-product-stage.visible .ops-legend span:nth-child(1){animation-delay:4.25s;}
.hero-product-stage.visible .ops-legend span:nth-child(2){animation-delay:4.38s;}
.hero-product-stage.visible .ops-legend span:nth-child(3){animation-delay:4.51s;}
.hero-product-stage.visible .ops-legend span:nth-child(4){animation-delay:4.64s;}
.hero-product-stage.visible .scan-phone{
  animation:heroPhoneIn 1.1s cubic-bezier(.16,1,.3,1) 3.1s both;
}
.hero-product-stage.visible .qr-card::after{
  animation:heroQrSweep 1.7s cubic-bezier(.16,1,.3,1) 4.65s both;
}
.hero-product-stage.visible .hero-rating-badge{
  animation:heroBadgeIn .9s cubic-bezier(.16,1,.3,1) 3.65s both;
}
.hero-product-stage.visible .ops-avatar{
  animation:heroAvatarPulse 2.8s ease-in-out 5.2s infinite;
}

@keyframes heroDashboardIn{
  0%{opacity:0;translate:0 24px;scale:.98;filter:blur(4px);clip-path:inset(8% 6% 16% 6% round 24px);}
  62%{opacity:1;filter:blur(0);clip-path:inset(0 round 20px);}
  100%{opacity:1;translate:0 0;scale:1;filter:none;clip-path:inset(0 round 20px);}
}
@keyframes heroDashboardSweep{
  0%{opacity:0;translate:-118% 0;}
  18%,72%{opacity:.8;}
  100%{opacity:0;translate:118% 0;}
}
@keyframes heroUiRise{
  0%{opacity:0;translate:0 10px;filter:blur(2px);}
  100%{opacity:1;translate:0 0;filter:none;}
}
@keyframes heroSidebarIn{
  0%{opacity:0;translate:-12px 0;filter:blur(2px);}
  100%{opacity:1;translate:0 0;filter:none;}
}
@keyframes heroCardIn{
  0%{opacity:0;translate:0 14px;scale:.98;filter:blur(3px);}
  78%{opacity:1;scale:1.012;}
  100%{opacity:1;translate:0 0;scale:1;filter:none;}
}
@keyframes heroChartIn{
  0%{opacity:0;translate:0 16px;scale:.985;filter:blur(3px);clip-path:inset(0 0 20% 0 round 8px);}
  100%{opacity:1;translate:0 0;scale:1;filter:none;clip-path:inset(0 round 8px);}
}
@keyframes heroLabelIn{
  0%{opacity:0;translate:-8px 0;}
  100%{opacity:1;translate:0 0;}
}
@keyframes heroTrackGrow{
  0%{opacity:.35;transform:scaleX(0);}
  100%{opacity:1;transform:scaleX(1);}
}
@keyframes heroLegendIn{
  0%{opacity:0;translate:0 6px;filter:blur(4px);}
  100%{opacity:1;translate:0 0;filter:none;}
}
@keyframes heroPhoneIn{
  0%{opacity:0;translate:24px 12px;scale:.96;filter:blur(3px);}
  72%{opacity:1;scale:1.018;filter:blur(0);}
  100%{opacity:1;translate:0 0;scale:1;filter:none;}
}
@keyframes heroQrSweep{
  0%{opacity:0;translate:0 -2px;}
  12%{opacity:1;}
  82%{opacity:1;translate:0 88px;}
  100%{opacity:0;translate:0 98px;}
}
@keyframes heroBadgeIn{
  0%{opacity:0;translate:-14px 10px;scale:.96;filter:blur(3px);}
  72%{opacity:1;scale:1.02;filter:blur(0);}
  100%{opacity:1;translate:0 0;scale:1;filter:none;}
}
@keyframes heroAvatarPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(105,218,175,0);}
  45%{box-shadow:0 0 0 7px rgba(105,218,175,.16);}
}

/* =========================================================
   MISSION BAND
   ========================================================= */
.proof-band{padding:var(--section-y) 0;border-top:1px solid rgba(43,29,21,.08);border-bottom:1px solid rgba(43,29,21,.08);background:#fff;}
.mission-band{position:relative;z-index:1;display:flex;align-items:center;min-height:auto;overflow-x:clip;overflow-y:visible;padding:clamp(112px,8vw,144px) 0;border-top:0;border-bottom:0;background:#ffffff;color:#10204a;}
.mission-band::before{display:none;}
.mission-band::after{content:"";position:absolute;left:-12vw;right:-12vw;bottom:-34px;z-index:1;display:block;height:84px;pointer-events:none;background:#ffffff;border-radius:0 0 50% 50% / 0 0 70% 70%;box-shadow:0 10px 28px rgb(from var(--primary) r g b / .08);transform:none;transform-origin:50% 0;}
.mission-band .container{max-width:1320px;overflow:visible;}
.mission-band-inner{position:relative;z-index:2;display:grid;grid-template-columns:minmax(520px,.95fr) minmax(520px,1fr);align-items:center;gap:clamp(48px,4vw,72px);}
.mission-visual{position:relative;}
.mission-comparison-shell{--mission-comparison-radius:18px;max-width:760px;margin:0;border:8px solid rgb(from var(--primary) r g b / .1);border-radius:24px;background:#ffffff;padding:0;box-shadow:0 0 0 1px rgb(from var(--primary) r g b / .04),0 24px 54px rgba(21,33,78,.12);overflow:hidden;isolation:isolate;clip-path:inset(0 round 24px);}
.mission-comparison-slider{display:block;width:100%;aspect-ratio:1408 / 768;overflow:hidden;border-radius:var(--mission-comparison-radius);outline:none;box-shadow:none;clip-path:inset(0 round var(--mission-comparison-radius));transform:translateZ(0);--divider-width:3px;--divider-color:var(--primary);--default-handle-opacity:1;}
.mission-comparison-slider.is-auto-animated{--divider-shadow:0 0 20px rgb(from var(--primary) r g b / .28);}
.mission-comparison-slider:focus,.mission-comparison-slider:focus-visible{outline:none;}
.mission-comparison-slider .mission-comparison-frame{display:block;width:100%;height:100%;margin:0;overflow:hidden;border-radius:var(--mission-comparison-radius);clip-path:inset(0 round var(--mission-comparison-radius));}
.mission-comparison-slider img{display:block;width:100%;height:100%;object-fit:cover;border-radius:var(--mission-comparison-radius);}
.mission-comparison-handle{width:42px;color:var(--primary);filter:drop-shadow(0 10px 22px rgb(from var(--primary) r g b / .22));}
.mission-comparison-handle svg{display:block;}
.mission-copy{max-width:680px;justify-self:start;}
.mission-copy .section-eyebrow{margin-left:0;margin-right:0;margin-bottom:18px;background:transparent;border:0;color:var(--primary);}
.mission-copy h2{font-family:var(--font-head);max-width:680px;margin:0 0 18px;font-size:clamp(34px,3.6vw,56px);font-weight:740;line-height:1.02;letter-spacing:-1.8px;color:#0b1f52;text-wrap:balance;}
.mission-copy p:last-child{max-width:620px;margin:0;color:#526184;font-size:18px;line-height:1.65;letter-spacing:-0.01em;}

/* =========================================================
   STATS BAND
   ========================================================= */
.stats-band{padding:var(--section-y) 0;background:var(--bg);}
.stats-intro{max-width:960px;margin:0 0 56px;text-align:left;}
.stats-intro .section-eyebrow{margin-left:0;margin-right:0;}
.stats-intro .section-title{max-width:940px;margin-bottom:16px;font-size:clamp(32px,4vw,52px);}
.stats-intro .section-sub{max-width:680px;margin:0;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);}
.stat-item{text-align:center;padding:32px 20px;border-right:1px solid var(--border);position:relative;}
.stat-item:last-child{border-right:none;}
.stat-big{font-family:var(--font-head);font-size:56px;font-weight:700;line-height:1;margin-bottom:8px;letter-spacing:-2px;color:var(--fg);}
.stat-big .ac{background:linear-gradient(135deg,var(--accent) 0%,#fcd34d 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.stat-desc{font-size:14px;color:var(--fg-muted);font-weight:500;}
.stat-sparkline{margin-top:14px;}

/* =========================================================
   FEATURES - product bento
   ========================================================= */
.features{padding:var(--section-y) 0;background:var(--bg);}
.section-eyebrow{display:inline-flex;align-items:center;gap:10px;padding:0;border:0;border-radius:0;background:transparent;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:18px;backdrop-filter:none;}
.section-eyebrow::before{content:'';width:28px;height:1px;border-radius:0;background:currentColor;box-shadow:none;opacity:.72;}
.section-title{font-family:var(--font-head);font-size:clamp(30px,4.5vw,56px);font-weight:700;letter-spacing:-2px;line-height:1.05;margin-bottom:16px;text-wrap:balance;color:var(--fg);}
.section-sub{font-size:17px;color:var(--fg-muted);font-weight:400;line-height:1.55;letter-spacing:-0.005em;}
.features-intro{display:flex;max-width:900px;flex-direction:column;align-items:flex-start;gap:18px;margin:0 0 80px;text-align:left;}
.features-intro .section-eyebrow{margin-left:0;margin-right:0;}
.features-intro .section-title{max-width:900px;margin-bottom:0;}
.features-intro .section-sub{max-width:720px;margin-left:0;margin-right:0;}

/* Feature bento grid */
.bento{display:grid;grid-template-columns:repeat(12,1fr);grid-template-rows:auto;gap:3px;background:var(--border);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;}
.bento-card{background:var(--bg-2);padding:36px;display:flex;flex-direction:column;gap:14px;transition:background .25s;position:relative;overflow:hidden;}
.bento-card:hover{background:var(--bg-3);}
.bento-card::after{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(184,157,255,0.12) 0%,transparent 55%);opacity:0;transition:opacity .3s;}
.bento-card:hover::after{opacity:1;}
/* layout */
.bc-wide{grid-column:span 7;}
.bc-narrow{grid-column:span 5;}
.bc-third{grid-column:span 4;}
.bc-half{grid-column:span 6;}

.feat-icon{width:46px;height:46px;border-radius:12px;background:var(--bg-glass);border:1px solid var(--border-2);display:flex;align-items:center;justify-content:center;color:var(--accent);flex-shrink:0;}
.feat-icon svg{width:20px;height:20px;}
.feat-name{font-family:var(--font-head);font-size:20px;font-weight:700;letter-spacing:-0.4px;position:relative;z-index:1;color:var(--fg);}
.feat-desc{font-size:14.5px;color:var(--fg-muted);line-height:1.55;flex:1;position:relative;z-index:1;}
.feat-tag{display:block;padding:0;border-radius:0;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;background:transparent;color:var(--accent);border:0;width:fit-content;position:relative;z-index:1;}
.feat-tag::before{display:none;}

/* Photo inside bento card */
.bento-img{width:100%;border-radius:10px;overflow:hidden;margin-top:4px;aspect-ratio:16/7;flex-shrink:0;}
.bento-img picture{display:block;width:100%;height:100%;}
.bento-img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
.bento-card:hover .bento-img img{transform:scale(1.04);}

/* Inline SVG chart illustration */
.feat-chart-wrap{margin-top:6px;border-radius:12px;overflow:hidden;background:rgba(0,0,0,0.18);border:1px solid var(--border);padding:14px;}
.chat-chart-rtl{display:none !important;}
[dir="rtl"] .chat-chart-ltr{display:none !important;}
[dir="rtl"] .chat-chart-rtl{display:block !important;}
.chat-svg-label{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  overflow:hidden;
  white-space:nowrap;
  font-family:var(--font-body);
  font-size:6.2px;
  font-weight:700;
  line-height:1;
  text-align:right;
}
.chat-svg-label-accent{color:var(--accent);}
.chat-svg-label-muted{color:var(--fg-muted);}
[dir="rtl"] .floor-legend{display:none;}

/* =========================================================
   PLATFORM DEPTH
   ========================================================= */
.platform-suite{padding:var(--section-y) 0;background:#ffffff;color:#10204a;}
.platform-suite .section-eyebrow{background:transparent;border:0;color:var(--primary);}
.platform-suite .section-title{color:#0b1f52;}
.platform-suite .section-sub{color:#526184;}
.suite-header{display:flex;max-width:900px;flex-direction:column;align-items:flex-start;gap:18px;margin:0 0 56px;text-align:left;}
.suite-header .section-eyebrow{margin-left:0;margin-right:0;}
.suite-header .section-title{max-width:900px;margin-bottom:0;}
.suite-header .section-sub{max-width:720px;margin-left:0;margin-right:0;}
.suite-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.suite-card{position:relative;min-height:260px;padding:28px;border:1px solid rgb(from var(--primary) r g b / 0.12);border-radius:18px;background:#f7f9ff;overflow:hidden;box-shadow:0 18px 55px rgba(21,33,78,0.07);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.suite-card::after{content:'';position:absolute;inset:auto 18px 18px auto;width:110px;height:110px;border-radius:28px;background:linear-gradient(135deg,rgba(105,218,175,0.22),rgba(252,211,77,0.18));transform:rotate(12deg);}
.suite-card:hover{transform:translateY(-4px);box-shadow:0 28px 80px rgba(21,33,78,0.12);border-color:rgb(from var(--primary) r g b / 0.2);}
.suite-tag{display:block;padding:0;border-radius:0;background:transparent;color:var(--primary);font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;margin-bottom:34px;}
.suite-card h3{position:relative;z-index:1;font-family:var(--font-head);font-size:23px;line-height:1.12;letter-spacing:-.5px;color:#0b1f52;margin-bottom:14px;}
.suite-card p{position:relative;z-index:1;font-size:14.5px;line-height:1.65;color:#526184;}

.segment-section{padding:var(--section-y) 0;background:#ffffff;color:#10204a;}
.center-section{text-align:left;max-width:760px;margin:0 auto 56px 0;}
.center-section .section-eyebrow{margin-left:0;margin-right:auto;background:transparent;border:0;color:var(--primary);}
.center-section .section-title{color:#0b1f52;}
.center-section .section-sub{color:#526184;margin-left:0;margin-right:auto;}
.segment-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;}
.segment-card{padding:28px;border-radius:18px;background:#f7f9ff;border:1px solid rgb(from var(--primary) r g b / .1);transition:transform .25s ease,background .25s ease;}
.segment-card:hover{transform:translateY(-4px);background:#eef4ff;}
.segment-card span{display:inline-flex;color:var(--primary);font-family:var(--font-head);font-size:13px;font-weight:800;margin-bottom:34px;}
.segment-card h3{font-family:var(--font-head);font-size:23px;line-height:1.14;color:#0b1f52;margin-bottom:12px;letter-spacing:-.5px;}
.segment-card p{font-size:14.5px;line-height:1.65;color:#526184;}

.resource-section{padding:var(--section-y) 0;background:#ffffff;color:#10204a;}
.resource-header{display:flex;max-width:900px;flex-direction:column;align-items:flex-start;gap:18px;margin:0 0 56px;text-align:left;}
.resource-header .section-eyebrow{background:transparent;border:0;color:var(--primary);}
.resource-header .section-title{max-width:900px;margin-bottom:0;color:#0b1f52;}
.resource-header .section-sub{max-width:720px;margin-left:0;margin-right:0;color:#526184;}
.resource-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;}
.resource-card{display:flex;min-height:260px;flex-direction:column;padding:26px;border-radius:18px;background:#f7f9ff;border:1px solid rgb(from var(--primary) r g b / .1);box-shadow:0 18px 55px rgba(21,33,78,.07);transition:transform .25s ease,box-shadow .25s ease;}
.resource-card:hover{transform:translateY(-4px);box-shadow:0 26px 75px rgba(21,33,78,.12);}
.resource-card span{color:#0f8050;font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;margin-bottom:42px;}
.resource-card h3{font-family:var(--font-head);font-size:22px;line-height:1.14;color:#0b1f52;margin-bottom:12px;letter-spacing:-.5px;}
.resource-card p{font-size:14px;line-height:1.62;color:#526184;margin-top:auto;}
.resource-editorial{display:grid;grid-template-columns:minmax(0,0.95fr) minmax(0,1.05fr);gap:24px;align-items:stretch;}
.resource-featured-card{display:grid;grid-template-rows:minmax(0,clamp(220px,24vw,320px)) 1fr;overflow:hidden;border:1px solid rgba(23,35,28,0.11);border-radius:8px;background:#ffffff;box-shadow:0 24px 70px rgba(21,33,78,0.1);transition:transform .35s ease,box-shadow .35s ease;}
.resource-featured-card:hover{transform:translateY(-4px);box-shadow:0 32px 90px rgba(21,33,78,0.14);}
.resource-featured-card > picture{display:block;width:100%;height:100%;max-height:320px;overflow:hidden;line-height:0;background:#eef2f7;}
.resource-featured-card > picture > img{display:block;width:100%;height:100%;object-fit:cover;}
.resource-featured-card > div{display:flex;min-height:300px;flex-direction:column;padding:30px;}
.resource-featured-card span,.resource-featured-card small{color:#0f8050;font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase;}
.resource-featured-card h3{margin-top:34px;color:#10204a;font-family:var(--font-head);font-size:clamp(28px,3.4vw,44px);font-weight:850;line-height:1.02;letter-spacing:0;text-wrap:balance;}
.resource-featured-card p{margin-top:18px;color:#526184;font-size:16px;line-height:1.66;}
.resource-featured-card small{margin-top:auto;color:#10204a;}
.resource-grid-compact{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
.resource-grid-compact .resource-card{min-height:240px;border-radius:8px;background:#ffffff;}
.resource-grid-compact .resource-card span{margin-bottom:36px;}
.resource-grid-compact .resource-card h3{letter-spacing:0;}

/* =========================================================
   VISUAL FEATURE — full-bleed split
   ========================================================= */
.split-section{padding:var(--section-y) 0;background:var(--bg-2);position:relative;overflow:hidden;}
.split-section::before{content:'';position:absolute;width:700px;height:700px;border-radius:50%;background:radial-gradient(circle,rgba(184,157,255,0.20) 0%,transparent 65%);bottom:-250px;right:-150px;pointer-events:none;filter:blur(40px);}
.analytics-split::before{display:none;}
.split-inner{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center;}
.split-inner.flip{direction:rtl;}
.split-inner.flip > *{direction:ltr;}
.split-text{display:flex;flex-direction:column;gap:20px;}
.split-text .section-eyebrow{align-self:flex-start;}
[dir="rtl"] .split-inner.flip > *{direction:rtl;}
[dir="rtl"] .split-text .section-eyebrow{align-self:flex-end;}
.split-text .section-sub{max-width:440px;}
.split-bullets{list-style:none;display:flex;flex-direction:column;gap:14px;margin-top:8px;}
.split-bullets li{display:flex;align-items:flex-start;gap:12px;font-size:15px;line-height:1.5;color:var(--fg);}
.split-bullet-dot{width:22px;height:22px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;color:var(--bg);flex-shrink:0;margin-top:1px;}
.split-bullet-dot svg{width:11px;height:11px;}
.split-proof-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:4px;padding-top:18px;border-top:1px solid var(--border);}
.split-proof-metrics div{display:flex;flex-direction:column;gap:5px;}
.split-proof-metrics strong{font-family:var(--font-head);font-size:26px;font-weight:800;line-height:1.05;letter-spacing:0;color:var(--fg);}
.split-proof-metrics span{font-size:12.5px;font-weight:650;color:var(--fg-muted);}

.split-visual{border-radius:var(--radius-lg);overflow:hidden;position:relative;}
.split-visual picture{display:block;}
.split-img{width:100%;height:440px;object-fit:cover;display:block;}
.split-img-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgb(from var(--primary) r g b / .6) 0%,transparent 55%);}

/* =========================================================
   HOW IT WORKS
   ========================================================= */
.how{padding:var(--section-y) 0;background:var(--bg);}
.how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:64px;}
.how-card{background:var(--bg-2);border:1px solid var(--border);padding:36px 32px;display:flex;flex-direction:column;gap:18px;border-radius:var(--radius-lg);transition:transform .3s,background .3s;}
.how-card.reveal.visible{clip-path:inset(-24px -16px -28px -16px);}
.how-card:hover{transform:translateY(-4px);background:var(--bg-3);}
.how-num{font-family:var(--font-head);font-size:14px;font-weight:700;line-height:1;color:var(--accent);letter-spacing:0;display:inline-flex;align-items:center;gap:8px;}
.how-num::before{content:'';width:24px;height:1px;background:var(--accent);}
.how-title{font-family:var(--font-head);font-size:22px;font-weight:700;letter-spacing:-0.5px;color:var(--fg);}
.how-desc{font-size:15px;color:var(--fg-muted);line-height:1.55;}
.how-img{width:100%;border-radius:14px;overflow:hidden;aspect-ratio:4/3;margin-top:auto;}
.how-img img{width:100%;height:100%;object-fit:cover;display:block;border-radius:14px;}

/* =========================================================
   PRICING
   ========================================================= */
.pricing{padding:var(--section-y) 0;background:var(--bg-2);}
.pricing-header{text-align:center;margin-bottom:56px;}
.pricing-toggle{display:inline-flex;background:var(--bg-glass);border:1px solid var(--border-2);border-radius:var(--radius-pill);padding:4px;margin-top:28px;backdrop-filter:blur(10px);}
.toggle-btn{position:relative;overflow:hidden;isolation:isolate;-webkit-tap-highlight-color:transparent;touch-action:manipulation;padding:9px 20px;border-radius:var(--radius-pill);font-size:13.5px;font-weight:600;border:none;background:transparent;color:var(--fg-muted);transition:all .2s;display:inline-flex;align-items:center;gap:8px;}
.toggle-btn.act{background:#FFFFFF;color:var(--fg-on-white);}
.save-pill{font-size:11px;background:transparent;color:inherit;padding:0;border-radius:0;font-weight:750;border:0;opacity:.72;}
.toggle-btn.act .save-pill{background:transparent;color:inherit;border:0;opacity:.82;}
.pricing-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;max-width:980px;margin:0 auto;padding-top:18px;}
.pc{min-width:0;background:var(--bg);border:1px solid var(--border);padding:44px 32px;display:flex;flex-direction:column;gap:22px;position:relative;border-radius:var(--radius-lg);transition:transform .3s,background .3s;}
.pc:hover{transform:translateY(-4px);}
.pc.reveal.visible{clip-path:inset(-30px -18px -36px -18px);}
.pc.motion-card{overflow:visible;}
.pc.feat-pc{background:#FFFFFF;color:var(--fg-on-white);border-color:transparent;}
.pop-badge{position:absolute;top:-12px;left:50%;z-index:3;transform:translateX(-50%);background:var(--accent);color:var(--fg-on-white);font-size:10.5px;font-weight:700;text-transform:uppercase;letter-spacing:1.2px;padding:6px 14px;border-radius:var(--radius-pill);box-shadow:0 8px 24px rgba(105,218,175,0.4);white-space:nowrap;}
.plan-tier{font-family:var(--font-head);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:1.5px;color:var(--fg-muted);}
.feat-pc .plan-tier{color:var(--fg-on-white-mut);}
.plan-price-row{display:flex;align-items:baseline;gap:5px;min-width:0;white-space:nowrap;}
.plan-price-row[data-currency-position="after"] .plan-num{order:1;}
.plan-price-row[data-currency-position="after"] .plan-cur{order:2;}
.plan-price-row[data-currency-position="after"] .plan-per{order:3;}
.plan-price-row[data-currency-position="after"] .plan-num{font-size:50px;}
.plan-price-row[data-currency-position="after"] .plan-cur{font-size:17px;}
.plan-price-row[data-currency-position="after"] .plan-per{font-size:13px;}
.plan-cur{flex:0 0 auto;font-size:20px;font-weight:600;color:var(--fg-muted);}
.feat-pc .plan-cur{color:var(--fg-on-white-mut);}
.plan-num{min-width:0;font-family:var(--font-head);font-size:56px;font-weight:700;line-height:1;letter-spacing:0;color:var(--fg);}
.feat-pc .plan-num{color:var(--fg-on-white);}
.plan-per{flex:0 0 auto;font-size:14px;color:var(--fg-muted);}
.feat-pc .plan-per{color:var(--fg-on-white-mut);}
.plan-blurb{font-size:13.5px;color:var(--fg-muted);padding-bottom:22px;border-bottom:1px solid var(--border);line-height:1.5;}
.feat-pc .plan-blurb{color:var(--fg-on-white-mut);border-bottom-color:rgba(43,29,21,0.1);}
.plan-feats{list-style:none;display:flex;flex-direction:column;gap:11px;flex:1;}
.plan-feats li{font-size:13.5px;display:flex;align-items:flex-start;gap:10px;line-height:1.45;color:var(--fg);}
.feat-pc .plan-feats li{color:var(--fg-on-white);}
.chk{width:18px;height:18px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;color:var(--bg);flex-shrink:0;margin-top:1px;}
.chk svg{width:10px;height:10px;}
.chk.off{background:var(--border-2);color:var(--fg-muted);opacity:.5;}
.feat-pc .chk.off{background:rgba(43,29,21,0.08);color:var(--fg-on-white-mut);}
.plan-btn{position:relative;overflow:hidden;isolation:isolate;-webkit-tap-highlight-color:transparent;touch-action:manipulation;display:block;width:100%;padding:14px;border-radius:var(--radius-pill);font-size:14px;font-weight:600;border:1px solid var(--border-2);background:transparent;color:var(--fg);transition:all .2s;letter-spacing:-0.005em;text-align:center;}
.plan-btn:hover{background:var(--bg-glass);border-color:rgba(255,255,255,.35);}
.feat-pc .plan-btn{background:var(--brand);color:#FFFFFF;border-color:transparent;}
.feat-pc .plan-btn:hover{background:var(--bg-2);transform:translateY(-1px);box-shadow:0 8px 28px rgb(from var(--primary) r g b / 0.4);}
.plan-btn:hover,
.toggle-btn:hover{transform:translate3d(var(--magnet-x,0),calc(var(--magnet-y,0) - 2px),0);}

@media(hover:none), (pointer:coarse){
  .btn:hover::before{left:-100%;}
  .btn:hover::after,
  .plan-btn:hover::after,
  .toggle-btn:hover::after{opacity:0;}
  .btn:hover,
  .plan-btn:hover,
  .toggle-btn:hover,
  .btn:active,
  .plan-btn:active,
  .toggle-btn:active{transform:none;}
  .btn-primary:hover{background:#FFFFFF;color:var(--fg-on-white);box-shadow:none;}
  .btn-ghost:hover{background:transparent;border-color:var(--border-2);}
  .plan-btn:hover{background:transparent;border-color:var(--border-2);}
  .feat-pc .plan-btn:hover{background:var(--brand);box-shadow:none;border-color:transparent;}
  .toggle-btn.act:hover{background:#FFFFFF;color:var(--fg-on-white);}
  .hero-ctas .hero-primary-cta:hover{background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,var(--accent),var(--accent-2)) border-box;box-shadow:0 16px 36px rgba(105,218,175,.16);}
  .cta-content .btn-primary:hover{box-shadow:0 16px 36px rgba(255,255,255,.12);}
}

/* =========================================================
   CTA BAND
   ========================================================= */
.cta-band{position:relative;overflow:hidden;background:var(--bg);}
.cta-band picture{display:block;}
.cta-img{width:100%;height:520px;object-fit:cover;display:block;opacity:0.22;mix-blend-mode:luminosity;}
.cta-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgb(from var(--primary) r g b / 0.7) 0%,rgb(from var(--primary) r g b / 0.92) 100%);}
.cta-content{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--section-y) var(--section-x);}
.cta-content h2{font-family:var(--font-head);font-size:clamp(36px,5.5vw,68px);font-weight:700;letter-spacing:-2.5px;line-height:1.1;margin-bottom:24px;text-wrap:balance;}
.cta-content p{font-size:18px;color:var(--fg-muted);margin-bottom:36px;font-weight:400;}

/* =========================================================
   PHONE CAROUSEL — app showcase
   ========================================================= */
.phone-section{padding:var(--section-y) 0;position:relative;overflow:hidden;background:transparent;}
.phone-section-bg{display:none;background:transparent;}
.phone-section > .container,
.phone-carousel-wrap,
.phone-track-mask,
.phone-track,
.phone-card{background:transparent;}

.phone-carousel-wrap{position:relative;margin-top:64px;}
.phone-track-mask{overflow:hidden;touch-action:pan-y;}
.phone-track{display:flex;gap:32px;padding:0 var(--phone-edge-pad,0px);transition:transform .72s cubic-bezier(.22,1,.36,1);will-change:transform;}
.phone-track.is-snapping{transition:none !important;}
.phone-card{flex:0 0 calc((100% - 64px) / 3);display:flex;flex-direction:column;align-items:center;gap:18px;opacity:.42;transform:scale(.92);transition:transform .72s cubic-bezier(.22,1,.36,1),opacity .72s ease;}
.phone-card.is-active{opacity:1;transform:scale(1);}
.phone-card.is-near{opacity:.72;transform:scale(.96);}
.phone-card.is-edge{opacity:.32;transform:scale(.9);}
[dir="rtl"] .phone-track-mask,
[dir="rtl"] .phone-track{direction:ltr;}
[dir="rtl"] .phone-card,
[dir="rtl"] .phone-screen{direction:rtl;}

/* Phone-style mockup */
.phone-frame{width:240px;height:480px;background:#1a1024;border-radius:38px;padding:8px;box-shadow:0 0 0 1px rgba(26,16,36,0.18),inset 0 0 0 2px rgba(255,255,255,0.04);position:relative;}
.phone-screen{width:100%;height:100%;background:#FFFFFF;border-radius:30px;overflow:hidden;position:relative;display:flex;flex-direction:column;}
/* Dynamic island */
.phone-island{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:80px;height:24px;background:#000;border-radius:20px;z-index:5;}

.phone-status-bar{padding:14px 18px 0;display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:600;color:#000;height:34px;}
.phone-status-time{font-weight:700;}
.phone-status-icons{display:flex;gap:4px;align-items:center;}

.phone-header{padding:12px 18px 8px;display:flex;align-items:center;justify-content:space-between;color:#2b1d15;}
.phone-h-title{font-size:15px;font-weight:700;letter-spacing:-0.3px;font-family:var(--font-head);}
.phone-h-sub{font-size:10px;color:#999;}
.phone-avatar{width:28px;height:28px;border-radius:50%;background:linear-gradient(135deg,#69daaf,#fcd34d);}

.phone-content{flex:1;padding:10px 16px;display:flex;flex-direction:column;gap:8px;overflow:hidden;font-family:var(--font-body);color:#2b1d15;}

/* Menu item card variant */
.p-menu-item{background:#F7F4FE;border-radius:14px;padding:10px;display:flex;gap:10px;align-items:center;border:1px solid rgba(0,0,0,0.04);}
.p-menu-img{width:46px;height:46px;border-radius:10px;flex-shrink:0;background:linear-gradient(135deg,#fcd34d,#FF8C42);}
.p-menu-img.green{background:linear-gradient(135deg,#69daaf,#39A87E);}
.p-menu-img.red{background:linear-gradient(135deg,#FF6B6B,#C04444);}
.p-menu-img.purple{background:linear-gradient(135deg,#B89DFF,#7C5BD8);}
.p-menu-img.brown{background:linear-gradient(135deg,#C4956C,#8B5E3C);}
.p-menu-info{flex:1;min-width:0;}
.p-menu-name{font-size:11.5px;font-weight:600;line-height:1.2;}
.p-menu-desc{font-size:9.5px;color:#8a8189;margin-top:2px;}
.p-menu-price{font-size:11px;font-weight:700;color:var(--brand);}

/* Category tab row */
.p-cats{display:flex;gap:12px;margin-bottom:4px;overflow:hidden;flex-shrink:0;}
.p-cat{padding:0 0 4px;border-radius:0;border-bottom:1px solid transparent;font-size:10px;font-weight:700;white-space:nowrap;background:transparent;}
.p-cat.act{background:transparent;color:#2b1d15;border-bottom-color:#2b1d15;}
.p-cat.inact{background:transparent;color:#666;}

/* Search bar */
.p-search{display:flex;align-items:center;gap:6px;background:#F4F0FA;border-radius:10px;padding:8px 10px;flex-shrink:0;}
.p-search-ico{width:11px;height:11px;border-radius:50%;border:1.5px solid #888;flex-shrink:0;}
.p-search-txt{font-size:11px;color:#888;}

/* Order summary screen */
.p-order-card{background:#F7F4FE;border-radius:14px;padding:12px;}
.p-order-row{display:flex;justify-content:space-between;align-items:center;font-size:11px;padding:5px 0;}
.p-order-row.total{padding-top:8px;border-top:1px dashed #ddd;margin-top:6px;font-weight:700;font-size:13px;}
.p-order-name{color:#2b1d15;font-weight:500;}
.p-order-val{color:var(--brand);font-weight:600;}

/* Analytics screen */
.p-stat-row{display:grid;grid-template-columns:1fr 1fr;gap:6px;flex-shrink:0;}
.p-stat{background:#F7F4FE;border-radius:10px;padding:8px 10px;}
.p-stat-lbl{font-size:8.5px;color:#888;text-transform:uppercase;letter-spacing:0.4px;font-weight:600;}
.p-stat-val{font-size:16px;font-weight:700;line-height:1;margin-top:2px;font-family:var(--font-head);letter-spacing:-0.5px;}
.p-stat-chg{font-size:8.5px;color:#1ABE7E;font-weight:600;margin-top:2px;}
.p-chart-mini{background:#F7F4FE;border-radius:10px;padding:10px;flex:1;display:flex;align-items:flex-end;gap:3px;min-height:80px;}
.p-bar{flex:1;border-radius:2px 2px 0 0;background:#E3DBFF;}
.p-bar.ac{background:linear-gradient(to top,var(--brand),#5b3aa0);}

/* Phone UI status text */
.p-status{padding:0;border-radius:0;font-size:9.5px;font-weight:800;display:inline-flex;align-items:center;gap:4px;}
.p-status.live{background:transparent;color:#0F8050;}
.p-status.live::before{content:'';width:5px;height:5px;border-radius:50%;background:#1ABE7E;}

/* QR code mock */
.p-qr{width:90px;height:90px;border-radius:10px;background:
  linear-gradient(45deg,#2b1d15 25%,transparent 25%) -1px 0,
  linear-gradient(-45deg,#2b1d15 25%,transparent 25%) -1px 0,
  linear-gradient(45deg,transparent 75%,#2b1d15 75%),
  linear-gradient(-45deg,transparent 75%,#2b1d15 75%);
  background-size:8px 8px;background-color:#fff;border:2px solid #2b1d15;margin:0 auto;}

/* Phone label below */
.phone-label{text-align:center;font-family:var(--font-head);font-weight:600;color:var(--fg);font-size:15px;letter-spacing:-0.3px;}
.phone-label-sub{font-size:12px;color:var(--fg-muted);margin-top:2px;font-weight:500;}

/* Carousel controls */
.phone-dots{display:flex;justify-content:center;gap:8px;margin-top:48px;}
.phone-dot{width:6px;height:6px;border-radius:50%;background:var(--border-2);cursor:pointer;transition:all .25s;border:none;padding:0;}
.phone-dot.active{background:var(--accent);width:24px;border-radius:99px;}
.phone-dot:hover{background:var(--accent);}

/* Phone carousel — responsive widths */
@media(max-width:1024px){
  .phone-card{flex:0 0 calc((100% - 32px) / 2);}
  .phone-track{gap:32px;}
  .phone-frame{width:230px;height:460px;}
}
@media(max-width:640px){
  .phone-card{flex:0 0 100%;}
  .phone-track{gap:24px;}
  .phone-frame{width:240px;height:480px;}
  .phone-section{padding:var(--section-y) 0;}
}

/* =========================================================
   FOOTER
   ========================================================= */
footer{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(180deg,var(--bg-2) 0%,var(--primary) 62%);border-top:1px solid rgb(from var(--primary) r g b / .55);padding:clamp(84px,8vw,124px) 0 clamp(32px,4vw,48px);color:#fff;}
footer::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(180deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:120px 120px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.95),rgba(0,0,0,.4));}
footer::after{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.36),transparent);pointer-events:none;}
footer .container{position:relative;z-index:1;}
.footer-grid{display:grid;grid-template-columns:minmax(280px,1.35fr) repeat(3,minmax(150px,1fr));gap:clamp(40px,6vw,92px);align-items:start;margin-bottom:0;padding-bottom:clamp(44px,5vw,68px);}
.footer-grid-wide{grid-template-columns:minmax(280px,1.35fr) minmax(150px,.8fr) minmax(170px,.9fr) minmax(260px,1.15fr);}
.footer-brand .nav-logo{display:inline-flex;margin-bottom:18px;}
.footer-brand .nav-logo-img{height:54px;width:auto;filter:drop-shadow(0 16px 30px rgba(0,0,0,.22));}
.footer-brand p{font-size:16px;color:rgba(255,255,255,.8);max-width:360px;margin:0;line-height:1.7;}
.footer-col h2,.footer-col h4{font-family:var(--font-head);font-size:clamp(17px,1.3vw,22px);font-weight:800;letter-spacing:0;color:#fff;margin-bottom:22px;line-height:1.05;}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:13px;}
.footer-col a{font-size:15px;line-height:1.35;color:rgba(255,255,255,.72);transition:color .2s,transform .2s;}
.footer-col a:hover{color:#fff;transform:translateX(2px);}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:28px;border-top:1px solid rgba(255,255,255,.16);font-size:14px;line-height:1.45;color:rgba(255,255,255,.72);}
.footer-bottom-stack{align-items:flex-start;gap:10px;}

/* =========================================================
   SCROLL MOTION POLISH
   ========================================================= */
.scroll-scene .reveal:not(.visible):not(.motion-card){
  transform:translateY(36px) scale(.98);
  clip-path:inset(0 0 24% 0);
}
.scroll-scene .reveal-l:not(.visible){
  transform:translateX(-48px) scale(.98);
}
.scroll-scene .reveal-r:not(.visible){
  transform:translateX(48px) scale(.98);
}
.scroll-scene .reveal-scale:not(.visible){
  transform:translateY(24px) scale(.92);
}
.scroll-scene .reveal.visible,
.scroll-scene .reveal-l.visible,
.scroll-scene .reveal-r.visible,
.scroll-scene .reveal-scale.visible{
  transition-duration:.72s;
}
.motion-card.reveal:not(.visible){
  --reveal-y:48px;
  --reveal-scale:.94;
}
.motion-card.reveal.visible{
  --reveal-y:0px;
  --reveal-scale:1;
}

.hero-supy-inspired .hero-bg-img{
  transform:translate3d(0,var(--hero-bg-shift,0px),0) scale(1.035);
  transform-origin:center top;
  will-change:transform;
}
.hero-product-stage{
  translate:0 var(--hero-stage-shift,0px);
  will-change:translate;
}

.scroll-scene.stats-band .stat-sparkline *{
  transform-box:fill-box;
  transform-origin:center;
}
.scroll-scene.stats-band .stat-sparkline polyline:first-child{
  stroke-dasharray:150;
  stroke-dashoffset:150;
  transition:stroke-dashoffset .95s cubic-bezier(.16,1,.3,1) calc(.16s + var(--motion-delay,0s));
}
.scroll-scene.stats-band .stat-sparkline polyline:nth-child(2),
.scroll-scene.stats-band .stat-sparkline rect,
.scroll-scene.stats-band .stat-sparkline line,
.scroll-scene.stats-band .stat-sparkline circle{
  opacity:0;
  transform:translateY(7px) scale(.96);
  transition:opacity .6s ease calc(.34s + var(--motion-delay,0s)),transform .6s cubic-bezier(.16,1,.3,1) calc(.34s + var(--motion-delay,0s));
}
.scroll-scene.stats-band.is-inview .stat-sparkline polyline:first-child{stroke-dashoffset:0;}
.scroll-scene.stats-band.is-inview .stat-sparkline polyline:nth-child(2),
.scroll-scene.stats-band.is-inview .stat-sparkline rect,
.scroll-scene.stats-band.is-inview .stat-sparkline line,
.scroll-scene.stats-band.is-inview .stat-sparkline circle{
  opacity:1;
  transform:none;
}

.features.scroll-scene .bento-card .feat-icon,
.features.scroll-scene .bento-card .feat-name,
.features.scroll-scene .bento-card .feat-desc,
.features.scroll-scene .bento-card .feat-tag,
.features.scroll-scene .bento-card .bento-img,
.features.scroll-scene .bento-card .feat-chart-wrap{
  opacity:0;
  transform:translateY(28px) scale(.96);
  transition:opacity .64s ease,transform .82s cubic-bezier(.16,1,.3,1);
}
.features.scroll-scene .bento-card.visible .feat-icon{opacity:1;transform:none;transition-delay:.08s;}
.features.scroll-scene .bento-card.visible .feat-name{opacity:1;transform:none;transition-delay:.14s;}
.features.scroll-scene .bento-card.visible .feat-desc{opacity:1;transform:none;transition-delay:.2s;}
.features.scroll-scene .bento-card.visible .feat-tag{opacity:1;transform:none;transition-delay:.26s;}
.features.scroll-scene .bento-card.visible .bento-img,
.features.scroll-scene .bento-card.visible .feat-chart-wrap{opacity:1;transform:none;transition-delay:.32s;}
.features.scroll-scene .bento-card.visible .bento-img img{
  animation:bentoImageSettle 1.1s cubic-bezier(.16,1,.3,1) both;
}
.features.scroll-scene .feat-chart-wrap svg > *{
  opacity:0;
  transform:translateY(18px) scale(.94);
  transform-box:fill-box;
  transform-origin:center;
  transition:opacity .52s ease,transform .66s cubic-bezier(.16,1,.3,1);
}
.features.scroll-scene .bento-card.visible .feat-chart-wrap svg > *{opacity:1;transform:none;}
.features.scroll-scene .bento-card.visible .feat-chart-wrap svg > :nth-child(2){transition-delay:.1s;}
.features.scroll-scene .bento-card.visible .feat-chart-wrap svg > :nth-child(3){transition-delay:.15s;}
.features.scroll-scene .bento-card.visible .feat-chart-wrap svg > :nth-child(4){transition-delay:.2s;}
.features.scroll-scene .bento-card.visible .feat-chart-wrap svg > :nth-child(5){transition-delay:.25s;}
.features.scroll-scene .bento-card.visible .feat-chart-wrap svg > :nth-child(6){transition-delay:.3s;}
.features.scroll-scene .bento-card.visible .feat-chart-wrap svg > :nth-child(n+7){transition-delay:.35s;}

@keyframes bentoImageSettle{
  from{transform:scale(1.08);}
  to{transform:scale(1);}
}

.platform-suite.scroll-scene .suite-card::after{
  opacity:0;
  transform:translate(36px,30px) rotate(12deg) scale(.62);
  transition:opacity .74s ease .24s,transform .92s cubic-bezier(.16,1,.3,1) .24s;
}
.platform-suite.scroll-scene .suite-card.visible::after{
  opacity:1;
  transform:rotate(12deg) scale(1);
}
.segment-section.scroll-scene .segment-card span,
.segment-section.scroll-scene .segment-card h3,
.segment-section.scroll-scene .segment-card p{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .56s ease,transform .72s cubic-bezier(.16,1,.3,1);
}
.segment-section.scroll-scene .segment-card.visible span{opacity:1;transform:none;transition-delay:.1s;}
.segment-section.scroll-scene .segment-card.visible h3{opacity:1;transform:none;transition-delay:.18s;}
.segment-section.scroll-scene .segment-card.visible p{opacity:1;transform:none;transition-delay:.26s;}

.resource-section.scroll-scene .resource-featured-card > picture > img{
  transform:none;
  filter:saturate(.9);
  transition:filter 1s ease;
}
.resource-section.scroll-scene .resource-featured-card.visible > picture > img{
  transform:none;
  filter:saturate(1);
}
.resource-section.scroll-scene .resource-card span,
.resource-section.scroll-scene .resource-card h3,
.resource-section.scroll-scene .resource-card p{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .56s ease,transform .72s cubic-bezier(.16,1,.3,1);
}
.resource-section.scroll-scene .resource-card.visible span{opacity:1;transform:none;transition-delay:.1s;}
.resource-section.scroll-scene .resource-card.visible h3{opacity:1;transform:none;transition-delay:.18s;}
.resource-section.scroll-scene .resource-card.visible p{opacity:1;transform:none;transition-delay:.26s;}

.split-section.scroll-scene .split-img{
  transform:scale(1.14) translateY(var(--split-img-shift,0px));
  transition:transform 1.05s cubic-bezier(.16,1,.3,1);
  will-change:transform;
}
.split-section.scroll-scene.is-inview .split-img{
  transform:scale(1.025) translateY(var(--split-img-shift,0px));
}
.split-section.scroll-scene .split-bullets li,
.split-section.scroll-scene .split-proof-metrics,
.split-section.scroll-scene .split-text .btn{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .54s ease,transform .68s cubic-bezier(.16,1,.3,1);
}
.split-section.scroll-scene .split-text.visible .split-bullets li{opacity:1;transform:none;transition-delay:calc(.18s + var(--motion-delay-split,0s));}
.split-section.scroll-scene .split-text.visible .split-proof-metrics{opacity:1;transform:none;transition-delay:.42s;}
.split-section.scroll-scene .split-text.visible .btn{opacity:1;transform:none;transition-delay:.5s;}

.phone-carousel-wrap.visible .phone-frame{
  animation:phoneFrameSettle .82s cubic-bezier(.16,1,.3,1) both;
}
.phone-card.is-active .p-search,
.phone-card.is-active .p-cats,
.phone-card.is-active .p-menu-item,
.phone-card.is-active .p-order-card,
.phone-card.is-active .p-stat,
.phone-card.is-active .p-status,
.phone-card.is-active .phone-header,
.phone-card.is-active .phone-label,
.phone-card.is-active .phone-label-sub{
  animation:phoneContentRise .54s cubic-bezier(.16,1,.3,1) both;
}
.phone-card.is-active .p-menu-item:nth-child(3),
.phone-card.is-active .p-stat:nth-child(2){animation-delay:.08s;}
.phone-card.is-active .p-menu-item:nth-child(4),
.phone-card.is-active .p-order-card{animation-delay:.16s;}
.phone-card.is-active .p-menu-item:nth-child(5),
.phone-card.is-active .phone-label{animation-delay:.24s;}
.phone-card.is-active .p-menu-item:nth-child(6),
.phone-card.is-active .phone-label-sub{animation-delay:.3s;}
.phone-card.is-active .p-bar{
  transform-origin:bottom;
  animation:phoneBarGrow .72s cubic-bezier(.16,1,.3,1) both;
}
.phone-card.is-active .p-bar:nth-child(2){animation-delay:.07s;}
.phone-card.is-active .p-bar:nth-child(3){animation-delay:.14s;}
.phone-card.is-active .p-bar:nth-child(4){animation-delay:.21s;}
.phone-card.is-active .p-bar:nth-child(5){animation-delay:.28s;}
.phone-card.is-active .p-bar:nth-child(6){animation-delay:.35s;}
.phone-card.is-active .p-bar:nth-child(7){animation-delay:.42s;}
.phone-card.is-active .p-qr{
  animation:phoneQrPulse 1.2s ease both;
}

@keyframes phoneFrameSettle{
  from{opacity:.5;translate:0 24px;scale:.96;}
  to{opacity:1;translate:0 0;scale:1;}
}
@keyframes phoneContentRise{
  from{opacity:0;translate:0 18px;}
  to{opacity:1;translate:0 0;}
}
@keyframes phoneBarGrow{
  from{transform:scaleY(.18);}
  to{transform:scaleY(1);}
}
@keyframes phoneQrPulse{
  0%{scale:.92;box-shadow:0 0 0 0 rgba(105,218,175,0);}
  55%{scale:1.04;box-shadow:0 0 0 10px rgba(105,218,175,.12);}
  100%{scale:1;box-shadow:0 0 0 0 rgba(105,218,175,0);}
}

.how-grid{position:relative;}
.how-grid::before{
  content:'';
  position:absolute;
  top:31px;
  left:calc(16.666% + 58px);
  right:calc(16.666% + 58px);
  height:1px;
  z-index:0;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform 1s cubic-bezier(.16,1,.3,1) .18s;
}
.how.is-inview .how-grid::before{transform:scaleX(1);}
.how-grid .how-card{position:relative;z-index:1;}
.how.scroll-scene .how-img img{
  transform:scale(1.12);
  transition:transform 1s cubic-bezier(.16,1,.3,1);
}
.how.scroll-scene .how-card.visible .how-img img{transform:scale(1);}

.pricing.scroll-scene .plan-feats li{
  opacity:0;
  transform:translateY(14px);
  transition:opacity .46s ease,transform .58s cubic-bezier(.16,1,.3,1);
}
.pricing.scroll-scene .pc.visible .plan-feats li{
  opacity:1;
  transform:none;
  transition-delay:calc(.14s + var(--motion-delay-fast,0s));
}
.pricing.scroll-scene .pc.feat-pc.visible .pop-badge{
  animation:pricingBadgeSettle .78s cubic-bezier(.16,1,.3,1) .2s both;
}
@keyframes pricingBadgeSettle{
  from{opacity:0;transform:translateX(-50%) translateY(10px) scale(.88);}
  to{opacity:1;transform:translateX(-50%) translateY(0) scale(1);}
}

.cta-band.scroll-scene .cta-img{
  transform:scale(1.08) translateY(var(--cta-img-shift,0px));
  transition:transform .45s linear,opacity .7s ease;
  will-change:transform;
}
.cta-band.scroll-scene.is-inview .cta-img{opacity:.28;}
.cta-band .btn svg{transition:transform .22s ease;}
.cta-band .btn:hover svg{transform:translateX(3px);}

footer.scroll-scene .footer-grid > *{
  opacity:0;
  transform:translateY(28px);
  transition:opacity .64s ease,transform .78s cubic-bezier(.16,1,.3,1);
}
footer.scroll-scene.is-inview .footer-grid > *{
  opacity:1;
  transform:none;
  transition-delay:var(--motion-delay,0s);
}
.footer-col a{position:relative;display:inline-block;width:max-content;}
.footer-col a::after{
  content:'';
  position:absolute;
  left:0;
  right:0;
  bottom:-2px;
  height:1px;
  background:var(--accent);
  transform:scaleX(0);
  transform-origin:left center;
  transition:transform .22s ease;
}
.footer-col a:hover::after{transform:scaleX(1);}

/* =========================================================
   TWEAKS PANEL
   ========================================================= */
#tweaks-trigger[aria-hidden="true"]{display:none !important;}
#tp-host{position:fixed;bottom:24px;right:24px;z-index:10000;display:none;}
#tp-host.vis{display:block;}.tp{background:var(--bg-2);border:1px solid var(--border-2);border-radius:18px;padding:20px;width:272px;box-shadow:0 24px 60px rgba(0,0,0,.55);backdrop-filter:blur(20px);}
.tp-head{font-family:var(--font-head);font-size:14px;font-weight:700;margin-bottom:16px;color:var(--fg);display:flex;align-items:center;justify-content:space-between;}
.tp-close{background:none;border:none;color:var(--fg-muted);font-size:18px;line-height:1;cursor:pointer;}
.tp-close:hover{color:var(--fg);}
.tp-sec{margin-bottom:14px;}
.tp-lbl{font-size:10px;text-transform:uppercase;letter-spacing:1px;color:var(--fg-muted);margin-bottom:7px;font-weight:600;}
.tp-opts{display:flex;gap:5px;flex-wrap:wrap;}
.tp-opt{padding:6px 12px;border-radius:var(--radius-pill);font-size:12px;font-weight:500;border:1px solid var(--border);background:var(--card-bg);color:var(--fg-muted);cursor:pointer;transition:all .2s;}
.tp-opt.on{background:var(--accent);color:var(--bg);border-color:transparent;}
.swatches{display:flex;gap:7px;}
.sw{width:26px;height:26px;border-radius:50%;border:2px solid transparent;cursor:pointer;transition:transform .2s;}
.sw:hover{transform:scale(1.15);}
.sw.on{border-color:var(--fg);}
.tp-slider-row{display:flex;align-items:center;gap:8px;}
.tp-slider-row input[type="range"]{flex:1;accent-color:var(--accent);}
.tp-slider-val{font-size:11px;color:var(--fg-muted);width:28px;text-align:right;}

/* =========================================================
   MOBILE HAMBURGER
   ========================================================= */
.hamburger{display:none;width:30px;height:34px;flex-direction:column;align-items:flex-end;justify-content:center;gap:5px;background:none;border:none;padding:0;margin:0;cursor:pointer;z-index:1100;}
.hamburger span{display:block;width:22px;height:2px;background:var(--fg);border-radius:2px;transition:all .3s;}
.hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger.open span:nth-child(2){opacity:0;}
.hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.mobile-menu{display:none;position:fixed;inset:0;top:var(--nav-h);background:var(--bg-2);z-index:999;padding:32px 24px;flex-direction:column;gap:0;border-top:1px solid var(--border);}
.mobile-menu.open{display:flex;}
.mobile-menu a{display:block;padding:16px 0;font-size:18px;font-weight:500;color:var(--fg);border-bottom:1px solid var(--border);}
.mobile-menu a:last-child{border-bottom:none;}
.mobile-nav-menu-trigger{display:flex;width:100%;align-items:center;justify-content:space-between;padding:16px 0;border:0;border-bottom:1px solid var(--border);background:transparent;color:var(--fg);font:inherit;font-size:18px;font-weight:500;text-align:left;letter-spacing:0;}
.mobile-nav-menu-trigger::after{content:"";width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .16s ease;opacity:.78;}
.mobile-nav-menu-trigger[aria-expanded="true"]::after{transform:translateY(2px) rotate(225deg);}
.mobile-nav-menu-trigger:focus-visible{outline:none;box-shadow:0 0 0 3px var(--accent-dim);}
.mobile-nav-menu-panel{padding:6px 0 8px;border-bottom:1px solid var(--border);}
.mobile-nav-menu-panel[hidden]{display:none;}
.mobile-nav-menu-panel a{padding:12px 0 12px 18px;font-size:16px;border-bottom:0;color:var(--fg);}
.mobile-nav-menu-panel a:last-child{border-bottom:0;}
.mobile-menu .mob-ctas{display:flex;flex-direction:column;gap:12px;margin-top:24px;}
.mobile-menu .mob-ctas .btn{display:flex;width:100%;min-height:52px;align-items:center;justify-content:center;padding:14px;font-size:16px;line-height:1.2;text-align:center;}
.mobile-menu .mob-ctas .btn-primary{color:var(--fg-on-white);}
.mobile-menu .mob-ctas .language-select-mobile{margin-top:8px;}
html[dir="rtl"] #main-nav .nav-ctas .btn,
html[dir="rtl"] .mobile-menu .mob-ctas .btn{font-weight:700 !important;}

@media(prefers-reduced-motion:reduce){
  .page-signal-lines span::after,
  .logos-row.is-marquee{animation:none !important;}
  .motion-card{transform:none !important;transition:none;}
  .hero-product-stage .ops-dashboard,
  .hero-product-stage .ops-dashboard-topbar,
  .hero-product-stage .ops-sidebar,
  .hero-product-stage .ops-filter-row,
  .hero-product-stage .ops-toggle-row,
  .hero-product-stage .ops-metric-card,
  .hero-product-stage .ops-chart-card,
  .hero-product-stage .ops-legend span,
  .hero-product-stage .ops-bar-row span,
  .hero-product-stage .ops-cost-row span,
  .hero-product-stage .scan-phone,
  .hero-product-stage .hero-rating-badge{
    opacity:1 !important;
    translate:0 0 !important;
    scale:1 !important;
    filter:none !important;
    clip-path:none !important;
    animation:none !important;
  }
  .hero-product-stage .ops-dashboard::after,
  .hero-product-stage .qr-card::after{
    display:none !important;
  }
  .hero-product-stage .ops-bar-row i,
  .hero-product-stage .ops-cost-row i::before,
  .hero-product-stage .ops-cost-row i::after{
    transform:scaleX(1) !important;
    animation:none !important;
  }
  .scroll-scene *,
  .scroll-scene *::before,
  .scroll-scene *::after{
    animation:none !important;
    transition:none !important;
  }
  .scroll-scene .stat-sparkline *{
    opacity:1 !important;
    stroke-dashoffset:0 !important;
    transform:none !important;
  }
  .features.scroll-scene .bento-card .feat-icon,
  .features.scroll-scene .bento-card .feat-name,
  .features.scroll-scene .bento-card .feat-desc,
  .features.scroll-scene .bento-card .feat-tag,
  .features.scroll-scene .bento-card .bento-img,
  .features.scroll-scene .bento-card .feat-chart-wrap,
  .features.scroll-scene .feat-chart-wrap svg > *,
  .segment-section.scroll-scene .segment-card span,
  .segment-section.scroll-scene .segment-card h3,
  .segment-section.scroll-scene .segment-card p,
  .resource-section.scroll-scene .resource-card span,
  .resource-section.scroll-scene .resource-card h3,
  .resource-section.scroll-scene .resource-card p,
  .split-section.scroll-scene .split-bullets li,
  .split-section.scroll-scene .split-proof-metrics,
  .split-section.scroll-scene .split-text .btn,
  .pricing.scroll-scene .plan-feats li,
  footer.scroll-scene .footer-grid > *{
    opacity:1 !important;
    transform:none !important;
  }
  .hero-supy-inspired .hero-bg-img,
  .hero-product-stage,
  .split-section.scroll-scene .split-img,
  .resource-section.scroll-scene .resource-featured-card img,
  .how.scroll-scene .how-img img,
  .cta-band.scroll-scene .cta-img{
    transform:none !important;
    translate:0 0 !important;
    filter:none !important;
  }
  .how-grid::before{transform:scaleX(1) !important;}
}

/* =========================================================
   RESPONSIVE — mobile first
   ========================================================= */

/* ---- 480px and below: phones ---- */
@media(max-width:480px){
  :root{ --nav-h: 60px; --section-y:64px; --section-x:20px; }

  /* Nav */
  .nav-links{ display:none !important; }
  .nav-ctas{ display:none !important; }
  .hamburger{ display:flex; }

  /* Hero */
  .hero{ min-height:100svh; padding-top:calc(var(--nav-h) + 38px); padding-left:var(--section-x); padding-right:var(--section-x); padding-bottom:32px; background:radial-gradient(ellipse at 50% 18%,rgb(from var(--primary) r g b / .48) 0%,rgb(from var(--primary) r g b / .94) 56%,var(--primary) 100%); }
  .hero-glow{ background:radial-gradient(ellipse at center,rgba(76,112,255,.24) 0%,rgba(105,218,175,.12) 36%,transparent 70%); }
  .hero-title-desktop,.hero-sub-desktop{ display:none; }
  .hero-title-mobile{ display:block; max-width:350px; font-size:clamp(40px,11vw,48px); line-height:1.04; letter-spacing:0; margin:0 auto 14px; }
  .hero-title-mobile::after{ content:""; display:block; width:84px; height:4px; margin:15px auto 0; border-radius:var(--radius-pill); background:linear-gradient(90deg,var(--accent),var(--accent-2)); box-shadow:0 0 22px rgba(105,218,175,.32); }
  .hero-sub-mobile{ display:block; max-width:330px; margin:0 auto 24px; color:rgba(255,255,255,.78); font-size:16px; font-weight:550; line-height:1.45; letter-spacing:0; }
  .cta-label-desktop{ display:none; }
  .cta-label-mobile{ display:inline; }
  .hero-ctas{ flex-direction:column; width:100%; gap:12px; margin-bottom:34px; }
  .hero-ctas .btn{ width:100%; justify-content:center; padding:15px 20px; font-size:15px; }
  .hero-ctas .hero-primary-cta{ max-width:340px; min-height:56px; border:1px solid transparent; background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,var(--accent),var(--accent-2)) border-box; box-shadow:0 16px 36px rgba(105,218,175,.16); }
  .hero-ctas .hero-secondary-cta{ width:auto; min-height:24px; padding:0; border:0; background:transparent; color:rgba(255,255,255,.9); font-size:14px; font-weight:800; }
  .hero-ctas .hero-secondary-cta::before{ display:none; }
  .hero-ctas .hero-secondary-cta::after{ content:"→"; position:static; inset:auto; display:inline; margin-left:6px; opacity:1; border-radius:0; background:none; color:var(--accent-2); text-shadow:0 0 14px rgba(252,211,77,.34); pointer-events:auto; }
  .hero-proof-row{ grid-template-columns:1fr; margin-bottom:36px; }
  .hero-proof-row{ display:none; }
  .hero-proof-item{ text-align:center; }
  .hero-note{ font-size:12px; text-align:center; flex-wrap:wrap; justify-content:center; }
  .hero-badge{ font-size:12px; padding:5px 12px; }
  .hero-bg-img{ background:linear-gradient(to bottom,rgb(from var(--primary) r g b / .9) 0%,rgb(from var(--primary) r g b / .66) 48%,rgb(from var(--primary) r g b / .76) 100%),url("../assets/images/hero-restaurant-background.jpg") 56% center/cover no-repeat; opacity:1; }
  .hero-bg-img::before{ background:radial-gradient(ellipse at center,rgba(76,112,255,.28),transparent 64%); opacity:.8; }

  /* Mockup — simplified on small screens */
  .hero-mockup{ max-width:100%; }
  .mockup-content{ grid-template-columns:1fr; min-height:auto; }
  .mockup-sidebar{ display:none; }
  .mockup-stats{ grid-template-columns:repeat(2,1fr); gap:8px; }
  .ms-val{ font-size:16px; }
  .mockup-bottom{ grid-template-columns:1fr; gap:8px; }
  .chart-bars{ height:56px; }

  /* Mission band */
  .mission-band{ min-height:clamp(660px,92svh,760px); padding:56px 0 calc(var(--section-y) + 48px); }
  .mission-band-inner{ grid-template-columns:1fr; gap:44px; }
  .mission-visual{ order:2; min-height:0; margin-top:6px; }
  .mission-copy{ order:1; max-width:100%; text-align:left; }
  .mission-copy .section-eyebrow{ margin-bottom:18px; }
  .mission-copy h2{ max-width:360px; margin-bottom:24px; font-size:clamp(29px,8vw,36px); line-height:1.08; letter-spacing:0; }
  .mission-copy p:last-child{ max-width:360px; font-size:15.5px; line-height:1.68; }
  .mission-comparison-shell{ --mission-comparison-radius:13px; max-width:100%; border-width:7px; border-radius:18px; padding:0; clip-path:inset(0 round 18px); }
  .mission-comparison-slider{ --divider-width:2px; }
  .mission-comparison-handle{ width:38px; }
  .mission-comparison-handle svg{ width:38px; height:38px; }

  /* Stats */
  .stats-grid{ grid-template-columns:repeat(2,1fr); }
  .stat-item{ padding:20px 12px; border-right:none; border-bottom:1px solid var(--border); }
  .stat-item:nth-child(odd){ border-right:1px solid var(--border); }
  .stat-item:nth-child(3),.stat-item:nth-child(4){ border-bottom:none; }
  .stat-big{ font-size:36px; }

  /* Features */
  .features{ padding:var(--section-y) 0; }
  .features-intro{ gap:16px; margin-bottom:40px; }
  .bento{ gap:2px; border-radius:12px; }
  .bc-wide,.bc-narrow,.bc-third,.bc-half{ grid-column:span 12; }
  .bento-card{ padding:24px 20px; gap:10px; }
  .feat-name{ font-size:16px; }
  .feat-desc{ font-size:13px; }
  .bento-img{ aspect-ratio:16/8; }

  /* Platform depth */
  .platform-suite,.segment-section,.resource-section{ padding:var(--section-y) 0; }
  .suite-header,.resource-header{ grid-template-columns:1fr; gap:28px; }
  .resource-header{ gap:16px; margin-bottom:40px; }
  .suite-grid,.segment-grid,.resource-grid{ grid-template-columns:1fr; }
  .suite-card,.segment-card,.resource-card{ min-height:auto; padding:24px 20px; }
  .resource-editorial{ grid-template-columns:1fr; gap:18px; }
  .resource-grid-compact{ grid-template-columns:1fr; }
  .resource-featured-card{ grid-template-rows:minmax(0,210px) auto; }
  .resource-featured-card > picture{ height:210px; max-height:210px; }
  .resource-featured-card > div{ min-height:auto; padding:24px 20px; }
  .resource-featured-card h3{ margin-top:24px; }
  .suite-tag,.resource-card span{ margin-bottom:26px; }

  /* Split sections */
  .split-section{ padding:var(--section-y) 0; }
  .split-inner{ grid-template-columns:1fr; gap:32px; }
  .split-inner.flip{ direction:ltr; }
  .split-img{ height:240px; }
  .split-proof-metrics{ grid-template-columns:1fr; }
  .analytics-split{ padding:calc(var(--section-y) + 22px) 0 calc(var(--section-y) + 30px); }
  .analytics-split .split-inner{ gap:42px; }
  .analytics-split .split-text{ gap:18px; }
  .analytics-split .section-eyebrow{ margin-bottom:0; }
  .analytics-split .section-title{ margin-bottom:0; }
  .analytics-split .section-sub{ line-height:1.64; }
  .analytics-split .split-bullets{ gap:17px; margin-top:8px; }
  .analytics-split .split-bullets li{ line-height:1.62; }
  .analytics-split .split-proof-metrics{ margin-top:6px; padding-top:20px; }
  .analytics-split .split-img{ height:320px; }

  /* How it works */
  .how{ padding:var(--section-y) 0; }
  .how-grid{ grid-template-columns:1fr; border-radius:12px; margin-top:72px; }
  .how-card{ padding:34px 24px 28px; }
  .how-num{ font-size:36px; }
  .how-img{ aspect-ratio:16/9; }

  /* Pricing */
  .pricing{ padding:var(--section-y) 0; }
  .pricing-cards{ grid-template-columns:1fr; border-radius:12px; }
  .pc{ padding:32px 24px; }
  .plan-num{ font-size:44px; }

  /* CTA */
  .cta-img{ height:560px; }
  .cta-content{ padding:88px var(--section-x); }
  .cta-content h2{ max-width:350px; font-size:clamp(32px,8vw,40px); letter-spacing:0; line-height:1.08; margin-bottom:22px; }
  .cta-content p{ max-width:335px; font-size:15px; line-height:1.58; margin-bottom:34px; }
  .cta-content .btn{
    width:fit-content;
    max-width:100%;
    min-height:56px;
    justify-content:center;
    padding:16px 28px;
    font-size:16px;
    line-height:1.2;
    text-align:center;
    white-space:normal;
    box-shadow:0 16px 36px rgba(255,255,255,.12);
  }
  .cta-content .btn svg{ flex:0 0 17px; }

  /* Footer */
  footer{ padding:104px 0 34px; }
  .footer-grid,.footer-grid-wide{ grid-template-columns:1fr; gap:34px; padding-bottom:38px; }
  .footer-brand p{ max-width:none; font-size:15px; }
  .footer-col h2,.footer-col h4{ margin-bottom:16px; }
  .footer-col ul{ gap:11px; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; gap:8px; text-align:left; }

  /* Section titles */
  .section-title{ font-size:clamp(26px,8vw,36px); letter-spacing:-1px; }
  .stats-intro .section-title{ font-size:clamp(18px,5.5vw,28px); letter-spacing:0; line-height:1.1; }
  .section-sub{ font-size:15px; }

  /* Tweaks panel */
  #tp-host{ bottom:12px; right:12px; }
  .tp{ width:240px; }

  /* Container padding */
  .container{ padding:0 var(--section-x); }
}

/* ---- 481px – 768px: large phones / small tablets ---- */
@media(min-width:481px) and (max-width:768px){
  :root{ --section-y:72px; --section-x:24px; }

  .nav-links{ display:none !important; }
  .nav-ctas{ display:none !important; }
  .hamburger{ display:flex; }

  .hero{ min-height:100svh; padding-top:calc(var(--nav-h) + 46px); padding-left:var(--section-x); padding-right:var(--section-x); padding-bottom:40px; background:radial-gradient(ellipse at 50% 18%,rgb(from var(--primary) r g b / .46) 0%,rgb(from var(--primary) r g b / .94) 56%,var(--primary) 100%); }
  .hero-glow{ background:radial-gradient(ellipse at center,rgba(76,112,255,.22) 0%,rgba(105,218,175,.12) 36%,transparent 70%); }
  .hero-title-desktop,.hero-sub-desktop{ display:none; }
  .hero-title-mobile{ display:block; max-width:440px; font-size:clamp(42px,8vw,58px); line-height:1.04; letter-spacing:0; margin:0 auto 14px; }
  .hero-title-mobile::after{ content:""; display:block; width:92px; height:4px; margin:16px auto 0; border-radius:var(--radius-pill); background:linear-gradient(90deg,var(--accent),var(--accent-2)); box-shadow:0 0 22px rgba(105,218,175,.32); }
  .hero-sub-mobile{ display:block; max-width:390px; margin:0 auto 26px; color:rgba(255,255,255,.78); font-size:17px; font-weight:550; line-height:1.45; letter-spacing:0; }
  .cta-label-desktop{ display:none; }
  .cta-label-mobile{ display:inline; }
  .hero-ctas{ flex-direction:column; align-items:center; gap:12px; max-width:none; margin-bottom:36px; }
  .hero-ctas .btn{ justify-content:center; }
  .hero-ctas .hero-primary-cta{ width:100%; max-width:360px; min-height:56px; border:1px solid transparent; background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,var(--accent),var(--accent-2)) border-box; box-shadow:0 16px 36px rgba(105,218,175,.16); }
  .hero-ctas .hero-secondary-cta{ width:auto; min-height:24px; padding:0; border:0; background:transparent; color:rgba(255,255,255,.9); font-size:15px; font-weight:800; }
  .hero-ctas .hero-secondary-cta::before{ display:none; }
  .hero-ctas .hero-secondary-cta::after{ content:"→"; position:static; inset:auto; display:inline; margin-left:6px; opacity:1; border-radius:0; background:none; color:var(--accent-2); text-shadow:0 0 14px rgba(252,211,77,.34); pointer-events:auto; }
  .hero-proof-row{ display:none; }
  .hero-bg-img{ background:linear-gradient(to bottom,rgb(from var(--primary) r g b / .9) 0%,rgb(from var(--primary) r g b / .64) 48%,rgb(from var(--primary) r g b / .76) 100%),url("../assets/images/hero-restaurant-background.jpg") 56% center/cover no-repeat; opacity:1; }
  .hero-bg-img::before{ background:radial-gradient(ellipse at center,rgba(76,112,255,.26),transparent 64%); opacity:.78; }
  .mockup-content{ grid-template-columns:1fr; }
  .mockup-sidebar{ display:none; }
  .mockup-stats{ grid-template-columns:repeat(2,1fr); }
  .mockup-bottom{ grid-template-columns:1fr; }

  .mission-band{ min-height:clamp(720px,92svh,860px); padding:72px 0 calc(var(--section-y) + 56px); }
  .mission-band-inner{ grid-template-columns:1fr; gap:52px; }
  .mission-visual{ order:2; margin-top:8px; }
  .mission-copy{ order:1; max-width:100%; }
  .mission-copy .section-eyebrow{ margin-bottom:20px; }
  .mission-copy h2{ max-width:620px; margin-bottom:26px; }
  .mission-copy p:last-child{ max-width:620px; line-height:1.72; }

  .stats-grid{ grid-template-columns:repeat(2,1fr); }
  .stat-item:nth-child(2){ border-right:none; }
  .stat-item:nth-child(3){ border-right:1px solid var(--border); border-top:1px solid var(--border); }
  .stat-item:nth-child(4){ border-top:1px solid var(--border); }

  .features-intro{ gap:20px; }
  .bc-wide,.bc-narrow,.bc-third,.bc-half{ grid-column:span 12; }
  .bento-card{ padding:28px 24px; }

  .platform-suite,.segment-section,.resource-section{ padding:var(--section-y) 0; }
  .suite-header,.resource-header{ grid-template-columns:1fr; gap:32px; }
  .resource-header{ gap:20px; }
  .suite-grid,.segment-grid{ grid-template-columns:1fr 1fr; }
  .resource-grid{ grid-template-columns:1fr 1fr; }
  .split-inner{ grid-template-columns:1fr; gap:36px; }
  .split-inner.flip{ direction:ltr; }
  .split-img{ height:300px; }
  .analytics-split{ padding:calc(var(--section-y) + 24px) 0 calc(var(--section-y) + 34px); }
  .analytics-split .split-inner{ gap:48px; }
  .analytics-split .split-text{ gap:20px; }
  .analytics-split .section-eyebrow{ margin-bottom:0; }
  .analytics-split .section-title{ margin-bottom:0; }
  .analytics-split .section-sub{ line-height:1.66; }
  .analytics-split .split-bullets{ gap:17px; margin-top:8px; }
  .analytics-split .split-bullets li{ line-height:1.64; }
  .analytics-split .split-proof-metrics{ margin-top:8px; padding-top:22px; }
  .analytics-split .split-img{ height:372px; }

  .how-grid{ grid-template-columns:1fr; }
  .pricing-cards{ grid-template-columns:1fr; }
  .footer-grid,.footer-grid-wide{ grid-template-columns:1.15fr 1fr; gap:36px 44px; }
  .footer-brand{ grid-column:1 / -1; }
  .footer-brand p{ max-width:520px; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; gap:8px; text-align:left; }
}

/* Mobile section header alignment */
@media(max-width:768px){
  .hero-product-stage{ display:none !important; }

  .features-intro,
  .suite-header,
  .center-section,
  .resource-header,
  .pricing-header,
  .section-header-block{
    align-items:flex-start;
    text-align:left !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .section-title,
  .section-sub{
    text-align:left !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .center-section .section-eyebrow,
  .pricing-header .section-eyebrow,
  .section-header-block .section-eyebrow{
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .pricing-header .reveal.rd3{
    width:100%;
    justify-content:center !important;
  }

  .pricing-header .pricing-toggle{
    margin-left:auto;
    margin-right:auto;
  }

}

[dir="rtl"] .stats-intro,
[dir="rtl"] .features-intro,
[dir="rtl"] .suite-header,
[dir="rtl"] .center-section,
[dir="rtl"] .resource-header,
[dir="rtl"] .pricing-header,
[dir="rtl"] .section-header-block,
[dir="rtl"] .split-text{
  align-items:flex-start !important;
  text-align:right !important;
  margin-left:auto !important;
  margin-right:0 !important;
}

[dir="rtl"] .section-title,
[dir="rtl"] .section-sub,
[dir="rtl"] .mission-copy,
[dir="rtl"] .mission-copy h2,
[dir="rtl"] .mission-copy p,
[dir="rtl"] .split-text .section-title,
[dir="rtl"] .split-text .section-sub{
  text-align:right !important;
}

[dir="rtl"] .section-eyebrow{
  direction:rtl;
}

[dir="rtl"] .stats-intro .section-eyebrow,
[dir="rtl"] .features-intro .section-eyebrow,
[dir="rtl"] .suite-header .section-eyebrow,
[dir="rtl"] .center-section .section-eyebrow,
[dir="rtl"] .resource-header .section-eyebrow,
[dir="rtl"] .pricing-header .section-eyebrow,
[dir="rtl"] .section-header-block .section-eyebrow,
[dir="rtl"] .split-text .section-eyebrow{
  align-self:flex-start !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

[dir="rtl"] .section-sub,
[dir="rtl"] .features-intro .section-sub,
[dir="rtl"] .suite-header .section-sub,
[dir="rtl"] .center-section .section-sub,
[dir="rtl"] .resource-header .section-sub,
[dir="rtl"] .split-text .section-sub{
  margin-left:auto !important;
  margin-right:0 !important;
}

.hero-supy-inspired .hero-ctas .btn{
  max-width:min(100%,360px) !important;
  white-space:normal !important;
  overflow:visible;
  line-height:1.2 !important;
}

[dir="rtl"] .hero-supy-inspired .hero-ctas .btn{
  direction:rtl;
}

[dir="rtl"] .hero-supy-inspired .hero-primary-cta svg{
  transform:scaleX(-1);
}

/* ---- 769px – 1024px: tablets ---- */
@media(min-width:769px) and (max-width:1024px){
  :root{ --section-y:96px; --section-x:28px; }

  .nav-links{ display:none !important; }
  .nav-ctas .btn-ghost{ display:none; }
  .hamburger{ display:flex; }

  .hero h1{ font-size:clamp(48px,7vw,72px); }
  .mockup-stats{ grid-template-columns:repeat(2,1fr); }
  .mockup-sidebar{ display:none; }
  .mockup-content{ grid-template-columns:1fr; }
  .mockup-bottom{ grid-template-columns:1fr 1fr; }

  .mission-band-inner{ grid-template-columns:1fr; gap:40px; }
  .mission-visual{ order:2; }
  .mission-copy{ order:1; max-width:100%; }
  .mission-copy h2,.mission-copy p:last-child{ max-width:700px; }

  .stats-grid{ grid-template-columns:repeat(2,1fr); }
  .stat-item:nth-child(2){ border-right:none; }
  .stat-item:nth-child(3){ border-right:1px solid var(--border); border-top:1px solid var(--border); }
  .stat-item:nth-child(4){ border-top:1px solid var(--border); }

  .features-intro{ gap:24px; }
  .bc-wide{ grid-column:span 12; }
  .bc-narrow{ grid-column:span 12; }
  .bc-third{ grid-column:span 6; }
  .bc-half{ grid-column:span 6; }

  .suite-header,.resource-header{ grid-template-columns:1fr; gap:40px; }
  .suite-grid,.segment-grid{ grid-template-columns:1fr 1fr; }
  .resource-grid{ grid-template-columns:1fr 1fr; }

  .split-inner{ gap:48px; }
  .split-img{ height:340px; }

  .how-grid{ grid-template-columns:1fr 1fr; }
  .how-grid .how-card:last-child{ grid-column:span 2; }

  .pricing-cards{ grid-template-columns:1fr; max-width:480px; }

  .footer-grid,.footer-grid-wide{ grid-template-columns:1.25fr repeat(3,minmax(130px,1fr)); gap:34px; }
}

/* ---- Hamburger always hidden on desktop ---- */
@media(min-width:1025px){
  .hamburger{ display:none; }
  .mobile-menu{ display:none !important; }
  .nav-links{ display:flex; }
  .nav-ctas{ display:flex; }
  .mission-comparison-shell{ --mission-comparison-radius:16px; border-width:8px; }
}
@media(min-width:1025px) and (max-width:1240px){
  .nav-links{ display:none !important; }
  .nav-ctas .btn-ghost{ display:none; }
  .hamburger{ display:flex; }
}

@media(max-width:1024px){
  .hero-supy-inspired{
    padding-top:calc(var(--nav-h) + 54px);
    padding-bottom:42px;
  }
  .hero-supy-inspired h1{
    max-width:720px;
    font-size:clamp(44px,7vw,64px);
  }
  .hero-supy-inspired .hero-ctas{
    margin-bottom:42px;
  }
  .hero-product-stage{
    width:100%;
    min-height:410px;
    padding-right:42px;
  }
  .ops-dashboard{
    width:min(100%,800px);
  }
  .ops-chart-card{
    min-height:196px;
  }
  .scan-phone{
    width:190px;
    min-height:308px;
  }
  .qr-card{
    width:122px;
    height:122px;
  }
  .hero-rating-badge{
    left:8px;
  }
}

@media(max-width:768px){
  .hero-supy-inspired{
    min-height:auto;
    padding-top:calc(var(--nav-h) + 56px);
    padding-bottom:0;
  }
  .hero-supy-inspired::after{
    content:"";
    position:absolute;
    left:-12vw;
    right:-12vw;
    bottom:-34px;
    z-index:4;
    display:block;
    height:84px;
    pointer-events:none;
    background:#ffffff;
    border-radius:50% 50% 0 0 / 70% 70% 0 0;
    box-shadow:0 -10px 28px rgb(from var(--primary) r g b / .1);
    transform:none;
    transform-origin:50% 100%;
  }
  .hero-supy-inspired .hero-bg-img{
    background:var(--primary) url("../assets/images/supy-hero-mobile-bg.avif") center top / cover no-repeat;
  }
  .hero-supy-inspired h1{
    max-width:520px;
    margin-bottom:20px;
    font-size:clamp(38px,9vw,54px);
    line-height:1.08;
  }
  .hero-supy-inspired .hero-sub-mobile{
    max-width:380px;
    margin-bottom:32px;
    color:rgba(255,255,255,.8);
    font-size:16px;
    font-weight:400;
    line-height:1.5;
  }
  .hero-supy-inspired .hero-ctas{
    display:flex;
    flex-direction:row;
    align-items:center;
    justify-content:center;
    flex-wrap:nowrap;
    width:100%;
    gap:12px;
    margin-bottom:52px;
  }
  .hero-supy-inspired .hero-ctas .btn{
    flex:0 1 calc(50% - 6px);
    width:auto;
    max-width:168px;
    min-width:0;
    min-height:40px;
    padding:0 12px;
    gap:7px;
    font-size:clamp(12px,3.4vw,14px);
    line-height:1;
    white-space:nowrap;
  }
  .hero-supy-inspired .hero-ctas .hero-primary-cta{
    border:0;
    background:#fff;
    box-shadow:none;
  }
  .hero-supy-inspired .hero-secondary-cta{
    min-height:40px;
    border:1px solid rgba(255,255,255,.24);
    background:rgba(255,255,255,.06);
    color:#fff;
  }
  .hero-supy-inspired .hero-ctas svg{
    width:14px;
    height:14px;
    flex:0 0 14px;
  }
  .hero-supy-inspired .hero-ctas .hero-secondary-cta::before,
  .hero-supy-inspired .hero-ctas .hero-secondary-cta::after{
    display:none;
    content:none;
  }
  .hero-product-stage{
    width:100%;
    max-width:100%;
    height:260px;
    min-height:260px;
    padding-right:0;
    margin-left:0;
    min-width:0;
    transform:none;
  }
  .mission-band{
    align-items:flex-start;
    min-height:auto;
    margin-top:-1px;
    padding:72px 0 104px;
  }
  .mission-band-inner{
    gap:44px;
  }
  .mission-comparison-slider.rendered .mission-comparison-frame{
    display:block;
  }
  .hero-rating-badge,
  .scan-phone{
    display:none;
  }
  .ops-dashboard{
    position:absolute;
    left:50%;
    top:0;
    width:800px;
    flex:0 0 800px;
    min-height:418px;
    padding:18px 20px 22px;
    border-radius:20px;
    overflow:hidden;
    border-width:2px;
    border-color:rgba(255,255,255,.36);
    background:
      linear-gradient(105deg,rgba(255,255,255,.16) 0%,rgba(255,255,255,.25) 58%,rgba(255,255,255,.18) 100%);
    box-shadow:0 22px 54px rgba(18,6,54,.16), inset 0 1px 0 rgba(255,255,255,.38);
    backdrop-filter:blur(10px) saturate(1.1);
    transform:translateX(-50%) scale(.62);
    transform-origin:top center;
  }
  .ops-dashboard::before{
    content:"";
    position:absolute;
    z-index:0;
    inset:0;
    border-radius:inherit;
    background:
      radial-gradient(circle at 76% 22%,rgba(255,255,255,.16),rgba(255,255,255,0) 28%),
      linear-gradient(90deg,rgba(255,255,255,.04),rgba(255,255,255,.12) 58%,rgba(255,255,255,.03));
    pointer-events:none;
  }
  .ops-dashboard > *{
    position:relative;
    z-index:1;
  }
  .ops-dashboard-topbar{
    grid-template-columns:28px auto 1fr;
  }
  .ops-topbar-actions{
    display:flex;
  }
  .ops-filter-row{
    gap:8px;
  }
  .ops-filter-row span{
    min-height:26px;
    padding:0 12px;
  }
  .ops-metric-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
  }
  .ops-metric-card{
    min-height:88px;
    padding:16px 14px;
  }
  .ops-metric-card strong{
    font-size:24px;
  }
  .ops-chart-grid{
    grid-template-columns:1.15fr .85fr;
    gap:12px;
  }
  .ops-chart-card{
    min-height:196px;
    padding:16px 18px;
  }
  .ops-chart-heading{
    margin-bottom:20px;
  }
  .ops-bar-row{
    grid-template-columns:64px repeat(4,minmax(0,1fr));
  }
  .ops-line-chart{
    gap:18px;
  }
}

@media(max-width:480px){
  .hero-supy-inspired{
    padding-top:calc(var(--nav-h) + 44px);
    padding-bottom:0;
  }
  .hero-supy-inspired::after{
    left:-16vw;
    right:-16vw;
    bottom:-28px;
    height:72px;
    border-radius:50% 50% 0 0 / 72% 72% 0 0;
    transform:none;
  }
  .hero-supy-inspired h1{
    max-width:370px;
    font-size:clamp(34px,9vw,38px);
  }
  .hero-supy-inspired .hero-sub-mobile{
    max-width:330px;
    font-size:15px;
  }
  .hero-product-stage{
    height:200px;
    min-height:200px;
    transform:none;
  }
  .mission-band{
    min-height:auto;
    padding:52px 0 84px;
  }
  .mission-band-inner{
    gap:38px;
  }
  .ops-dashboard{
    left:calc(50vw - 212px);
    transform:scale(.48);
    transform-origin:top left;
  }
  .ops-dashboard{
    padding:18px 20px 22px;
  }
  .ops-dashboard-title{
    font-size:14px;
  }
  .ops-filter-row span:nth-child(3){
    display:inline-flex;
  }
  .ops-metric-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
  .ops-metric-card{
    box-shadow:0 0 0 3px rgba(255,255,255,.12);
  }
  .ops-metric-card span,
  .ops-metric-card small{
    font-size:11px;
  }
  .ops-metric-card strong{
    font-size:24px;
  }
  .ops-chart-card{
    min-height:196px;
  }
  .ops-chart-grid .ops-chart-card:nth-child(2){
    display:block;
  }
  .ops-bar-row{
    grid-template-columns:64px repeat(4,minmax(0,1fr));
  }
  .ops-bar-row span{
    font-size:10px;
  }
}

@media(max-width:360px){
  .hero-product-stage{
    height:190px;
    min-height:190px;
    transform:none;
  }
  .ops-dashboard{
    left:calc(50vw - 200px);
    transform:scale(.45);
    transform-origin:top left;
  }
}

.hero-supy-inspired .hero-ctas .hero-primary-cta,
.hero-supy-inspired .hero-ctas .hero-primary-cta:hover,
.hero-supy-inspired .hero-ctas .hero-primary-cta:focus-visible{
  background:#fcd34d;
  color:var(--fg-on-white);
}
