@import url('https://fonts.googleapis.com/css2?family=Archivo+Black&family=Inter:wght@400;600;800&family=Space+Mono:wght@400;700&display=swap');

:root{
  --orange:#FF4D00;
  --black:#000000;
  --white:#FFFFFF;
  --muted:rgba(255,255,255,.72);
  --line:2px solid var(--black);
}

*{box-sizing:border-box}
/* scroll-behavior:smooth removed — combined with this page's reveal
   animations/wavy hero canvas it caused real multi-second scroll hangs on
   ordinary mouse-wheel scrolling (confirmed live), not just a cosmetic
   nicety. No same-page anchor links depend on it (checked). */
html{overflow-x:hidden}
body{margin:0;background:var(--orange);color:var(--black);font-family:Inter,system-ui,sans-serif;overflow-x:hidden}
/* Hint the compositor for the scroll-reveal targets (see landing7.js
   revealObserver) so their opacity/transform animation runs on its own
   layer instead of contending with main-thread scroll work. */
.feature-card,.service-item,.price-card,.panel{will-change:opacity,transform}
::selection{background:var(--black);color:var(--orange)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.display{font-family:'Archivo Black',Impact,sans-serif;text-transform:uppercase;letter-spacing:-.04em;line-height:.88}
.mono{font-family:'Space Mono',monospace;text-transform:uppercase;letter-spacing:-.02em;font-weight:700}
.container{width:min(1440px,calc(100% - 40px));margin-inline:auto}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.75rem;border:2px solid var(--black);padding:1rem 1.35rem;border-radius:999px;font-family:'Space Mono',monospace;text-transform:uppercase;font-weight:700;font-size:12px;transition:transform .2s ease,background .2s ease,color .2s ease}
.btn:hover{transform:translateX(16px) scale(1.06)}
.btn.black{background:var(--black);color:var(--white)}
.btn.white{background:var(--white);color:var(--black)}
.btn.orange{background:var(--orange);color:var(--black)}

.site-header{position:fixed;top:18px;left:0;width:100%;z-index:50;pointer-events:none}
.nav-shell{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}
.brand,.socials,.nav-pill{pointer-events:auto}
.brand{display:inline-flex;align-items:center;gap:10px;font-size:13px}
.logo-mark{width:42px;height:42px;border:2px solid var(--black);background:var(--white);border-radius:12px;padding:5px;object-fit:contain}
.nav-pill{display:flex;align-items:center;gap:4px;background:var(--black);border-radius:999px;padding:6px;box-shadow:0 10px 24px rgba(0,0,0,.25)}
.nav-pill a{color:var(--white);font-family:'Space Mono',monospace;text-transform:uppercase;font-size:12px;font-weight:700;padding:10px 13px;border-radius:999px;transition:background .2s,color .2s,transform .2s}
.nav-pill a:hover,.nav-pill a.active{background:var(--white);color:var(--black);transform:translateX(4px)}
.socials{display:flex;justify-content:flex-end;gap:14px;font-size:12px}
.socials a{background:var(--white);border:2px solid var(--black);border-radius:999px;padding:9px 12px;transition:transform .2s}
.socials a:hover{transform:scale(1.1)}

.hero{min-height:100vh;display:flex;flex-direction:column;justify-content:flex-end;padding-top:110px}
.hero-kicker{display:flex;justify-content:space-between;align-items:center;border-bottom:var(--line);padding-bottom:16px;margin-bottom:24px;font-size:12px}
.hero h1{font-size:clamp(72px,15.2vw,260px);text-align:center;margin:0 0 28px}
.hero-copy{border-top:var(--line);display:grid;grid-template-columns:1fr 180px 1fr;align-items:center;gap:24px;padding:22px 0 36px}
.hero-copy p{margin:0;font-size:clamp(16px,2vw,28px);font-weight:800;line-height:1.05;text-transform:uppercase}.hero-copy .right{text-align:right}.hero-copy .left{font-family:'Space Mono';font-size:13px;line-height:1.4}
.rotate-wrap{width:144px;height:144px;margin:auto;position:relative;display:grid;place-items:center}.rotate-wrap svg{position:absolute;inset:0;animation:spin 12s linear infinite}.center-arrow{font-size:38px;font-weight:900}
@keyframes spin{to{transform:rotate(360deg)}}

.marquee-section{background:var(--black);color:var(--white);transform:skewY(-2deg);margin:80px 0 70px;padding:55px 0;overflow:hidden;border-block:2px solid var(--black)}
.marquee-inner{transform:skewY(2deg)}.marquee{display:flex;white-space:nowrap;overflow:hidden}.marquee span{font-size:clamp(58px,10vw,154px);padding-right:3vw;animation:marq 22s linear infinite}.marquee.row2 span{color:rgba(255,255,255,.8);animation-direction:reverse;animation-duration:26s}.marquee.row1 span{color:var(--orange)}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-100%)}}

.split{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:start;padding:84px 0}.split h2,.section-title{font-size:clamp(54px,9vw,136px);margin:0 0 20px}.lede{font-size:clamp(20px,3vw,42px);font-weight:800;text-transform:uppercase;line-height:.98;margin:0}.panel{border:2px solid var(--black);background:var(--white);padding:24px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);border:2px solid var(--black);margin-top:24px}.metric{padding:20px;border-right:2px solid var(--black);background:var(--white)}.metric:last-child{border-right:0}.metric strong{display:block;font-family:'Archivo Black';font-size:42px;letter-spacing:-.04em}.metric span{font-family:'Space Mono';font-size:11px;text-transform:uppercase}

.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border:2px solid var(--black);background:var(--black)}.feature-card{background:var(--orange);border-right:2px solid var(--black);border-bottom:2px solid var(--black);padding:28px;min-height:260px;transition:transform .2s,background .2s}.feature-card:hover{background:var(--white);transform:translateY(-6px)}.feature-card:nth-child(3n){border-right:0}.feature-card .num{font-size:12px;margin-bottom:60px;color:var(--black)}.feature-card h3{font-size:clamp(28px,4vw,54px);margin:0 0 14px}.feature-card p{font-size:15px;line-height:1.45;margin:0}

.services{background:var(--black);color:var(--white);padding:92px 0}.service-list{border-top:1px solid rgba(255,255,255,.25)}.service-item{display:grid;grid-template-columns:90px 1fr 90px;gap:16px;align-items:center;padding:34px 0;border-bottom:1px solid rgba(255,255,255,.25);transition:background .2s}.service-item:hover{background:rgba(255,255,255,.05)}.service-item .idx{color:var(--orange);font-size:13px}.service-title{font-size:clamp(48px,7vw,104px);transition:transform .2s}.service-item:hover .service-title{transform:translateX(16px)}.tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:13px}.tag{border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:7px 10px;color:var(--muted);font-family:'Space Mono';font-size:11px;text-transform:uppercase}.arrow{opacity:0;color:var(--orange);font-size:60px;transition:opacity .2s,transform .2s}.service-item:hover .arrow{opacity:1;transform:rotate(45deg)}

.pricing{padding:92px 0}.pricing-grid{display:grid;grid-template-columns:repeat(3,1fr);border:2px solid var(--black);background:var(--black);gap:2px}.price-card{background:var(--white);padding:30px}.price-card.highlight{background:var(--black);color:var(--white)}.price-card h3{font-size:44px;margin:0 0 20px}.price{font-family:'Archivo Black';font-size:72px;letter-spacing:-.05em}.price small{font-size:14px;font-family:'Space Mono'}.price-card ul{padding:0;margin:24px 0;list-style:none}.price-card li{border-top:1px solid currentColor;padding:12px 0;font-weight:700}

.cta{padding:96px 0;text-align:center}.cta h2{font-size:clamp(70px,14vw,230px);margin:0 0 30px}.footer{border-top:2px solid var(--black);padding:22px 0 36px}.footer-row{display:flex;justify-content:space-between;gap:18px;align-items:center}.footer-links{display:flex;gap:18px;font-size:12px}

.page-hero{padding:150px 0 70px;border-bottom:2px solid var(--black)}.page-hero h1{font-size:clamp(76px,13vw,200px);margin:0}.page-hero p{font-size:clamp(20px,3vw,42px);font-weight:800;text-transform:uppercase;max-width:920px;line-height:1;margin:14px 0 0}.form-page{min-height:100vh;display:grid;place-items:center;padding:100px 20px}.auth-card{width:min(560px,100%);background:var(--white);border:2px solid var(--black);padding:28px}.auth-card h1{font-size:70px;margin:0 0 22px}.field{display:grid;gap:8px;margin-bottom:16px}.field label{font-size:12px}.field input,.field select{border:2px solid var(--black);padding:15px;font:600 16px Inter;background:var(--white);border-radius:14px;width:100%;color:var(--black)}.field select{appearance:auto}

@media(max-width:900px){.nav-shell{grid-template-columns:1fr}.brand,.socials{display:none}.nav-pill{justify-self:center;max-width:calc(100vw - 24px);overflow:auto}.hero-copy,.split,.features-grid,.pricing-grid{grid-template-columns:1fr}.hero-copy .right{text-align:left}.metrics{grid-template-columns:1fr}.metric{border-right:0;border-bottom:2px solid var(--black)}.service-item{grid-template-columns:48px 1fr 38px}.footer-row{flex-direction:column;align-items:flex-start}.feature-card:nth-child(n){border-right:0}}

/* Mobile-first header + responsive refinements
   Header is ALWAYS just two floating glassy capsules (.brand logo pill +
   .menu-toggle hamburger pill) — the .site-header container itself never
   gets a visible background/border/bar, on any page, at any scroll
   position. Confirmed as the intended design after multiple wrong attempts
   at giving it a solid "past-hero" bar state — don't reintroduce that. */
.site-header{position:fixed;top:18px;left:0;width:100%;z-index:50;pointer-events:none;background:transparent;border-bottom:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0}
.nav-shell{position:relative}
.menu-toggle,.menu-close{display:none;font:700 14px 'Space Mono',monospace;text-transform:uppercase;border:2px solid var(--black);background:var(--white);color:var(--black);border-radius:999px;cursor:pointer;transition:transform .2s ease}
.menu-toggle:hover,.menu-close:hover{transform:scale(1.1)}
.menu-toggle{width:48px;height:48px;align-items:center;justify-content:center;flex-direction:column;gap:5px;padding:0}
.menu-toggle span{display:block;width:22px;height:2px;background:var(--black)}
.menu-close{width:46px;height:46px;font-size:28px;line-height:1;display:none;align-items:center;justify-content:center;padding:0}
.mobile-menu{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;z-index:80;background:rgba(0,0,0,.55);opacity:0;pointer-events:none;transition:opacity .22s ease}
.mobile-menu-panel{position:absolute;top:0;right:0;width:min(86vw,380px);height:100%;background:var(--black);color:var(--white);border-left:2px solid var(--black);transform:translateX(100%);transition:transform .25s ease;padding:18px;display:flex;flex-direction:column;gap:0}
.mobile-menu.is-open{opacity:1;pointer-events:auto}.mobile-menu.is-open .mobile-menu-panel{transform:translateX(0)}
.mobile-menu-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.22);padding-bottom:16px;margin-bottom:10px;color:var(--orange)}
.mobile-menu-panel>a{font-family:'Archivo Black',Impact,sans-serif;text-transform:uppercase;letter-spacing:-.04em;font-size:clamp(38px,12vw,62px);line-height:.9;border-bottom:1px solid rgba(255,255,255,.22);padding:18px 0;transition:transform .2s,color .2s}
.mobile-menu-panel>a:hover,.mobile-menu-panel>a.active{color:var(--orange);transform:translateX(14px)}
.mobile-menu-note{margin-top:auto;color:var(--orange);border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:13px 14px;font-size:11px;text-align:center}
.mobile-policy-links{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0}
.mobile-policy-links a{display:flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.25);border-radius:999px;padding:10px 8px;font-size:10px;color:var(--white);background:rgba(255,255,255,.08)}
.mobile-policy-links a.active{background:var(--orange);color:var(--black)}
body.menu-open{overflow:hidden}
.india-strip{display:grid;grid-template-columns:repeat(4,1fr);border:2px solid var(--black);background:var(--white);margin-top:24px}
.india-strip div{padding:16px;border-right:2px solid var(--black)}.india-strip div:last-child{border-right:0}.india-strip strong{display:block;font-family:'Archivo Black';font-size:clamp(28px,4vw,54px);letter-spacing:-.04em}.india-strip span{font-family:'Space Mono';font-size:11px;text-transform:uppercase}
.auth-card .hint{font-size:13px;line-height:1.45;margin-top:14px}
/* Referral-code feedback under the signup field: sits tight to its own input instead of
   taking the default hint spacing, and reserves its line so the form doesn't jump as the
   message appears and disappears while typing. */
.auth-card .referral-hint{margin-top:7px;min-height:1.25em;font-weight:600}
.auth-card .referral-ok{color:#0f7a4a}
.auth-card .referral-bad{color:#a3161c}
.legal-consent{font-size:12.5px;line-height:1.45;color:var(--muted);margin:0 0 16px}
.legal-consent a{text-decoration:underline;text-underline-offset:3px;font-weight:800;color:var(--black)}
.legal-hero h1{font-size:clamp(62px,11vw,156px)}
.legal-layout{display:grid;grid-template-columns:minmax(240px,340px) 1fr;gap:24px;align-items:start;padding:48px 0 92px}
.legal-meta{position:sticky;top:104px}
.legal-meta h2{font-size:32px;margin:8px 0 12px;letter-spacing:-.04em}
.legal-meta p{line-height:1.45}
.legal-card{background:var(--glass-strong);border:1px solid var(--glass-line);border-radius:28px;padding:34px;backdrop-filter:blur(20px) saturate(135%);-webkit-backdrop-filter:blur(20px) saturate(135%);box-shadow:0 20px 50px rgba(23,32,51,.08), inset 0 1px 0 rgba(255,255,255,.85)}
.legal-card h2{font-size:24px;letter-spacing:-.03em;margin:0 0 10px}
.legal-card h2:not(:first-child){margin-top:28px}
.legal-card p{font-size:16px;line-height:1.65;margin:0;color:rgba(23,32,51,.78)}
.legal-card a,.legal-meta a{text-decoration:underline;text-underline-offset:3px;font-weight:800}

@media(max-width:900px){
  .site-header{top:0;padding:8px 0}.nav-shell{display:flex;align-items:center;justify-content:space-between;gap:12px}.brand{display:inline-flex}.brand span{display:none}.logo-mark{width:46px;height:46px;border-radius:12px}.nav-pill,.socials{display:none}.menu-toggle{display:flex}.menu-close{display:flex}
  .container{width:min(100% - 24px,1440px)}
  .hero{min-height:auto;padding-top:44px}.hero-kicker{align-items:flex-start;gap:14px;font-size:10px}.hero h1{font-size:clamp(58px,22vw,118px);text-align:left;line-height:.82;margin-bottom:18px}.hero-copy{grid-template-columns:1fr;padding:18px 0 28px}.rotate-wrap{width:112px;height:112px;margin:8px 0}.hero-copy p{font-size:20px}.hero-copy .left{font-size:12px}.hero-copy .right{text-align:left}
  .marquee-section{margin:42px 0;padding:32px 0}.marquee span{font-size:clamp(42px,16vw,76px)}
  .legal-layout{grid-template-columns:1fr;padding:28px 0 56px}.legal-meta{position:static}.legal-card{border-radius:22px;padding:22px}.legal-card h2{font-size:21px}.legal-card p{font-size:14.5px;line-height:1.58}
  .split{padding:48px 0;gap:24px}.split h2,.section-title{font-size:clamp(48px,17vw,86px)}.lede{font-size:clamp(20px,8vw,32px)}.panel{padding:18px}.features-grid,.pricing-grid{display:grid;grid-template-columns:1fr}.feature-card{min-height:210px;padding:22px}.feature-card .num{margin-bottom:36px}.feature-card h3{font-size:42px}.services{padding:56px 0}.service-item{grid-template-columns:40px 1fr 30px;padding:24px 0}.service-title{font-size:clamp(38px,13vw,68px)}.arrow{font-size:38px;opacity:1}.pricing{padding:56px 0}.price-card{padding:22px}.price-card h3{font-size:40px}.price{font-size:56px}.cta{padding:56px 0}.cta h2{font-size:clamp(58px,22vw,110px)}.footer-row{font-size:11px}.footer-links{flex-wrap:wrap}.page-hero{padding:56px 0 42px}.page-hero h1{font-size:clamp(58px,21vw,110px)}.page-hero p{font-size:22px}.form-page{padding:80px 12px 34px;place-items:start center}.auth-card{padding:22px}.auth-card h1{font-size:clamp(56px,18vw,78px)}.btn{width:100%;padding:1rem}.btn:hover{transform:scale(1.03)}.india-strip{grid-template-columns:1fr 1fr}.india-strip div:nth-child(2){border-right:0}.india-strip div:nth-child(-n+2){border-bottom:2px solid var(--black)}
}

@media(max-width:520px){
  .hero-kicker{display:grid;grid-template-columns:1fr}.metrics,.india-strip{grid-template-columns:1fr}.india-strip div{border-right:0;border-bottom:2px solid var(--black)}.india-strip div:last-child{border-bottom:0}.feature-card h3{font-size:36px}.tags{gap:6px}.tag{font-size:10px}.mobile-menu-panel{width:92vw}.mobile-menu-panel>a{font-size:42px}.footer-row{align-items:flex-start}.footer-links{gap:12px}.auth-card p.mono{font-size:11px}
}

/* Light glassy visual refresh */
:root{
  --orange:#ff7a3d;
  --black:#172033;
  --white:#ffffff;
  --cream:#fff7ef;
  --glass:rgba(255,255,255,.58);
  --glass-strong:rgba(255,255,255,.78);
  --glass-line:rgba(23,32,51,.16);
  --soft-orange:rgba(255,122,61,.20);
  --muted:rgba(23,32,51,.66);
  --line:1px solid var(--glass-line);
}
html{background:#fff7ef}
body{
  background:
    radial-gradient(circle at 12% 10%, rgba(255,122,61,.30), transparent 34%),
    radial-gradient(circle at 86% 4%, rgba(255,255,255,.86), transparent 28%),
    linear-gradient(135deg,#fff7ef 0%,#ffe9dc 48%,#fffaf6 100%);
  color:var(--black);
}
::selection{background:var(--black);color:#ffd9c8}
/* .site-header itself is ALWAYS fully transparent/invisible (see the base
   rule above) — it is only a positioning container. Only .brand (logo) and
   .menu-toggle (hamburger) — its two children — have their own individual
   glassy capsule backgrounds. Do not give .site-header itself a
   background/border/shadow again; that's what produced the "whole bar"
   look instead of two floating capsules. */
.logo-mark,.socials a,.menu-toggle,.menu-close{
  background:rgba(255,255,255,.76);
  border:1px solid rgba(23,32,51,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8),0 10px 24px rgba(23,32,51,.08);
}
.nav-pill{
  background:rgba(255,255,255,.58);
  border:1px solid rgba(23,32,51,.14);
  backdrop-filter:blur(18px);
  box-shadow:0 14px 34px rgba(23,32,51,.10), inset 0 1px 0 rgba(255,255,255,.9);
}
.nav-pill a{color:var(--black)}
.nav-pill a:hover,.nav-pill a.active{background:var(--black);color:var(--white)}
.hero-kicker,.hero-copy,.page-hero,.footer{border-color:rgba(23,32,51,.18)!important}
.hero h1,.page-hero h1,.section-title,.split h2,.cta h2{
  color:var(--black);
  text-shadow:0 1px 0 rgba(255,255,255,.6);
}
.rotate-wrap{background:rgba(255,255,255,.40);border:1px solid rgba(23,32,51,.12);border-radius:50%;backdrop-filter:blur(12px)}
.marquee-section{
  background:rgba(255,255,255,.44);
  color:var(--black);
  border-block:1px solid rgba(23,32,51,.14);
  backdrop-filter:blur(16px);
}
.marquee.row1 span{color:#ff6d2d}.marquee.row2 span{color:rgba(23,32,51,.62)}
.panel,.metric,.price-card,.auth-card,.feature-card,.india-strip,.field input{
  background:var(--glass-strong)!important;
  border:1px solid var(--glass-line)!important;
  backdrop-filter:blur(20px) saturate(135%);
  -webkit-backdrop-filter:blur(20px) saturate(135%);
  box-shadow:0 20px 50px rgba(23,32,51,.08), inset 0 1px 0 rgba(255,255,255,.85);
}
.panel,.auth-card,.price-card{border-radius:28px}.feature-card{border-radius:24px}.metrics,.pricing-grid,.features-grid,.india-strip{border:0!important;background:transparent!important;gap:16px}.metric,.india-strip div{border-right:0!important;border-bottom:0!important;border-radius:20px}
.feature-card:hover,.price-card.highlight{
  background:rgba(255,255,255,.92)!important;
  color:var(--black)!important;
  transform:translateY(-6px) scale(1.01);
}
.price-card.highlight{outline:1px solid rgba(255,122,61,.38)}
.services{
  background:rgba(255,255,255,.48);
  color:var(--black);
  backdrop-filter:blur(18px);
  border-block:1px solid rgba(23,32,51,.12);
}
.service-list,.service-item{border-color:rgba(23,32,51,.14)!important}.service-item:hover{background:rgba(255,122,61,.10)}.service-item .idx,.arrow{color:#ff6d2d}.tag{border-color:rgba(23,32,51,.18);color:rgba(23,32,51,.70);background:rgba(255,255,255,.42)}
.btn{border:1px solid rgba(23,32,51,.20);box-shadow:0 12px 28px rgba(23,32,51,.10), inset 0 1px 0 rgba(255,255,255,.24)}
.btn.black{background:var(--black);color:var(--white)}.btn.white,.btn.orange{background:rgba(255,255,255,.72);color:var(--black)}
.dashboard-panel{overflow:hidden}
.dash-mockup{padding:18px;border-radius:24px;background:linear-gradient(135deg,rgba(255,255,255,.82),rgba(255,122,61,.12));border:1px solid rgba(23,32,51,.13);box-shadow:inset 0 1px 0 rgba(255,255,255,.9);margin-bottom:18px}
.dash-top{display:flex;justify-content:space-between;gap:12px;font-size:11px;padding-bottom:14px;border-bottom:1px solid rgba(23,32,51,.12)}
.dash-graph{height:190px;display:flex;align-items:end;gap:12px;padding:20px 4px 10px}.dash-graph i{flex:1;border-radius:999px;background:linear-gradient(180deg,#ff7a3d,#172033);min-height:34px;box-shadow:0 12px 30px rgba(255,122,61,.18)}
.dash-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.dash-grid div{background:rgba(255,255,255,.62);border:1px solid rgba(23,32,51,.10);border-radius:16px;padding:14px}.dash-grid strong{display:block;font-family:'Archivo Black';font-size:30px;letter-spacing:-.04em}.dash-grid span{font-family:'Space Mono';font-size:10px;text-transform:uppercase;color:rgba(23,32,51,.66)}
@media(max-width:900px){.metrics,.pricing-grid,.features-grid,.india-strip{gap:12px}.hero{padding-top:34px}.dash-graph{height:150px}.panel,.auth-card,.price-card{border-radius:22px}.feature-card{border-radius:20px}}


/* Interactive waves hero + Indian SaaS ecommerce polish */
.hero-waves{
  position:relative;
  width:100%;
  min-height:100svh;
  isolation:isolate;
  overflow:hidden;
  padding-top:118px;
  display:flex;
  align-items:flex-end;
}
.hero-inner{position:relative;z-index:2;width:min(1440px,calc(100% - 40px));padding-bottom:34px}
.waves-canvas{
  position:absolute;
  inset:0;
  z-index:0;
  width:100%;
  height:100%;
  display:block;
  pointer-events:none;
  opacity:.42;
  mix-blend-mode:multiply;
}
.hero-waves::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.70), transparent 34%),
    linear-gradient(180deg, rgba(255,247,239,.25) 0%, rgba(255,233,220,.78) 100%);
  pointer-events:none;
}
.nav-shell{
  background:transparent;
}
.brand{
  color:var(--black);
  text-shadow:0 1px 0 rgba(255,255,255,.65);
}
.nav-pill,.socials a,.logo-mark,.menu-toggle,.menu-close{
  background:rgba(255,255,255,.46)!important;
  border:1px solid rgba(23,32,51,.13)!important;
  /* backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%); */
  box-shadow:0 12px 34px rgba(23,32,51,.08), inset 0 1px 0 rgba(255,255,255,.78)!important;
}
.socials a:last-child{background:rgba(23,32,51,.88)!important;color:#fff}
.hero h1{
  max-width:1180px;
  margin:0 auto 26px;
  text-align:center;
  font-size:clamp(76px,14.6vw,238px);
}
.hero-copy{
  grid-template-columns:minmax(220px,.85fr) auto minmax(280px,1fr);
  align-items:end;
  gap:24px;
  border-top:1px solid rgba(23,32,51,.16)!important;
  padding:24px 0 0;
}
.hero-actions{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
  pointer-events:auto;
  flex-wrap:wrap;
}
.btn.glass{
  background:rgba(255,255,255,.52);
  color:var(--black);
  backdrop-filter:blur(16px) saturate(145%);
  -webkit-backdrop-filter:blur(16px) saturate(145%);
}
.rotate-wrap,.center-arrow{display:none!important}
.hero-copy .right{max-width:560px;justify-self:end;text-align:right}
.hero-copy .left{max-width:360px}
@media(max-width:900px){
  .hero-waves{min-height:100svh;padding-top:92px;align-items:center}
  .hero-inner{width:min(100% - 24px,1440px);padding-bottom:24px}
  .hero-kicker{display:grid;grid-template-columns:1fr;gap:8px;text-align:left;margin-bottom:18px}
  .hero h1{font-size:clamp(64px,23vw,122px);text-align:left;line-height:.84;margin:0 0 18px}
  .hero-copy{grid-template-columns:1fr;gap:18px;padding-top:18px;text-align:left}
  .hero-copy .right,.hero-copy .left{max-width:100%;justify-self:start;text-align:left}
  .hero-actions{justify-content:flex-start;width:100%}
  .hero-actions .btn{width:auto;min-width:145px;flex:1 1 145px}
  .waves-canvas{opacity:.34}
}
@media(max-width:520px){
  .hero-waves{padding-top:84px;align-items:flex-end}
  .hero h1{font-size:clamp(58px,21vw,92px);letter-spacing:-.055em}
  .hero-copy p{font-size:clamp(17px,5.4vw,22px);line-height:1.08}
  .hero-copy .left{font-size:11px;line-height:1.45}
  .hero-actions{gap:10px}
  .hero-actions .btn{width:100%;flex-basis:100%}
}
@media(prefers-reduced-motion:reduce){
  .waves-canvas{display:none}
  .marquee span{animation:none!important}
}

/* Mobile alignment + stronger wave visibility patch */
.waves-canvas{
  opacity:.68;
}
.hero-waves::before{
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.50), transparent 32%),
    linear-gradient(180deg, rgba(255,247,239,.10) 0%, rgba(255,229,214,.62) 100%);
}
.hero h1{
  max-width:100%;
  overflow-wrap:normal;
  word-break:normal;
}
.hero-copy .right,
.hero-copy .left{
  overflow-wrap:break-word;
}

@media(max-width:900px){
  .container{width:min(100% - 28px,1440px)}
  .hero-waves{padding-top:104px;align-items:flex-end}
  .hero-inner{width:min(100% - 28px,1440px);padding-bottom:28px}
  .hero-kicker{font-size:10px;gap:8px;padding-bottom:14px;margin-bottom:22px}
  .hero h1{
    font-size:clamp(52px,16.2vw,96px)!important;
    line-height:.86!important;
    letter-spacing:-.06em;
    text-align:left!important;
    margin:0 0 22px!important;
  }
  .hero-copy{
    gap:16px;
    padding-top:20px;
    padding-bottom:0;
  }
  .hero-copy p{
    font-size:clamp(16px,3.9vw,20px)!important;
    line-height:1.12!important;
    max-width:680px;
  }
  .hero-copy .left{font-size:11px!important;line-height:1.42!important}
  .hero-actions{gap:10px;margin:2px 0 4px}
  .hero-actions .btn{min-height:56px;padding:.88rem 1rem;font-size:11px}
  .section-title,.split h2,.page-hero h1{
    font-size:clamp(42px,12.5vw,78px)!important;
    line-height:.92!important;
    letter-spacing:-.055em;
  }
  .service-title{font-size:clamp(34px,10.5vw,58px)!important;line-height:.92!important}
  .cta h2{font-size:clamp(48px,16vw,92px)!important;line-height:.9!important}
  .feature-card h3,.price-card h3{font-size:clamp(30px,8.5vw,42px)!important;line-height:.95!important}
  .page-hero p,.lede{font-size:clamp(18px,5vw,28px)!important;line-height:1.02!important}
  .waves-canvas{opacity:.62!important}
}

@media(max-width:520px){
  .container{width:min(100% - 24px,1440px)}
  .hero-waves{padding-top:96px;min-height:100svh}
  .hero-inner{width:min(100% - 24px,1440px)}
  .hero h1{
    font-size:clamp(46px,15.5vw,68px)!important;
    line-height:.88!important;
    letter-spacing:-.055em;
  }
  .hero-kicker{font-size:9px;line-height:1.35}
  .hero-copy p{font-size:clamp(15px,4.8vw,18px)!important;line-height:1.14!important}
  .hero-actions .btn{min-height:52px;border-radius:28px}
  .section-title,.split h2,.page-hero h1{font-size:clamp(38px,13vw,60px)!important}
  .service-title{font-size:clamp(30px,11vw,48px)!important}
  .waves-canvas{opacity:.72!important}
}


/* Final hero hook + darker interactive waves patch */
.hero-waves{
  background:
    radial-gradient(circle at 55% 18%, rgba(255,255,255,.42), transparent 28%),
    linear-gradient(180deg, #ffd2bf 0%, #f5a98c 100%)!important;
}
.hero-waves::before{
  background:
    linear-gradient(180deg, rgba(12,18,30,.05) 0%, rgba(12,18,30,.13) 100%),
    radial-gradient(circle at 45% 12%, rgba(255,255,255,.26), transparent 30%)!important;
}
.waves-canvas{
  opacity:.94!important;
  mix-blend-mode:multiply!important;
  filter:contrast(1.35) saturate(1.05)!important;
}
.hero-waves .hero-kicker{display:none!important}
.hero-waves .hero-inner{
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  min-height:calc(100svh - 118px);
}
.hero-waves h1{
  font-size:clamp(66px,13vw,202px)!important;
  line-height:.84!important;
  letter-spacing:-.058em!important;
  text-align:left!important;
  margin:0 0 28px!important;
  max-width:1180px!important;
}
.hero-waves .hero-copy{
  border-top:1px solid rgba(23,32,51,.30)!important;
  grid-template-columns:minmax(220px,.9fr) auto minmax(260px,1fr)!important;
  align-items:center!important;
  padding:24px 0 34px!important;
}
.hero-waves .hero-copy p{
  color:#111827!important;
  text-shadow:0 1px 0 rgba(255,255,255,.35);
}
.hero-waves .hero-copy .left{
  font-size:clamp(12px,1.15vw,15px)!important;
  line-height:1.45!important;
}
.hero-waves .hero-copy .right{
  font-size:clamp(18px,2.2vw,30px)!important;
  line-height:1.05!important;
}
@media(max-width:900px){
  .hero-waves{padding-top:92px!important;align-items:stretch!important}
  .hero-waves .hero-inner{min-height:calc(100svh - 92px);width:min(100% - 28px,1440px)!important;padding-bottom:28px!important}
  .hero-waves h1{
    font-size:clamp(50px,15.5vw,90px)!important;
    line-height:.87!important;
    margin-bottom:20px!important;
  }
  .hero-waves .hero-copy{
    grid-template-columns:1fr!important;
    gap:16px!important;
    padding:20px 0 0!important;
  }
  .hero-waves .hero-copy .left,
  .hero-waves .hero-copy .right{
    text-align:left!important;
    max-width:100%!important;
    justify-self:start!important;
  }
  .hero-waves .hero-copy .right{font-size:clamp(16px,4.4vw,20px)!important;line-height:1.12!important}
  .hero-waves .hero-actions{width:100%;justify-content:flex-start!important}
  .hero-waves .hero-actions .btn{flex:1 1 150px;min-height:54px}
}
@media(max-width:520px){
  .hero-waves{padding-top:88px!important;background:linear-gradient(180deg,#ffd5c4 0%,#f2a184 100%)!important}
  .hero-waves .hero-inner{min-height:calc(100svh - 88px);width:min(100% - 24px,1440px)!important}
  .hero-waves h1{
    font-size:clamp(44px,15vw,64px)!important;
    line-height:.9!important;
    letter-spacing:-.05em!important;
  }
  .hero-waves .hero-copy .left{font-size:11px!important;line-height:1.42!important}
  .hero-waves .hero-copy .right{font-size:clamp(15px,4.6vw,18px)!important}
  .hero-waves .hero-actions .btn{width:100%;flex-basis:100%;min-height:52px}
  .waves-canvas{opacity:1!important}
}

/* Requested hero heading: two-color Hinglish hook, no mobile clipping */
.hero-waves{
  background:
    radial-gradient(circle at 50% 12%, rgba(255,255,255,.18), transparent 30%),
    linear-gradient(180deg, #e98d6c 0%, #b95f43 58%, #8f3f2c 100%)!important;
}
.hero-waves::before{
  background:
    linear-gradient(180deg, rgba(9,14,24,.22) 0%, rgba(9,14,24,.34) 100%),
    radial-gradient(circle at 42% 15%, rgba(255,255,255,.15), transparent 28%)!important;
}
.hero-title{
  display:flex!important;
  flex-direction:column!important;
  gap:.02em!important;
  overflow:visible!important;
  word-break:normal!important;
}
.hero-title .accent{
  color:#fff1e8!important;
  text-shadow:0 3px 0 rgba(13,23,42,.20);
}
.hero-title span:not(.accent){
  color:#101827!important;
}
.hero-waves h1.hero-title{
  font-size:clamp(54px,9.6vw,138px)!important;
  line-height:.88!important;
  letter-spacing:-.052em!important;
  max-width:1280px!important;
  width:100%!important;
  margin-bottom:24px!important;
}
@media(max-width:900px){
  .hero-waves h1.hero-title{
    font-size:clamp(44px,12.2vw,82px)!important;
    line-height:.93!important;
    letter-spacing:-.045em!important;
    margin-bottom:18px!important;
  }
}
@media(max-width:520px){
  .hero-waves{
    background:
      radial-gradient(circle at 50% 10%, rgba(255,255,255,.14), transparent 30%),
      linear-gradient(180deg,#df8160 0%,#ad563c 62%,#873a29 100%)!important;
  }
  .hero-waves h1.hero-title{
    font-size:clamp(36px,11.2vw,52px)!important;
    line-height:.98!important;
    letter-spacing:-.035em!important;
    margin-bottom:18px!important;
    padding-right:4px!important;
  }
  .hero-title .accent{
    font-size:.94em!important;
  }
  .hero-waves .hero-inner{
    justify-content:center!important;
    padding-top:18px!important;
    padding-bottom:22px!important;
  }
  .hero-waves .hero-copy{
    gap:13px!important;
  }
}
@media(max-width:380px){
  .hero-waves h1.hero-title{
    font-size:clamp(32px,10.6vw,42px)!important;
    line-height:1!important;
    letter-spacing:-.028em!important;
  }
}

/* Prowider integration safety: keep the 7-style mobile header/actions visible */
@media(max-width:900px){
  .site-header .menu-toggle{
    display:flex!important;
    position:fixed!important;
    top:14px!important;
    right:14px!important;
    z-index:90!important;
  }
  .hero-waves .hero-copy .right{
    max-width:100%!important;
    font-size:clamp(14px,4vw,17px)!important;
    line-height:1.08!important;
    overflow-wrap:anywhere!important;
  }
}



/* Glassy logo + TULITTLE capsule header patch */
.site-header .brand{
  display:inline-flex!important;
  align-items:center!important;
  gap:9px!important;
  width:max-content!important;
  padding:6px 14px 6px 7px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.48)!important;
  border:1px solid rgba(23,32,51,.16)!important;
  backdrop-filter:blur(18px) saturate(155%);
  -webkit-backdrop-filter:blur(18px) saturate(155%);
   backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  box-shadow:0 12px 34px rgba(23,32,51,.10), inset 0 1px 0 rgba(255,255,255,.82)!important;
  pointer-events:auto!important;
}
.site-header .brand .logo-mark{
  width:35px!important;
  height:35px!important;
  border-radius:16px!important;
  padding:5px!important;
  background:rgba(255,255,255,.64)!important;
  border:1px solid rgba(23,32,51,.12)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.86), 0 8px 18px rgba(23,32,51,.08)!important;
  flex:0 0 auto!important;
}
.site-header .brand span{
  display:inline-block!important;
  color:#101827!important;
  font-family:'Space Mono',monospace!important;
  font-size:13px!important;
  line-height:1!important;
  letter-spacing:-.04em!important;
  font-weight:700!important;
  text-transform:none!important;
  text-shadow:0 1px 0 rgba(255,255,255,.55)!important;
}
@media(max-width:900px){
  .site-header .nav-shell{display:flex!important;align-items:center!important;justify-content:space-between!important}
  .site-header .brand{display:inline-flex!important;padding:5px 12px 5px 6px!important;gap:8px!important}
  .site-header .brand .logo-mark{width:42px!important;height:42px!important;border-radius:14px!important}
  .site-header .brand span{display:inline-block!important;font-size:12px!important}
}
@media(max-width:380px){
  .site-header .brand{padding-right:10px!important;gap:7px!important}
  .site-header .brand .logo-mark{width:38px!important;height:38px!important}
  .site-header .brand span{font-size:11px!important}
  .menu-toggle{width:44px!important;height:44px!important}
}

/* About page replacement for oversized logo */
.about-ops-card{overflow:hidden;position:relative}
.about-ops-card img{display:none!important}
.ops-visual{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:24px}
.ops-visual span{height:92px;border:2px solid var(--black);border-radius:24px;background:linear-gradient(135deg,rgba(255,122,61,.85),rgba(255,247,239,.86));box-shadow:inset 0 0 28px rgba(23,32,51,.08)}
.ops-visual span:nth-child(2){height:132px;background:linear-gradient(135deg,rgba(23,32,51,.95),rgba(255,122,61,.5))}
.ops-visual span:nth-child(3){height:132px;background:linear-gradient(135deg,rgba(255,247,239,.95),rgba(255,122,61,.58))}
.ops-visual span:nth-child(4){height:92px;background:linear-gradient(135deg,rgba(23,32,51,.88),rgba(255,247,239,.66))}
.ops-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.ops-pills span{font-family:'Space Mono',monospace;text-transform:uppercase;font-size:11px;font-weight:700;border:1px solid rgba(23,32,51,.2);background:rgba(255,255,255,.46);border-radius:999px;padding:8px 10px}
@media(max-width:640px){.ops-visual span{height:72px}.ops-visual span:nth-child(2),.ops-visual span:nth-child(3){height:102px}.auth-card{max-width:100%}.field input,.field select{padding:14px;font-size:15px}}

/* User requested: no white box behind header logo, only one clean glass capsule */
.site-header .brand{
  background:rgba(255,241,232,.32)!important;
  border:1px solid rgba(255,241,232,.58)!important;
  box-shadow:0 12px 30px rgba(9,14,24,.16), inset 0 1px 0 rgba(255,255,255,.46)!important;
}
.site-header .brand .logo-mark{
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  object-fit:contain!important;
  border-radius:0!important;
}

/* User requested: small hero side/bottom text should be creamy fill with black outline */
/* Was stacking a hard 5-direction text-shadow *plus* a 0.7px stroke to fake an
   outline — at normal reading size the offsets don't fully overlap, so it read
   as doubled/ghosted text and hurt legibility. A single soft shadow gives the
   same light-text-on-light-background contrast without the smear. */
.hero-waves .hero-copy p,
.hero-waves .hero-copy .left,
.hero-waves .hero-copy .right{
  color:#fff1e8!important;
  -webkit-text-stroke:.4px #101827!important;
  text-shadow:0 1px 2px rgba(16,24,39,.55)!important;
  paint-order:stroke fill!important;
}
@media(max-width:520px){
  .hero-waves .hero-copy p,
  .hero-waves .hero-copy .left,
  .hero-waves .hero-copy .right{
    -webkit-text-stroke:.55px #101827!important;
  }
}

/* Hard fix: header logo image must have no inner white/cream box */
.site-header .brand .logo-mark,
.site-header .brand img.logo-mark{
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  box-shadow:none!important;
  padding:0!important;
  border-radius:0!important;
  object-fit:contain!important;
  display:block!important;
  mix-blend-mode:normal!important;
}

/* Final logo asset fix: use uploaded transparent PNG with no white tile behind it */
.site-header .brand img.logo-mark,
.site-header .brand .logo-mark{
  background:transparent!important;
  background-color:transparent!important;
  border:none!important;
  outline:none!important;
  box-shadow:none!important;
  padding:0!important;
  border-radius:0!important;
  filter:none!important;
  mix-blend-mode:normal!important;
}
.site-header .brand{
  overflow:hidden!important;
}


/* Final requested fixes: transparent logo asset, orange hero, complete feature matrix */
.site-header .brand{
  background:linear-gradient(135deg,rgba(255,241,232,.42),rgba(255,255,255,.18))!important;
  border:1px solid rgba(255,241,232,.62)!important;
  border-radius:999px!important;
  overflow:visible!important;
  backdrop-filter:blur(20px) saturate(160%)!important;
  -webkit-backdrop-filter:blur(20px) saturate(160%)!important;
}
.site-header .brand img.logo-mark{
  background:transparent!important;
  background-color:transparent!important;
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
  padding:0!important;
  border-radius:0!important;
  object-fit:contain!important;
}
.hero-waves{
  background:
    radial-gradient(circle at 58% 8%, rgba(255,244,232,.28), transparent 32%),
    linear-gradient(180deg,#ff9a5f 0%,#f0783f 48%,#c8552f 100%)!important;
}
.hero-waves::before{
  background:
    linear-gradient(180deg,rgba(37,17,8,.10) 0%,rgba(37,17,8,.22) 100%),
    radial-gradient(circle at 32% 18%,rgba(255,236,218,.20),transparent 34%)!important;
}
.waves-canvas{
  opacity:.88!important;
  filter:contrast(1.2) saturate(1.18)!important;
}
.feature-summary{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:26px;
  max-width:920px;
}
.feature-summary div{
  border:2px solid var(--black);
  background:rgba(255,255,255,.58);
  border-radius:22px;
  padding:18px;
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.feature-summary strong{
  display:block;
  font-family:'Archivo Black',Impact,sans-serif;
  font-size:clamp(38px,6vw,72px);
  letter-spacing:-.05em;
  line-height:.9;
}
.feature-summary span{
  display:block;
  margin-top:8px;
  font-family:'Space Mono',monospace;
  text-transform:uppercase;
  font-size:12px;
  font-weight:700;
}
.full-feature-section{padding:72px 0 24px}
.module-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.module-card{
  border:2px solid var(--black);
  background:rgba(255,247,239,.82);
  border-radius:28px;
  padding:22px;
  box-shadow:0 18px 40px rgba(0,0,0,.10);
}
.module-head{
  display:grid;
  grid-template-columns:54px 1fr;
  gap:14px;
  align-items:start;
  border-bottom:2px solid var(--black);
  padding-bottom:16px;
  margin-bottom:16px;
}
.module-head span{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border:2px solid var(--black);
  border-radius:999px;
  background:var(--orange);
  font-size:11px;
}
.module-head h3{
  margin:0;
  font-size:clamp(28px,4vw,54px);
  line-height:.92;
}
.module-card ul{
  list-style:none;
  padding:0;
  margin:0;
  columns:2;
  column-gap:16px;
}
.module-card li{
  break-inside:avoid;
  border-bottom:1px solid rgba(0,0,0,.18);
  padding:8px 0;
  font-weight:800;
  font-size:14px;
  line-height:1.25;
}
@media(max-width:900px){
  .feature-summary,.module-grid{grid-template-columns:1fr}
  .full-feature-section{padding-top:42px}
  .module-card{border-radius:22px;padding:18px}
  .module-head{grid-template-columns:46px 1fr;gap:12px}
  .module-head span{width:40px;height:40px}
  .module-card ul{columns:1}
}
@media(max-width:520px){
  .hero-waves{
    background:
      radial-gradient(circle at 52% 6%, rgba(255,244,232,.20), transparent 34%),
      linear-gradient(180deg,#ff955a 0%,#e66a37 56%,#b94829 100%)!important;
  }
  .site-header .brand img.logo-mark{width:30px!important;height:30px!important}
  .module-card li{font-size:15px}
}


/* Features mobile alignment fix */
.full-feature-section{overflow:hidden;}
.module-grid{align-items:stretch;}
.module-card{min-width:0;width:100%;}
.module-head h3{overflow-wrap:anywhere;word-break:normal;}
@media(max-width:640px){
  .features-hero{text-align:left;}
  .features-hero h1{font-size:clamp(48px,18vw,88px);line-height:.88;}
  .features-hero p{font-size:clamp(15px,5.2vw,20px);line-height:1.08;}
  .feature-summary{gap:10px;margin-top:18px;}
  .feature-summary div{padding:14px;border-radius:18px;width:100%;}
  .module-grid{grid-template-columns:1fr!important;gap:14px;width:100%;}
  .module-card{padding:16px;border-radius:20px;margin:0;width:100%;}
  .module-head{grid-template-columns:40px minmax(0,1fr);gap:10px;padding-bottom:12px;margin-bottom:12px;}
  .module-head span{width:36px;height:36px;font-size:10px;}
  .module-head h3{font-size:clamp(24px,9vw,36px);line-height:.95;letter-spacing:-.035em;}
  .module-card ul{columns:1!important;}
  .module-card li{font-size:13px;line-height:1.3;padding:7px 0;}
}
@media(max-width:380px){
  .module-card{padding:14px;}
  .module-head{grid-template-columns:36px minmax(0,1fr);}
  .module-head h3{font-size:30px;}
}


/* Desktop font-size refinement only: keep existing design, reduce oversized headings/cards */
@media (min-width:901px){
  .hero-waves h1.hero-title{
    font-size:clamp(50px,8.2vw,112px)!important;
    line-height:.92!important;
    letter-spacing:-.045em!important;
  }
  .hero-waves h1,
  .hero h1{
    font-size:clamp(58px,10.5vw,168px)!important;
    line-height:.9!important;
  }
  .page-hero h1{
    font-size:clamp(58px,9vw,136px)!important;
    line-height:.9!important;
  }
  .section-title,
  .split h2{
    font-size:clamp(46px,6.8vw,104px)!important;
    line-height:.92!important;
  }
  .cta h2{
    font-size:clamp(58px,10vw,168px)!important;
    line-height:.9!important;
  }
  .service-title{
    font-size:clamp(38px,5.4vw,78px)!important;
    line-height:.92!important;
  }
  .feature-card{
    min-height:230px!important;
    padding:24px!important;
  }
  .feature-card .num{
    margin-bottom:42px!important;
  }
  .feature-card h3{
    font-size:clamp(24px,3vw,40px)!important;
    line-height:.98!important;
  }
  .price-card h3{
    font-size:36px!important;
    line-height:1!important;
  }
  .price{
    font-size:58px!important;
    line-height:.95!important;
  }
  .auth-card h1{
    font-size:56px!important;
    line-height:.95!important;
  }
  .lede,
  .page-hero p{
    font-size:clamp(18px,2.2vw,32px)!important;
    line-height:1.05!important;
  }
}


/* Remove browser/tap blue highlight boxes on click while keeping layout unchanged */
*{
  -webkit-tap-highlight-color: transparent;
}
*:focus,
*:focus-visible,
*:active,
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
[tabindex]:focus{
  outline: none !important;
  box-shadow: none !important;
}
a, button, input, select, textarea, .btn, .brand, .nav-toggle{
  -webkit-tap-highlight-color: transparent;
}

/* Final Prowider mobile safety override */
@media(max-width:900px){
  .site-header button.menu-toggle{
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    position:fixed!important;
    top:14px!important;
    left:150px!important;
    right:auto!important;
    z-index:9999!important;
    width:48px!important;
    height:48px!important;
    background:rgba(255,255,255,.82)!important;
    border:1px solid rgba(23,32,51,.16)!important;
    border-radius:999px!important;
  }
  .site-header button.menu-toggle span{
    display:block!important;
    width:22px!important;
    height:2px!important;
    background:#172033!important;
  }
  .hero-waves .hero-copy .right{
    max-width:100%!important;
    font-size:clamp(14px,4vw,17px)!important;
    line-height:1.08!important;
    overflow-wrap:anywhere!important;
  }
}

/* ===== v2026070212: header hamburger right + nicer dashboard chart ===== */
.nav-shell{display:flex;align-items:center;justify-content:space-between;gap:14px}
.menu-toggle{margin-left:auto;order:99}
.dash-graph{display:flex;align-items:flex-end;gap:9px;height:130px;padding:8px 2px 0;border-bottom:2px solid rgba(0,0,0,.08)}
.dash-graph i{
  flex:1;border-radius:9px 9px 3px 3px;
  background:linear-gradient(180deg,#ff8a3d 0%,var(--orange,#FF4D00) 60%,#b83200 140%);
  box-shadow:0 8px 18px rgba(255,77,0,.25);
  position:relative;overflow:hidden;
  animation:dashBarUp .9s cubic-bezier(.2,.8,.2,1) backwards;
}
.dash-graph i::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.28),transparent 55%)}
.dash-graph i:nth-child(1){animation-delay:.05s}
.dash-graph i:nth-child(2){animation-delay:.12s}
.dash-graph i:nth-child(3){animation-delay:.19s}
.dash-graph i:nth-child(4){animation-delay:.26s}
.dash-graph i:nth-child(5){animation-delay:.33s}
.dash-graph i:nth-child(6){animation-delay:.4s}
@keyframes dashBarUp{from{transform:scaleY(0);transform-origin:bottom}to{transform:scaleY(1);transform-origin:bottom}}

/* ===== FINAL: hamburger hamesha right corner, brand capsule ke parallel ===== */
@media(max-width:900px){
  .site-header .nav-shell{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    width:100%!important;
  }
  .site-header .menu-toggle{
    position:static!important;
    margin-left:auto!important;
    order:99!important;
    display:flex!important;
    flex:0 0 auto!important;
  }
}

/* ===== v2026070214: feature cards (cream + navy border + orange num badge) ===== */
.feature-panels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.feature-panels .feature-card{
  background:#f6ecd9;
  border:2px solid #172033!important;
  border-radius:24px;
  padding:22px 22px 14px;
  box-shadow:0 10px 26px rgba(23,32,51,.10);
  display:flex;flex-direction:column;gap:14px;
}
.feature-card-head{display:flex;align-items:center;gap:12px}
.num-badge{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:999px;flex:0 0 auto;
  background:#f0813d;color:#172033;border:2px solid #172033;
  font-size:12px;font-weight:700;
}
.feature-panels .feature-card h3{margin:0;color:#172033;font-size:clamp(22px,2.6vw,30px);letter-spacing:-.02em}
.feature-list{list-style:none;margin:0;padding:0;border-top:2px solid #172033}
.feature-list li{
  padding:11px 2px;color:#172033;font-weight:700;font-size:14.5px;
  border-bottom:1.5px solid rgba(23,32,51,.35);
}
.feature-list li:last-child{border-bottom:1.5px solid rgba(23,32,51,.35)}
@media(max-width:900px){.feature-panels{grid-template-columns:1fr}}

/* About page — single column, no right box */
.about-single{max-width:820px;padding-top:10px;padding-bottom:30px}
.about-single .lede{margin:16px 0 22px}

/* ===== FINAL v2: hamburger — absolute right corner + brand capsule glass match ===== */
@media(max-width:900px){
  .site-header .nav-shell{position:relative!important;min-height:52px!important}
  .site-header .menu-toggle{
    position:absolute!important;
    right:12px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    margin:0!important;
    display:flex!important;
    z-index:95!important;
  }
  .site-header .menu-toggle:hover{transform:translateY(-50%) scale(1.06)!important}
}
/* Glass style — brand capsule ke jaisa hi */
.site-header .menu-toggle{
  width:46px!important;
  height:46px!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.48)!important;
  border:1px solid rgba(23,32,51,.16)!important;
  box-shadow:0 12px 34px rgba(23,32,51,.10), inset 0 1px 0 rgba(255,255,255,.82)!important;
  backdrop-filter:blur(18px) saturate(155%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(155%)!important;
  /* backdrop-filter promotes this to its own compositor layer, which was
     letting real mouse/touch clicks miss the hit-test target even though
     it visually painted on top (a synthetic .click() bypasses hit-testing,
     which is why it looked "fixed" in earlier testing) — same root cause
     already diagnosed for .admin-notif-bell. isolation+translateZ pins
     paint/hit-test order unambiguously. */
  isolation:isolate!important;
  transform:translateZ(0)!important;
  pointer-events:auto!important;
  touch-action:manipulation!important;
  position:relative!important;
  z-index:60!important;
}
.site-header .menu-toggle span{
  width:20px!important;
  height:2px!important;
  background:#101827!important;
  border-radius:2px!important;
}

/* v2026070217: mobile hamburger aligned with the brand capsule */
@media(max-width:900px){
  .site-header .nav-shell{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    min-height:52px!important;
    width:min(1440px,calc(100% - 24px))!important;
    margin-inline:auto!important;
    position:relative!important;
  }

  .site-header button.menu-toggle{
    position:fixed!important;
    inset:auto!important;
    top:14px!important;
    right:14px!important;
    bottom:auto!important;
    left:auto!important;
    transform:none!important;
    order:2!important;
    margin:0!important;
    flex:0 0 auto!important;
    display:flex!important;
    width:52px!important;
    height:48px!important;
    border-radius:999px!important;
    background:linear-gradient(135deg,rgba(255,241,232,.42),rgba(255,255,255,.18))!important;
    border:1px solid rgba(255,241,232,.62)!important;
    box-shadow:0 12px 30px rgba(9,14,24,.16), inset 0 1px 0 rgba(255,255,255,.46)!important;
    backdrop-filter:blur(20px) saturate(160%)!important;
    -webkit-backdrop-filter:blur(20px) saturate(160%)!important;
  }

  .site-header button.menu-toggle:hover{
    transform:scale(1.04)!important;
  }
}

/* v2026070218: mobile text containment and menu close state */
.display,
.hero-title,
.hero-copy p,
.page-hero h1,
.page-hero p,
.service-title,
.price-card h3,
.feature-card h3,
.auth-card h1,
.lede,
.btn,
.tag,
.mobile-menu-panel>a{
  max-width:100%;
  overflow-wrap:anywhere;
  word-break:normal;
}

.btn,
.tag,
.field input,
.field select,
.price-card,
.feature-card,
.panel,
.auth-card{
  min-width:0;
}

body.menu-open .site-header button.menu-toggle span:nth-child(1){
  transform:translateY(7px) rotate(45deg);
}
body.menu-open .site-header button.menu-toggle span:nth-child(2){
  opacity:0;
}
body.menu-open .site-header button.menu-toggle span:nth-child(3){
  transform:translateY(-7px) rotate(-45deg);
}
body.menu-open .site-header button.menu-toggle span{
  transition:transform .18s ease,opacity .18s ease;
}

@media(max-width:900px){
  .hero-waves h1.hero-title,
  .page-hero h1{
    font-size:clamp(44px,17vw,86px)!important;
    line-height:.92!important;
    letter-spacing:-.035em!important;
  }

  .hero-copy p,
  .page-hero p,
  .lede{
    font-size:clamp(15px,5vw,24px)!important;
    line-height:1.14!important;
  }

  .service-title{
    font-size:clamp(32px,11vw,58px)!important;
    letter-spacing:-.03em!important;
  }

  .price-card h3,
  .feature-card h3,
  .auth-card h1{
    font-size:clamp(34px,12vw,58px)!important;
    line-height:.95!important;
  }

  .mobile-menu-panel>a{
    font-size:clamp(32px,10vw,48px)!important;
    line-height:1!important;
  }
}

@media(max-width:420px){
  .hero-waves h1.hero-title,
  .page-hero h1{
    font-size:clamp(36px,15vw,62px)!important;
  }

  .hero-actions .btn,
  .btn{
    font-size:11px!important;
    white-space:normal!important;
    text-align:center!important;
  }
}

/* v2026070301: keep mobile landing words intact */
.display,
.hero-title,
.hero-title span,
.hero-copy p,
.hero-waves .hero-copy .right,
.page-hero h1,
.page-hero p,
.service-title,
.price-card h3,
.feature-card h3,
.auth-card h1,
.module-head h3,
.lede,
.btn,
.tag,
.mobile-menu-panel>a{
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
}

.hero-title span{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  white-space:normal!important;
}

.hero-waves .hero-copy,
.hero-waves .hero-copy p{
  min-width:0!important;
  width:100%!important;
}

.hero-waves .hero-copy .left{
  display:block!important;
  max-width:100%!important;
  white-space:normal!important;
}

@media(max-width:900px){
  .hero-waves h1.hero-title{
    font-size:clamp(38px,14.6vw,70px)!important;
    line-height:.98!important;
    letter-spacing:-.018em!important;
  }

  .page-hero h1{
    font-size:clamp(40px,14.5vw,72px)!important;
    line-height:.98!important;
    letter-spacing:-.018em!important;
  }

  .hero-copy p,
  .page-hero p,
  .lede{
    font-size:clamp(14px,4.2vw,20px)!important;
    line-height:1.2!important;
  }

  .service-title{
    font-size:clamp(28px,8.8vw,48px)!important;
    line-height:1!important;
    letter-spacing:-.018em!important;
  }

  .price-card h3,
  .feature-card h3,
  .auth-card h1{
    font-size:clamp(30px,9.2vw,48px)!important;
    line-height:1!important;
    letter-spacing:-.018em!important;
  }

  .mobile-menu-panel>a{
    font-size:clamp(28px,8vw,40px)!important;
    line-height:1.04!important;
  }
}

@media(max-width:420px){
  .hero-waves h1.hero-title{
    font-size:clamp(30px,10vw,42px)!important;
    line-height:1.02!important;
    letter-spacing:-.012em!important;
  }

  .page-hero h1{
    font-size:clamp(34px,12vw,50px)!important;
  }

  .service-title{
    font-size:clamp(25px,8vw,36px)!important;
  }
}

@media(max-width:360px){
  .hero-waves h1.hero-title{
    font-size:29px!important;
  }

  .mobile-menu-panel>a{
    font-size:27px!important;
  }
}

/* Pricing CTA — smaller, aligned */
.cta-small{padding:56px 0!important;text-align:center}
.cta-small h2{font-size:clamp(34px,6vw,72px)!important;margin:0 0 14px!important;line-height:1!important;letter-spacing:-.02em}
.cta-small p{margin:0 auto;max-width:520px;line-height:1.6;overflow-wrap:anywhere}
.cta-small a{color:inherit;font-weight:700;text-decoration:underline}

/* Login demo hint */
.demo-hint{
  background:rgba(255,176,32,.14);
  border:1px dashed rgba(23,32,51,.35);
  border-radius:12px;padding:10px 14px;font-size:12.5px;line-height:1.5;
}
.demo-hint b{font-weight:800}

/* ===== About page redesign ===== */
.about-statement{padding-top:6px;padding-bottom:44px;max-width:900px}
.about-kicker{font-size:12px;font-weight:700;letter-spacing:.08em;color:rgba(23,32,51,.55);margin:0 0 10px}
.about-statement h2{margin:0 0 16px;font-size:clamp(40px,7.5vw,92px);line-height:.98;letter-spacing:-.025em}
.about-accent{color:var(--orange,#FF4D00)}
.about-statement .lede{max-width:640px;margin:0 0 26px}
.about-metrics{margin-top:6px}
.about-panels{margin-bottom:8px}
.about-support{padding-top:30px}

/* v2026070402: two-plan pricing + install CTA polish */
.pricing-grid-two{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  max-width:960px;
  margin-inline:auto;
}
.install-app-btn{
  width:auto;
  max-width:180px;
  min-width:124px;
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:10px 14px;
  margin-left:auto;
  margin-right:auto;
  margin-top:10px;
  background:rgba(255,255,255,.62);
  color:var(--black);
}
.install-app-btn.ready{
  background:rgba(255,122,61,.18);
}
.install-app-btn.installed{
  background:#e8f8ee;
}
.install-app-msg{
  min-height:18px;
}

/* v2026070405: keep header logo fully visible inside glass capsule */
.site-header .brand{align-items:center!important;overflow:visible!important;min-height:54px!important}
.site-header .brand img.logo-mark,.site-header .brand .logo-mark{width:44px!important;height:44px!important;max-width:44px!important;max-height:44px!important;object-fit:contain!important;object-position:center!important;display:block!important;flex:0 0 44px!important}
@media(max-width:520px){
  .site-header .brand{min-height:48px!important;padding:5px 12px 5px 8px!important}
  .site-header .brand img.logo-mark,.site-header .brand .logo-mark{width:38px!important;height:38px!important;max-width:38px!important;max-height:38px!important;flex-basis:38px!important}
}
.price-card,
.price-card li,
.auth-card,
.auth-card p,
.field input,
.field select{
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
}
@media(max-width:900px){
  .pricing-grid-two{
    grid-template-columns:1fr!important;
  }
  .price-card ul{
    margin:18px 0!important;
  }
}
.billing-cycle-wrap{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 0 32px;flex-wrap:wrap;text-align:center}
.billing-cycle-toggle{display:inline-flex;gap:2px;background:rgba(0,0,0,.06);border-radius:999px;padding:4px}
.billing-cycle-toggle .cycle-btn{border:0;background:none;width:104px;padding:10px 0;border-radius:999px;font-weight:800;font-size:14px;cursor:pointer;color:rgba(0,0,0,.55);font-family:'Space Mono',monospace;transition:background .15s,color .15s}
.billing-cycle-toggle .cycle-btn.active{background:var(--black);color:var(--white)}
.price-original{display:block;font-family:'Space Mono',monospace!important;letter-spacing:normal!important;font-size:16px!important;font-weight:700;color:rgba(0,0,0,.4)!important;text-decoration:line-through;text-decoration-thickness:1.5px;margin-top:6px}
.price-original[hidden]{display:none!important}
/* The headline monthly figure is the FIRST-month price, so this line states the ongoing
   renewal cost immediately under it. It must stay readable on the highlighted (dark)
   card too, hence the inherited colour with reduced opacity rather than a fixed grey. */
.price-note{font-family:'Space Mono',monospace;font-size:12.5px;line-height:1.4;margin:8px 0 0;opacity:.72;text-transform:none;letter-spacing:normal}

/* Footer links should read as separate actions, not one long sentence. */
.footer-links{
  align-items:center;
  row-gap:10px!important;
}
.footer-links a{
  display:inline-flex;
  align-items:center;
  gap:14px;
  white-space:nowrap;
}
.footer-links a:not(:last-child)::after{
  content:"";
  width:5px;
  height:5px;
  border-radius:50%;
  background:currentColor;
  opacity:.42;
  flex:0 0 auto;
}
@media(max-width:520px){
  .footer-links{
    gap:12px 14px!important;
  }
  .footer-links a{
    gap:10px;
  }
}

/* Page headers sit under a fixed glass nav; keep every landing page title clear of it. */
.page-hero{
  padding-top:clamp(176px,15vw,214px)!important;
}
@media(max-width:900px){
  .page-hero{
    padding-top:112px!important;
  }
}
@media(max-width:520px){
  .page-hero{
    padding-top:104px!important;
  }
}

/* ===== SEO content sections (index.php: how-it-works, statement, FAQ) =====
   These carry the page's only long-form prose, so they exist for readers AND
   for crawlers/AI answer engines. Visually they deliberately reuse the cream
   card + navy border + orange badge language already established by
   .feature-panels on features.php rather than inventing a second card style —
   the earlier version was unstyled text and read as a foreign block. */

/* Shared section header: display title on the left, mono kicker on the right,
   matching the hero-copy/service-list rhythm used elsewhere on the page. */
.seo-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:24px;
  flex-wrap:wrap;
  padding-bottom:22px;
  margin-bottom:clamp(24px,3vw,38px);
  border-bottom:1px solid rgba(23,32,51,.18);
}
.seo-head h2{
  margin:0;
  font-size:clamp(46px,8vw,116px);
}
.seo-kicker{
  margin:0;
  font-size:11px;
  color:rgba(23,32,51,.62);
  padding-bottom:8px;
}

.seo-steps{padding:clamp(56px,8vw,92px) 0 clamp(24px,3vw,40px)}
/* Four steps read as a sequence, so they get their own track count instead of
   the 3-up default that would orphan step 4 onto its own row. */
.seo-steps-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.seo-step-body{
  margin:0;
  font-size:14.5px;
  line-height:1.55;
  color:rgba(23,32,51,.78);
  font-weight:500;
}
.seo-steps-grid .feature-card h3{
  font-size:clamp(19px,2vw,23px);
  line-height:1.05;
  /* Archivo Black has no small words: without min-width:0 the flex item refuses
     to shrink below its longest word and the title spills past the card border. */
  min-width:0;
  overflow-wrap:anywhere;
}
/* Badge stays level with the FIRST line of a wrapping title rather than
   floating to the vertical centre of a three-line block. */
.seo-steps-grid .feature-card-head{align-items:flex-start}
.seo-steps-grid .num-badge{margin-top:2px}

.seo-statement{padding:clamp(40px,5vw,64px) 0}
.seo-statement-panel{padding:clamp(26px,4vw,46px)}
.seo-statement-panel > .mono{
  margin:0 0 14px;
  font-size:11px;
  color:rgba(23,32,51,.62);
}
.seo-statement-panel h2{
  margin:0 0 18px;
  font-size:clamp(38px,6vw,84px);
}
.seo-statement-body{
  margin:0;
  max-width:70ch;
  font-size:clamp(15px,1.5vw,17px);
  line-height:1.6;
  color:rgba(23,32,51,.80);
  font-weight:500;
}
.seo-statement-metrics{margin-top:clamp(24px,3vw,34px)}

.seo-faq{padding:clamp(40px,5vw,64px) 0 clamp(56px,8vw,92px)}
.seo-faq-list{display:grid;gap:12px}
.seo-faq-item{
  background:#f6ecd9;
  border:2px solid #172033;
  border-radius:20px;
  padding:0 clamp(16px,2vw,24px);
  transition:box-shadow .2s ease,transform .2s ease;
}
.seo-faq-item[open]{
  box-shadow:0 14px 32px rgba(23,32,51,.12);
}
.seo-faq-item summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding:clamp(16px,2vw,20px) 0;
  cursor:pointer;
  font-weight:800;
  font-size:clamp(15px,1.6vw,17.5px);
  line-height:1.35;
  color:#172033;
  /* Suppress both the WebKit marker and the standards-track one; otherwise a
     stray triangle sits next to the custom +/− control. */
  list-style:none;
}
.seo-faq-item summary::-webkit-details-marker{display:none}
.seo-faq-item summary::marker{content:""}
.seo-faq-item summary:focus-visible{
  outline:2px solid #f0813d;
  outline-offset:4px;
  border-radius:8px;
}
/* The +/− control is drawn from two pseudo-element bars so it stays crisp at
   any zoom and needs no icon font. */
.seo-faq-item summary i{
  position:relative;
  flex:0 0 auto;
  width:32px;
  height:32px;
  border-radius:999px;
  background:#f0813d;
  border:2px solid #172033;
}
.seo-faq-item summary i::before,
.seo-faq-item summary i::after{
  content:"";
  position:absolute;
  inset:50% 7px auto 7px;
  height:2px;
  background:#172033;
  transform:translateY(-50%);
  transition:transform .2s ease,opacity .2s ease;
}
.seo-faq-item summary i::after{transform:translateY(-50%) rotate(90deg)}
.seo-faq-item[open] summary i::after{transform:translateY(-50%) rotate(0);opacity:0}
.seo-faq-item p{
  margin:0;
  padding:0 0 clamp(18px,2vw,22px);
  max-width:78ch;
  font-size:15px;
  line-height:1.62;
  font-weight:500;
  color:rgba(23,32,51,.78);
  border-top:1.5px solid rgba(23,32,51,.22);
  padding-top:16px;
}

@media(max-width:1100px){
  .seo-steps-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
  .seo-head{align-items:flex-start;flex-direction:column;gap:10px}
  .seo-kicker{padding-bottom:0}
}
@media(max-width:620px){
  .seo-steps-grid{grid-template-columns:1fr}
  .seo-faq-item{border-radius:18px}
  .seo-faq-item summary i{width:28px;height:28px}
}

@media(prefers-reduced-motion:reduce){
  .seo-faq-item,
  .seo-faq-item summary i::before,
  .seo-faq-item summary i::after{transition:none}
}