:root{
  --navy:#061a35;--navy2:#0a2448;--blue:#0e4a7d;--teal:#11c7c8;--teal2:#38e0d1;
  --gold:#d8a84d;--ink:#09203c;--muted:#6d7b8c;--line:#dfe8ef;--bg:#f6f9fb;--white:#fff;
  --shadow:0 24px 70px rgba(4,28,55,.14);--r:24px
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"Cairo",sans-serif;color:var(--ink);background:#fff;line-height:1.7;overflow-x:hidden}body.en{font-family:"Inter",sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}.container{width:min(1180px,calc(100% - 36px));margin:auto}.site-header{position:fixed;inset:0 0 auto;z-index:50;background:rgba(5,23,47,.82);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.08)}.nav-wrap{height:76px;display:flex;align-items:center;gap:24px}.brand{display:flex;align-items:center;gap:10px;color:white;font-weight:800;letter-spacing:1.6px}.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:2px solid var(--teal);color:var(--teal2);font-weight:800;box-shadow:inset 0 0 0 4px rgba(17,199,200,.12)}.brand-name{font-size:22px}.nav-links{display:flex;gap:24px;margin-inline:auto}.nav-links a{color:#d9e7f4;font-size:14px;font-weight:600;position:relative}.nav-links a:after{content:"";position:absolute;inset:auto 0 -9px;width:0;height:2px;background:var(--teal);transition:.25s}.nav-links a:hover:after{width:100%}.nav-actions{display:flex;align-items:center;gap:12px}.lang-switch{display:flex;border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:3px}.lang-switch button{border:0;background:transparent;color:#c8d5e3;padding:6px 8px;border-radius:8px;font-size:12px;cursor:pointer}.lang-switch button.active{background:var(--teal);color:#03263e;font-weight:800}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:14px;font-weight:800;transition:.25s;cursor:pointer}.btn:hover{transform:translateY(-2px)}.btn-primary{background:linear-gradient(135deg,var(--teal),var(--teal2));color:#03304b;box-shadow:0 10px 30px rgba(17,199,200,.28)}.btn-outline{border:1px solid rgba(216,168,77,.7);color:#fff;background:rgba(255,255,255,.03)}.nav-cta{min-height:42px;padding-inline:18px;font-size:13px}.menu-toggle{display:none;margin-inline-start:auto;width:44px;height:40px;background:transparent;border:0;cursor:pointer}.menu-toggle span{display:block;height:2px;background:white;margin:6px 0;border-radius:2px}
.hero{position:relative;padding:150px 0 54px;background:radial-gradient(circle at 20% 20%,rgba(10,102,137,.32),transparent 34%),linear-gradient(145deg,#041327,#062347 65%,#05162c);color:white;overflow:hidden}.hero:after{content:"";position:absolute;inset:auto -10% -220px;height:380px;background:linear-gradient(180deg,transparent,rgba(17,199,200,.08));transform:rotate(-4deg)}.hero-grid{position:relative;z-index:3;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:50px}.eyebrow{display:inline-flex;color:#0aaeb2;background:#e8fbfb;border:1px solid #b9eeee;border-radius:999px;padding:5px 12px;font-weight:800;font-size:13px}.hero .eyebrow{color:var(--teal2);background:rgba(17,199,200,.10);border-color:rgba(17,199,200,.26)}.hero-copy h1{font-size:clamp(42px,5vw,72px);line-height:1.25;margin:20px 0 18px;letter-spacing:-1px}.hero-copy h1 span{color:var(--teal2)}.hero-copy p{font-size:18px;color:#c9d8e8;max-width:620px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.store-note{display:flex;align-items:center;gap:10px;margin-top:22px;color:#aebed0;font-size:12px}.store-pill{border:1px solid rgba(255,255,255,.14);border-radius:9px;padding:5px 10px;color:#eef7ff}.hero-visual{position:relative;min-height:570px;display:grid;place-items:center}.phone{position:relative;width:310px;height:590px;padding:10px;background:linear-gradient(145deg,#1b2733,#05090f 65%,#263645);border-radius:48px;box-shadow:0 45px 90px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.16);transform:rotate(2deg);z-index:4}.phone:before{content:"";position:absolute;inset:4px;border-radius:44px;border:1px solid rgba(216,168,77,.4);pointer-events:none}.phone-notch{position:absolute;top:16px;left:50%;transform:translateX(-50%);width:105px;height:25px;background:#02070c;border-radius:999px;z-index:8}.phone-screen{height:100%;background:linear-gradient(#f6fbff,#eef5f9);border-radius:38px;padding:45px 14px 14px;color:#0b2545;overflow:hidden}.app-topbar{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.app-topbar small{display:block;font-weight:700}.app-topbar strong{font-size:11px;color:#4c6073}.bell{width:30px;height:30px;border-radius:10px;background:#e5f5f7;display:grid;place-items:center}.balance-card{padding:18px;border-radius:20px;background:linear-gradient(140deg,#0a315d,#0d5186);color:white;box-shadow:0 14px 25px rgba(4,37,75,.22)}.balance-label{font-size:11px;opacity:.8}.balance-value{font-size:28px;font-weight:800;margin-top:5px}.balance-value small{font-size:10px}.balance-meta{font-size:10px;opacity:.8;margin-top:4px}.quick-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0}.quick-actions button{border:0;border-radius:13px;background:white;box-shadow:0 6px 16px rgba(6,34,67,.08);padding:9px 4px;color:#173858}.quick-actions span{display:block;font-size:17px;color:#0ebfc2}.quick-actions b{font-size:10px}.mini-banner{display:flex;align-items:center;gap:9px;background:#fff;padding:10px;border-radius:14px}.mini-icon{width:32px;height:32px;border-radius:10px;background:#e2fbf8;display:grid;place-items:center;color:#0aaeb2}.mini-banner strong,.mini-banner small{display:block}.mini-banner strong{font-size:11px}.mini-banner small{font-size:8px;color:#708195}.loan-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0}.loan-card{padding:10px;border-radius:14px}.loan-card small,.loan-card span{display:block;font-size:8px}.loan-card strong{font-size:20px}.owed{background:#fff1f1;color:#9f3737}.due{background:#eafbf4;color:#17785a}.section-row{display:flex;justify-content:space-between;align-items:center;font-size:10px;margin:6px 0}.section-row a{color:#0baeb2}.tx{display:grid;grid-template-columns:28px 1fr auto;gap:7px;align-items:center;padding:7px 0;border-top:1px solid #dde7ee}.avatar{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#dceef4;font-size:10px;font-weight:800}.tx b,.tx small{display:block}.tx b{font-size:9px}.tx small{font-size:7px;color:#7c8895}.tx>strong{font-size:10px}.plus{color:#15956f}.minus{color:#c75252}.app-nav{display:flex;justify-content:space-around;align-items:center;margin-top:6px;color:#768597;font-size:13px}.app-plus{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--teal);color:#06334d;font-weight:800}.orbit{position:absolute;border-radius:50%;border:1px solid rgba(24,220,209,.35);z-index:1}.orbit-a{width:440px;height:440px}.orbit-b{width:530px;height:530px;border-color:rgba(216,168,77,.25)}.trust-float{position:absolute;z-index:6;padding:10px 14px;border-radius:12px;background:rgba(6,32,60,.84);border:1px solid rgba(255,255,255,.12);backdrop-filter:blur(12px);font-size:12px;box-shadow:0 14px 30px rgba(0,0,0,.2)}.tf-one{right:0;top:95px}.tf-two{left:15px;bottom:90px}.hero-glow{position:absolute;border-radius:50%;filter:blur(6px);opacity:.55}.glow-1{width:360px;height:360px;background:radial-gradient(circle,rgba(17,199,200,.28),transparent 70%);right:8%;top:22%}.glow-2{width:300px;height:300px;background:radial-gradient(circle,rgba(216,168,77,.15),transparent 70%);left:8%;bottom:10%}.trust-strip{position:relative;z-index:5;margin-top:46px;background:white;border-radius:22px;color:var(--ink);display:grid;grid-template-columns:repeat(4,1fr);box-shadow:var(--shadow);overflow:hidden}.trust-strip>div{display:grid;grid-template-columns:42px 1fr;grid-template-rows:auto auto;column-gap:12px;padding:20px 18px;border-inline-end:1px solid #e5edf2}.trust-strip>div:last-child{border:0}.trust-strip span{grid-row:1/3;width:42px;height:42px;border-radius:13px;background:#e9fbfa;display:grid;place-items:center}.trust-strip b{font-size:13px}.trust-strip small{color:var(--muted);font-size:10px}
.section{padding:90px 0}.muted{background:var(--bg)}.section-heading{text-align:center;max-width:760px;margin:0 auto 42px}.section-heading h2{font-size:clamp(30px,4vw,46px);margin:10px 0 8px}.section-heading p{color:var(--muted);margin:0}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-card{padding:28px;border-radius:22px;background:#fff;border:1px solid #e4ebf0;box-shadow:0 12px 35px rgba(8,39,70,.06);transition:.25s}.feature-card:hover{transform:translateY(-5px);box-shadow:0 20px 42px rgba(8,39,70,.10)}.feature-card .icon{width:54px;height:54px;border-radius:16px;display:grid;place-items:center;font-size:23px;margin-bottom:18px}.feature-card h3{margin:0 0 8px;font-size:18px}.feature-card p{margin:0;color:var(--muted);font-size:14px}.mint{background:#e5faf5}.sky{background:#eaf4ff}.violet{background:#f0ebff}.gold{background:#fff4df}.teal{background:#e5fbfb}.blue{background:#e8f0ff}.steps{display:grid;grid-template-columns:1fr 90px 1fr 90px 1fr;align-items:center}.step{text-align:center;position:relative}.step-num{position:absolute;top:-8px;right:calc(50% - 52px);width:28px;height:28px;border-radius:50%;background:var(--teal);color:#03334c;display:grid;place-items:center;font-weight:800}.step-icon{width:92px;height:92px;border-radius:28px;background:white;box-shadow:0 12px 30px rgba(5,45,80,.08);display:grid;place-items:center;margin:0 auto 18px;font-size:32px;color:#0aaeb2}.step h3{margin:0 0 6px}.step p{color:var(--muted);font-size:14px;max-width:240px;margin:auto}.step-line{height:2px;background:repeating-linear-gradient(90deg,var(--teal) 0 8px,transparent 8px 16px)}
.security{padding:92px 0;background:linear-gradient(135deg,#031429,#082c55);color:white;position:relative;overflow:hidden}.security:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(17,199,200,.22),transparent 70%);right:-80px;top:-100px}.security-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:58px;align-items:center;position:relative;z-index:2}.eyebrow.light{color:var(--teal2);background:rgba(17,199,200,.12);border-color:rgba(17,199,200,.28)}.security-copy h2{font-size:44px;line-height:1.3;margin:15px 0}.security-copy p{color:#c9d8e8}.security-badge{display:inline-flex;align-items:center;gap:10px;margin-top:16px;border:1px solid rgba(255,255,255,.13);padding:10px 14px;border-radius:14px;background:rgba(255,255,255,.05)}.security-list{display:grid;gap:10px}.security-list>div{display:grid;grid-template-columns:44px 1fr;grid-template-rows:auto auto;column-gap:12px;padding:16px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}.security-list span{grid-row:1/3;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:rgba(17,199,200,.12);color:var(--teal2);font-weight:800}.security-list small{color:#aebfd0}.compare-grid{display:grid;grid-template-columns:1fr 70px 1fr;align-items:stretch;gap:16px}.compare-card{padding:30px;border-radius:24px;border:1px solid #e0e8ee}.compare-card.transfer{background:linear-gradient(180deg,#f2fffb,#fff)}.compare-card.loan{background:linear-gradient(180deg,#fffaf0,#fff);border-color:#f0d8a3}.compare-head{display:flex;align-items:center;gap:12px}.compare-head span{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:white;box-shadow:0 10px 25px rgba(8,39,70,.07);font-size:22px}.compare-card ul{list-style:none;padding:0;margin:24px 0 0}.compare-card li{padding:9px 0;border-top:1px solid #e4ecef}.compare-card li:before{content:"✓";color:#0aaa84;margin-inline-end:8px;font-weight:800}.compare-card.loan li:before{color:#d49a31}.vs{display:grid;place-items:center;align-self:center;width:52px;height:52px;border-radius:50%;background:var(--navy);color:white;font-weight:800;margin:auto}.faq-wrap{max-width:920px}.faq-list{display:grid;gap:12px}.faq-item{background:white;border:1px solid #e4ebf0;border-radius:16px;padding:0 18px}.faq-item summary{cursor:pointer;font-weight:800;padding:18px 0}.faq-item p{color:var(--muted);margin:-4px 0 20px}.cta-section{padding:80px 0}.cta-card{border-radius:32px;background:linear-gradient(135deg,#041a34,#07345d 60%,#07536b);padding:46px;color:white;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;overflow:hidden;position:relative}.cta-card:after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;border:1px solid rgba(17,199,200,.28);left:8%;top:-90px}.cta-copy{position:relative;z-index:2}.cta-copy h2{font-size:40px;line-height:1.35;margin:14px 0}.cta-copy p{color:#c8d8e7}.light-outline{border-color:rgba(255,255,255,.25)}.cta-art{display:grid;place-items:center;position:relative;z-index:2}.mini-phone{width:220px;height:380px;border-radius:38px;background:linear-gradient(160deg,#0a325e,#061224);border:8px solid #101a25;box-shadow:0 30px 60px rgba(0,0,0,.32);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.mini-phone .brand-mark{width:68px;height:68px;font-size:32px}.mini-phone strong{font-size:26px;letter-spacing:2px}.mini-phone small{color:#a8c5d7}footer{background:#031126;color:#d6e4f2;padding:60px 0}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr;gap:32px}.footer-brand p{color:#9ab1c5}.footer-brand small{color:#718ba1}.footer-links,.footer-social{display:flex;flex-direction:column;gap:9px}.footer-links h4,.footer-social h4{color:white;margin:0 0 8px}.footer-links a,.footer-social a{color:#aebfd0;font-size:14px}.footer-social a{padding:10px 12px;border:1px solid rgba(255,255,255,.08);border-radius:12px}.footer-social span{display:block;font-size:11px;color:#6f899f}.reveal{opacity:0;transform:translateY(18px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}.delay-1{transition-delay:.12s}.delay-2{transition-delay:.22s}
@media(max-width:980px){.nav-links{position:absolute;top:76px;inset-inline:18px;background:#061a35;border:1px solid rgba(255,255,255,.08);border-radius:18px;padding:18px;display:none;flex-direction:column;gap:14px;box-shadow:0 20px 50px rgba(0,0,0,.28)}.nav-links.open{display:flex}.menu-toggle{display:block}.nav-cta{display:none}.hero-grid,.security-grid,.cta-card{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-copy p{margin-inline:auto}.hero-actions,.store-note{justify-content:center}.hero-visual{margin-top:10px}.trust-strip{grid-template-columns:1fr 1fr}.feature-grid{grid-template-columns:1fr 1fr}.security-copy{text-align:center}.footer-grid{grid-template-columns:1fr 1fr}.cta-copy{text-align:center}.cta-copy .hero-actions{justify-content:center}.cta-art{margin-top:24px}}
@media(max-width:680px){.container{width:min(100% - 24px,1180px)}.nav-wrap{height:68px}.site-header .brand-name{font-size:18px}.brand-mark{width:34px;height:34px}.hero{padding-top:118px}.hero-copy h1{font-size:38px}.hero-copy p{font-size:15px}.hero-actions .btn{width:100%}.store-note{flex-wrap:wrap}.hero-visual{min-height:510px}.phone{width:270px;height:520px;border-radius:42px}.phone-screen{border-radius:32px;padding-inline:12px}.balance-value{font-size:24px}.orbit-a{width:350px;height:350px}.orbit-b{width:420px;height:420px}.tf-one{right:-6px;top:85px}.tf-two{left:-3px;bottom:62px}.trust-strip{grid-template-columns:1fr;margin-top:28px}.trust-strip>div{border-inline-end:0;border-bottom:1px solid #e5edf2}.section{padding:68px 0}.feature-grid{grid-template-columns:1fr}.steps{grid-template-columns:1fr;gap:20px}.step-line{width:2px;height:42px;margin:auto;background:repeating-linear-gradient(180deg,var(--teal) 0 8px,transparent 8px 16px)}.security-copy h2{font-size:34px}.compare-grid{grid-template-columns:1fr}.vs{margin:0 auto}.cta-card{padding:28px}.cta-copy h2{font-size:30px}.footer-grid{grid-template-columns:1fr}.nav-actions{margin-inline-start:auto}.menu-toggle{margin-inline-start:0}.lang-switch{display:none}}

/* =========================================================
   SULFA — Premium Hero / Header refinement v2
   2026-08-14
   ========================================================= */

/* Slightly wider desktop canvas gives the hero more breathing room. */
@media (min-width: 1100px){
  .container{width:min(1240px,calc(100% - 64px))}
}

/* Header: slimmer, calmer, more product-like. */
.site-header{
  background:rgba(3,20,42,.90);
  border-bottom-color:rgba(130,220,225,.09);
  box-shadow:0 8px 30px rgba(0,0,0,.08);
}
.nav-wrap{height:72px;gap:22px}
.brand{gap:11px}
.brand-mark{
  width:36px;height:36px;
  border-color:#27d6d3;
  color:#43e5dc;
  background:radial-gradient(circle at 40% 35%,rgba(57,226,220,.14),transparent 64%);
  box-shadow:0 0 0 4px rgba(17,199,200,.055),inset 0 0 0 1px rgba(255,255,255,.05);
}
.brand-name{font-size:21px;letter-spacing:1.9px}
.nav-links{gap:27px}
.nav-links a{font-size:13.5px;color:#d5e2ee}
.nav-links a:hover{color:white}
.nav-actions{gap:10px}
.nav-cta{border-radius:12px;min-height:40px;padding-inline:17px}

/* Hero: reduce scale and improve hierarchy. */
.hero{
  padding:128px 0 42px;
  min-height:720px;
  background:
    radial-gradient(circle at 78% 23%,rgba(13,139,157,.17),transparent 30%),
    radial-gradient(circle at 17% 42%,rgba(14,97,135,.25),transparent 32%),
    linear-gradient(142deg,#031326 0%,#06264b 60%,#04172f 100%);
}
.hero:before{
  content:"";
  position:absolute;
  inset:72px 0 auto;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(70,221,217,.14),transparent);
}
.hero:after{
  height:300px;
  bottom:-190px;
  opacity:.7;
}
.hero-grid{
  grid-template-columns:1.02fr .98fr;
  gap:72px;
  min-height:530px;
}
.hero-copy{max-width:650px}
.hero-copy .eyebrow{
  padding:6px 13px;
  font-size:12px;
  letter-spacing:0;
  background:rgba(17,199,200,.075);
  border-color:rgba(61,222,219,.22);
}
.hero-copy h1{
  font-size:clamp(42px,4.15vw,60px);
  line-height:1.38;
  margin:20px 0 14px;
  max-width:650px;
  letter-spacing:-.7px;
  text-wrap:balance;
}
.hero-copy h1 span{
  color:#31dfd6;
  text-shadow:0 0 28px rgba(49,223,214,.12);
}
.hero-copy p{
  font-size:16px;
  line-height:1.95;
  max-width:590px;
  color:#c8d8e7;
  margin:0;
}
.hero-actions{margin-top:22px;gap:11px}
.hero-actions .btn{min-height:46px;border-radius:13px;padding-inline:21px;font-size:14px}
.store-note{margin-top:17px;gap:8px;color:#93a9bd}
.store-pill{padding:4px 9px;background:rgba(255,255,255,.025)}

/* Phone: smaller, cleaner, fully framed within the first fold. */
.hero-visual{
  min-height:525px;
  align-self:center;
  transform:translateY(2px);
}
.phone{
  width:282px;
  height:542px;
  padding:9px;
  border-radius:44px;
  transform:rotate(-1deg);
  box-shadow:0 34px 72px rgba(0,0,0,.48),0 0 0 1px rgba(255,255,255,.14),0 0 55px rgba(12,195,196,.055);
}
.phone:before{inset:4px;border-radius:40px;border-color:rgba(216,168,77,.31)}
.phone-notch{top:14px;width:96px;height:23px}
.phone-screen{border-radius:35px;padding:42px 13px 12px}
.app-topbar{margin-bottom:10px}
.balance-card{padding:15px 16px;border-radius:18px}
.balance-value{font-size:25px}
.quick-actions{gap:7px;margin:8px 0}
.quick-actions button{padding:7px 4px;border-radius:12px}
.mini-banner{padding:8px 9px;border-radius:12px}
.loan-grid{gap:7px;margin:8px 0}
.loan-card{padding:8px 9px;border-radius:12px}
.loan-card strong{font-size:18px}
.tx{padding:5px 0}
.app-nav{margin-top:3px}
.orbit-a{width:390px;height:390px;border-color:rgba(24,220,209,.28)}
.orbit-b{width:470px;height:470px;border-color:rgba(216,168,77,.19)}
.tf-one{right:4px;top:112px}
.tf-two{left:10px;bottom:80px}
.trust-float{
  padding:8px 12px;
  border-radius:11px;
  font-size:11px;
  background:rgba(5,27,53,.78);
  box-shadow:0 12px 28px rgba(0,0,0,.18);
}
.glow-1{width:300px;height:300px;right:10%;top:22%;opacity:.42}
.glow-2{width:260px;height:260px;left:6%;bottom:11%;opacity:.38}

/* Trust bar is compact enough to sit naturally below the hero. */
.trust-strip{
  margin-top:28px;
  border-radius:19px;
  box-shadow:0 18px 50px rgba(4,29,55,.17);
  border:1px solid rgba(255,255,255,.68);
}
.trust-strip>div{padding:17px 16px;grid-template-columns:39px 1fr;column-gap:10px}
.trust-strip span{width:39px;height:39px;border-radius:12px}

/* Sections: slightly more premium desktop rhythm. */
.section{padding:84px 0}
.section-heading{margin-bottom:36px}
.feature-card{border-radius:20px;padding:25px}
.feature-card .icon{width:51px;height:51px;border-radius:15px}

/* Tablet */
@media(max-width:980px){
  .hero{padding-top:116px;min-height:auto}
  .hero-grid{gap:28px;min-height:0}
  .hero-copy{max-width:760px;margin-inline:auto}
  .hero-copy h1{max-width:760px;margin-inline:auto}
  .hero-visual{min-height:545px;margin-top:14px}
  .phone{width:285px;height:548px}
  .trust-strip{margin-top:18px}
}

/* Mobile: deliberately compact first screen; no oversized mockup. */
@media(max-width:680px){
  .nav-wrap{height:66px}
  .hero{padding:101px 0 30px}
  .hero-copy .eyebrow{font-size:11px;padding:5px 10px}
  .hero-copy h1{font-size:clamp(34px,10.3vw,42px);line-height:1.42;margin:16px auto 12px;letter-spacing:-.35px}
  .hero-copy p{font-size:14px;line-height:1.9;max-width:94%}
  .hero-actions{margin-top:18px}
  .hero-actions .btn{min-height:45px}
  .store-note{margin-top:14px}
  .hero-visual{min-height:470px;margin-top:2px}
  .phone{width:246px;height:470px;border-radius:39px;padding:8px}
  .phone:before{border-radius:36px}
  .phone-screen{border-radius:31px;padding:38px 10px 10px}
  .phone-notch{width:86px;height:21px;top:13px}
  .balance-card{padding:12px 13px}
  .balance-value{font-size:21px}
  .quick-actions b{font-size:9px}
  .quick-actions span{font-size:15px}
  .mini-banner{padding:7px 8px}
  .loan-card strong{font-size:16px}
  .tx:nth-of-type(4){display:none}
  .orbit-a{width:305px;height:305px}
  .orbit-b{width:365px;height:365px}
  .tf-one{right:-5px;top:100px}
  .tf-two{left:-4px;bottom:50px}
  .trust-float{font-size:10px;padding:7px 9px}
  .trust-strip{margin-top:10px}
  .section{padding:62px 0}
}

/* Very small phones */
@media(max-width:390px){
  .hero-copy h1{font-size:33px}
  .hero-visual{min-height:445px}
  .phone{width:232px;height:448px}
  .orbit-a{width:285px;height:285px}
  .orbit-b{width:340px;height:340px}
  .trust-float{display:none}
}


/* =========================================================
   SULFA — Hero final polish v3
   2026-08-14
   Goal: tighter first fold, calmer scale, fewer floating bits.
   ========================================================= */

@media (min-width: 981px){
  .hero{
    padding:108px 0 34px;
    min-height:640px;
  }

  .hero-grid{
    grid-template-columns:1fr .86fr;
    gap:42px;
    min-height:455px;
    align-items:center;
  }

  .hero-copy{
    max-width:610px;
    justify-self:start;
  }

  .hero-copy h1{
    font-size:clamp(39px,3.75vw,54px);
    line-height:1.34;
    max-width:600px;
    margin:17px 0 11px;
    letter-spacing:-.55px;
  }

  .hero-copy p{
    max-width:520px;
    font-size:15px;
    line-height:1.9;
  }

  .hero-actions{
    margin-top:18px;
  }

  .store-note{
    margin-top:13px;
  }

  .hero-visual{
    min-height:455px;
    width:100%;
    transform:none;
    justify-self:end;
  }

  .phone{
    width:236px;
    height:454px;
    padding:8px;
    border-radius:38px;
    transform:rotate(-.65deg) translateY(-2px);
    box-shadow:0 28px 62px rgba(0,0,0,.44),0 0 0 1px rgba(255,255,255,.13),0 0 45px rgba(12,195,196,.05);
  }

  .phone:before{
    inset:4px;
    border-radius:34px;
  }

  .phone-notch{
    width:82px;
    height:20px;
    top:12px;
  }

  .phone-screen{
    border-radius:30px;
    padding:34px 10px 9px;
  }

  .app-topbar{
    margin-bottom:7px;
  }

  .app-topbar small{font-size:9px}
  .app-topbar strong{font-size:8px}
  .bell{width:23px;height:23px;font-size:10px}

  .balance-card{
    padding:11px 12px;
    border-radius:15px;
  }

  .balance-label{font-size:8px}
  .balance-value{font-size:20px;margin-top:3px}
  .balance-value small{font-size:8px}
  .balance-meta{font-size:7px;margin-top:6px}

  .quick-actions{
    gap:5px;
    margin:6px 0;
  }
  .quick-actions button{
    padding:5px 3px;
    border-radius:10px;
  }
  .quick-actions span{font-size:13px}
  .quick-actions b{font-size:8px}

  .mini-banner{
    padding:6px 7px;
    border-radius:10px;
    gap:6px;
  }
  .mini-banner strong{font-size:8px}
  .mini-banner small{font-size:6.5px}
  .mini-icon{width:25px;height:25px;font-size:10px}

  .loan-grid{gap:5px;margin:6px 0}
  .loan-card{padding:6px 7px;border-radius:10px}
  .loan-card small{font-size:7px}
  .loan-card strong{font-size:15px;margin:2px 0}
  .loan-card span{font-size:6.5px}

  .section-row{margin:5px 0 2px}
  .section-row strong,.section-row a{font-size:7px}
  .tx{padding:3px 0;gap:5px}
  .tx .avatar{width:20px;height:20px;font-size:7px}
  .tx b{font-size:7px}
  .tx small{font-size:5.8px}
  .tx>strong{font-size:7px}
  .app-nav{font-size:11px;padding-top:4px}
  .app-plus{width:27px;height:27px}

  .orbit-a{
    width:320px;
    height:320px;
  }
  .orbit-b{
    width:390px;
    height:390px;
  }

  .tf-one{
    right:auto;
    left:calc(50% - 185px);
    top:86px;
  }

  .trust-float{
    font-size:10px;
    padding:7px 10px;
    border-radius:10px;
    background:rgba(5,27,53,.86);
    border-color:rgba(85,220,218,.18);
  }

  .tf-two{display:none!important}

  .trust-strip{
    margin-top:20px;
  }
}

/* Keep the refined scale on medium laptops, which is where the earlier
   hero felt oversized due to browser chrome reducing viewport height. */
@media (min-width: 981px) and (max-height: 760px){
  .hero{
    padding-top:98px;
    min-height:600px;
  }
  .hero-grid{min-height:430px}
  .hero-copy h1{font-size:clamp(38px,3.55vw,50px)}
  .phone{width:224px;height:430px}
  .hero-visual{min-height:430px}
  .orbit-a{width:302px;height:302px}
  .orbit-b{width:366px;height:366px}
  .tf-one{left:calc(50% - 174px);top:80px}
}

@media (max-width:980px){
  .tf-two{display:none!important}
  .hero-copy p{max-width:560px}
}

@media (max-width:680px){
  .hero-copy h1{
    font-size:clamp(32px,9.4vw,39px);
    line-height:1.37;
  }
  .hero-copy p{max-width:92%}
  .hero-visual{min-height:438px}
  .phone{width:228px;height:438px}
  .orbit-a{width:286px;height:286px}
  .orbit-b{width:338px;height:338px}
  .tf-one{right:0;left:auto;top:92px}
}

/* SULFA v4 — store and social brand icons */
.store-note{align-items:center}
.store-badge{
  appearance:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:32px;
  font-family:inherit;
  font-weight:700;
  transition:transform .2s ease,border-color .2s ease,background .2s ease,box-shadow .2s ease;
}
.store-badge:hover{transform:translateY(-2px);border-color:rgba(40,220,216,.5);background:rgba(255,255,255,.07);box-shadow:0 10px 24px rgba(0,0,0,.18)}
.store-badge:focus-visible{outline:2px solid var(--teal2);outline-offset:3px}
.store-logo{width:18px;height:18px;display:block;flex:0 0 18px}
.apple-logo{fill:#fff}
.play-logo{width:19px;height:19px}

.footer-social .social-card{
  display:flex;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  min-height:66px;
  background:rgba(255,255,255,.015);
  transition:transform .2s ease,border-color .2s ease,background .2s ease;
}
.footer-social .social-card:hover{transform:translateY(-2px);border-color:rgba(42,219,215,.28);background:rgba(255,255,255,.04)}
.social-logo{width:38px;height:38px;display:grid;place-items:center;flex:0 0 38px}
.social-logo svg{width:38px;height:38px;display:block}
.social-copy{display:flex!important;flex-direction:column;gap:2px;color:#fff!important;font-size:14px!important}
.social-copy strong{color:#f5fbff;font-size:14px;line-height:1.2}
.social-copy small{display:block;color:#76a6c5!important;font-size:11px!important}

.store-modal[hidden]{display:none}
.store-modal{position:fixed;inset:0;z-index:9999;display:grid;place-items:center;padding:20px}
.store-modal-backdrop{position:absolute;inset:0;background:rgba(1,11,24,.74);backdrop-filter:blur(7px)}
.store-modal-card{
  position:relative;z-index:1;width:min(100%,420px);padding:32px 28px 26px;border-radius:24px;
  background:linear-gradient(160deg,#092b50,#05182f);border:1px solid rgba(73,226,219,.22);
  color:#fff;text-align:center;box-shadow:0 30px 90px rgba(0,0,0,.48)
}
.store-modal-card:before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(circle at 50% 0,rgba(30,214,210,.14),transparent 48%)}
.store-modal-close{position:absolute;top:12px;inset-inline-end:14px;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.07);color:#bcd0df;font-size:24px;line-height:1;cursor:pointer}
.store-modal-icon{position:relative;width:68px;height:68px;margin:0 auto 16px;border-radius:20px;display:grid;place-items:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}
.store-modal-icon svg{width:38px;height:38px}.store-modal-icon .apple-logo{width:32px;height:38px}
.store-modal-card h3{position:relative;margin:0 0 10px;font-size:23px}
.store-modal-card p{position:relative;margin:0 auto 22px;color:#b7cad9;font-size:14px;line-height:1.9;max-width:330px}
.store-modal-ok{position:relative;min-width:120px}
body.modal-open{overflow:hidden}

@media(max-width:680px){
  .store-note{gap:7px}
  .store-badge{min-height:34px;padding:6px 9px}
  .store-logo{width:17px;height:17px}
  .store-note>span:first-child{width:100%;text-align:center;margin-bottom:2px}
  .footer-social .social-card{min-height:62px}
}


/* =========================================================
   SULFA v6 — calm interactive motion system
   Mouse-only micro-interactions that keep the site lively
   without sacrificing visual comfort or accessibility.
   ========================================================= */

/* The JS enhancement is intentionally desktop/fine-pointer only. */
body.motion-enhanced .motion-pop{
  --motion-x:0px;
  --motion-y:0px;
  --motion-rx:0deg;
  --motion-ry:0deg;
  --motion-scale:1;
  --motion-shadow:0 12px 35px rgba(8,39,70,.06);
  position:relative;
  will-change:transform;
  transform-style:preserve-3d;
}

body.motion-enhanced .motion-pop:not(.reveal),
body.motion-enhanced .motion-pop.reveal.visible{
  transform:perspective(900px)
    translate3d(var(--motion-x),var(--motion-y),0)
    rotateX(var(--motion-rx))
    rotateY(var(--motion-ry))
    scale(var(--motion-scale));
  transition:
    transform .34s cubic-bezier(.2,.8,.2,1),
    box-shadow .34s ease,
    border-color .34s ease,
    background-color .34s ease,
    filter .34s ease;
}

body.motion-enhanced .motion-pop.is-motion-hovered{
  filter:saturate(1.025);
}

/* Larger content cards: a soft elevated “breathing” response. */
body.motion-enhanced .feature-card.motion-pop.is-motion-hovered,
body.motion-enhanced .compare-card.motion-pop.is-motion-hovered{
  box-shadow:0 22px 48px rgba(7,40,72,.12);
  border-color:rgba(19,181,184,.23);
}

body.motion-enhanced .security-list>div.motion-pop.is-motion-hovered{
  background:rgba(255,255,255,.09);
  border-color:rgba(42,219,215,.22);
  box-shadow:0 18px 38px rgba(0,0,0,.13);
}

body.motion-enhanced .faq-item.motion-pop.is-motion-hovered{
  border-color:rgba(14,183,187,.24);
  box-shadow:0 15px 34px rgba(7,40,72,.08);
}

body.motion-enhanced .trust-strip>div.motion-pop.is-motion-hovered{
  background:linear-gradient(180deg,rgba(236,255,253,.8),rgba(255,255,255,.98));
}

body.motion-enhanced .social-card.motion-pop.is-motion-hovered{
  border-color:rgba(42,219,215,.30);
  background:rgba(255,255,255,.055);
  box-shadow:0 14px 32px rgba(0,0,0,.13);
}

body.motion-enhanced .quick-actions button.motion-pop.is-motion-hovered,
body.motion-enhanced .mini-banner.motion-pop.is-motion-hovered,
body.motion-enhanced .loan-card.motion-pop.is-motion-hovered,
body.motion-enhanced .tx.motion-pop.is-motion-hovered{
  box-shadow:0 10px 24px rgba(6,34,67,.11);
}

/* Buttons feel slightly magnetic but never jump away from the pointer. */
body.motion-enhanced .motion-magnetic{
  --mag-x:0px;
  --mag-y:0px;
  transform:translate3d(var(--mag-x),var(--mag-y),0);
  transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease,filter .25s ease;
  will-change:transform;
}
body.motion-enhanced .motion-magnetic:hover{
  filter:brightness(1.035) saturate(1.03);
}
body.motion-enhanced .btn-primary.motion-magnetic:hover{
  box-shadow:0 14px 34px rgba(17,199,200,.34);
}
body.motion-enhanced .btn-outline.motion-magnetic:hover{
  box-shadow:0 12px 30px rgba(216,168,77,.10);
}

/* Tiny luminous ring that follows the pointer — deliberately low contrast. */
.pointer-aura{
  position:fixed;
  top:0;
  left:0;
  width:210px;
  height:210px;
  margin:-105px 0 0 -105px;
  border-radius:50%;
  pointer-events:none;
  z-index:9997;
  opacity:0;
  background:radial-gradient(circle,rgba(40,221,216,.105) 0,rgba(40,221,216,.055) 34%,rgba(40,221,216,0) 69%);
  filter:blur(2px);
  transform:translate3d(-500px,-500px,0);
  transition:opacity .45s ease;
}
body.motion-enhanced.pointer-active .pointer-aura{opacity:1}
body.modal-open .pointer-aura{opacity:0!important}

/* Hero ambient pieces move on a much smaller range than the cursor. */
body.motion-enhanced .hero{
  --hero-px:0px;
  --hero-py:0px;
}
body.motion-enhanced .hero .glow-1{
  transform:translate3d(calc(var(--hero-px) * .28),calc(var(--hero-py) * .24),0);
  transition:transform .8s cubic-bezier(.2,.8,.2,1);
}
body.motion-enhanced .hero .glow-2{
  transform:translate3d(calc(var(--hero-px) * -.20),calc(var(--hero-py) * -.17),0);
  transition:transform .9s cubic-bezier(.2,.8,.2,1);
}
body.motion-enhanced .hero .orbit-a{
  transform:translate3d(calc(var(--hero-px) * .12),calc(var(--hero-py) * .10),0);
  transition:transform .65s cubic-bezier(.2,.8,.2,1);
}
body.motion-enhanced .hero .orbit-b{
  transform:translate3d(calc(var(--hero-px) * -.09),calc(var(--hero-py) * -.08),0);
  transition:transform .75s cubic-bezier(.2,.8,.2,1);
}
body.motion-enhanced .hero .trust-float{
  translate:calc(var(--hero-px) * .08) calc(var(--hero-py) * .06);
  transition:translate .7s cubic-bezier(.2,.8,.2,1),border-color .25s ease,background .25s ease;
}

/* A short JS-triggered icon bounce. */
.motion-icon-pop{
  transform-origin:center;
}

/* Links and navigation get a soft visual response, not a big movement. */
body.motion-enhanced .nav-links a,
body.motion-enhanced .footer-links a,
body.motion-enhanced .brand{
  transition:color .24s ease,opacity .24s ease,filter .24s ease;
}
body.motion-enhanced .footer-links a:hover,
body.motion-enhanced .brand:hover{
  filter:brightness(1.12);
}

/* Keep the experience calm for touch devices and accessibility settings. */
@media (hover:none),(pointer:coarse){
  .pointer-aura{display:none!important}
}
@media (prefers-reduced-motion:reduce){
  .pointer-aura{display:none!important}
  body.motion-enhanced .motion-pop,
  body.motion-enhanced .motion-magnetic,
  body.motion-enhanced .hero .glow-1,
  body.motion-enhanced .hero .glow-2,
  body.motion-enhanced .hero .orbit-a,
  body.motion-enhanced .hero .orbit-b,
  body.motion-enhanced .hero .trust-float{
    transform:none!important;
    translate:none!important;
    transition:none!important;
    animation:none!important;
  }
}


/* =========================================================
   SULFA v7 — branded browser tab + Egyptian identity badge
   ========================================================= */
.footer-brand .egyptian-badge{
  display:inline-flex;
  align-items:center;
  gap:7px;
  width:max-content;
  margin-top:15px;
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(49,220,215,.20);
  background:rgba(32,204,199,.075);
  color:#dffdfb;
  font-size:12.5px;
  font-weight:700;
  letter-spacing:.1px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.015);
}
.footer-brand .egyptian-badge::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:50%;
  background:#2bded7;
  box-shadow:0 0 14px rgba(43,222,215,.55);
}
.footer-brand>p{margin:14px 0 5px}
@media(max-width:680px){
  .footer-brand .egyptian-badge{margin-inline:auto}
  .footer-brand{text-align:center}
  .footer-brand .brand{justify-content:center}
}

/* =========================================================
   SULFA v8 — trust, waitlist, product previews, legal pages
   ========================================================= */
.hero-origin-badge{display:inline-flex;align-items:center;gap:7px;margin-top:8px;padding:7px 11px;border-radius:999px;background:rgba(255,255,255,.055);border:1px solid rgba(46,218,213,.18);color:#d5edf3;font-size:11.5px;font-weight:700}
.trust-detail-section{background:linear-gradient(180deg,#fff,#f8fbfd)}.trust-detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.trust-detail-card{padding:24px 22px;border:1px solid #e3ebf1;border-radius:22px;background:#fff;box-shadow:0 12px 32px rgba(7,38,69,.055)}.trust-detail-icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:16px;border-radius:15px;background:#e7fbf9;color:#079da3;font-size:21px;font-weight:800}.trust-detail-card h3{font-size:16px;margin:0 0 8px}.trust-detail-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.85}
.app-screens-section{background:#fff;overflow:hidden}.screen-gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;align-items:start}.screen-preview{padding:15px 15px 22px;border-radius:24px;border:1px solid #e4ebf0;background:#f9fbfc;box-shadow:0 14px 36px rgba(7,38,69,.055)}.screen-preview h3{font-size:15px;margin:18px 4px 6px}.screen-preview>p{font-size:12.5px;color:var(--muted);margin:0 4px;line-height:1.75}.screen-shell{position:relative;min-height:300px;border-radius:24px;padding:17px 15px;background:linear-gradient(180deg,#f5fbff,#eaf4f8);box-shadow:inset 0 0 0 1px rgba(5,39,72,.06);overflow:hidden}.screen-shell:before{content:"";position:absolute;inset:-60px auto auto -55px;width:150px;height:150px;border-radius:50%;background:radial-gradient(circle,rgba(17,199,200,.13),transparent 70%)}.screen-top{position:relative;display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:800;color:#0b3156}.screen-top span{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;background:#fff;color:#0aaeb2}.screen-amount{position:relative;margin:38px 0 5px;font-size:30px;font-weight:800;color:#093b69}.screen-amount small{font-size:9px}.screen-person,.screen-note,.screen-balance-label{position:relative;color:#617488;font-size:10px}.screen-person.big{font-size:13px;color:#183d61;margin-top:32px;font-weight:700}.screen-choice{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:30px}.screen-choice b,.screen-choice span{padding:10px 6px;text-align:center;border-radius:11px;font-size:9px}.screen-choice b{background:#0d4f80;color:#fff}.screen-choice span{background:#fff5e5;color:#916514;border:1px solid #f4dfb7}.screen-confirm{position:absolute;inset:auto 15px 15px;padding:10px;text-align:center;border-radius:12px;background:linear-gradient(135deg,var(--teal),var(--teal2));color:#06354d;font-size:10px;font-weight:800}.screen-confirm.soft{background:#fff;border:1px solid #dbe7ee;color:#194e71}.screen-status{position:relative;width:max-content;margin-top:30px;padding:5px 9px;border-radius:99px;background:#e4f9f0;color:#158160;font-size:9px;font-weight:700}.screen-lines{position:relative;margin-top:24px}.screen-lines i{display:block;height:7px;border-radius:99px;background:#d7e5eb;margin:9px 0}.screen-lines i:nth-child(1){width:82%}.screen-lines i:nth-child(2){width:64%}.screen-lines i:nth-child(3){width:74%}.screen-bars{position:absolute;inset:auto 18px 64px;height:80px;display:flex;align-items:end;gap:8px}.screen-bars i{width:20px;border-radius:7px 7px 3px 3px;background:linear-gradient(180deg,#26d5cc,#0b78a2)}.send-screen{background:linear-gradient(180deg,#f6fbff,#edf8fb)}.loan-screen{background:linear-gradient(180deg,#f8fbff,#f0f8f5)}.repay-screen{background:linear-gradient(180deg,#fffaf4,#f8fbfd)}.wallet-screen{background:linear-gradient(180deg,#eef9fb,#edf4ff)}
.security-copy p{max-width:570px}.compare-card{position:relative;overflow:hidden}.compare-card:after{content:"";position:absolute;width:150px;height:150px;border-radius:50%;inset:auto -75px -75px;background:radial-gradient(circle,rgba(18,199,200,.12),transparent 70%)}.compare-card.loan:after{background:radial-gradient(circle,rgba(216,168,77,.15),transparent 70%)}.compare-example{margin:15px 0 12px;padding:9px 11px;border-radius:12px;background:rgba(255,255,255,.75);border:1px dashed #d8e5eb;color:#526d82;font-size:11.5px}
.waitlist-section{padding:90px 0;background:linear-gradient(145deg,#041326,#06294d 62%,#074557);color:#fff;position:relative;overflow:hidden}.waitlist-section:before{content:"";position:absolute;inset:-260px auto auto -180px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,rgba(26,214,208,.16),transparent 70%)}.waitlist-card{position:relative;display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;align-items:center;padding:38px;border:1px solid rgba(255,255,255,.08);border-radius:30px;background:rgba(3,22,43,.58);backdrop-filter:blur(10px);box-shadow:0 32px 80px rgba(0,0,0,.22)}.waitlist-copy h2{font-size:clamp(32px,4vw,48px);line-height:1.25;margin:14px 0 10px}.waitlist-copy p{color:#bcd0df;max-width:470px}.waitlist-points{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}.waitlist-points span{padding:6px 9px;border-radius:99px;background:rgba(24,205,199,.07);border:1px solid rgba(42,219,215,.14);color:#d8f7f5;font-size:10.5px}.waitlist-form{padding:24px;border-radius:22px;background:#fff;color:var(--ink);box-shadow:0 20px 55px rgba(0,0,0,.18)}.form-row{display:grid;grid-template-columns:1fr 1.25fr;gap:12px}.waitlist-form label>span:first-child{display:block;margin-bottom:6px;font-size:11px;font-weight:800;color:#35516a}.waitlist-form input[type="text"]{width:100%;height:47px;padding:0 13px;border:1px solid #dce6ed;border-radius:12px;background:#f9fbfc;color:#0b2744;outline:0;transition:border-color .2s,box-shadow .2s}.waitlist-form input[type="text"]:focus{border-color:#38c9c8;box-shadow:0 0 0 3px rgba(17,199,200,.10)}.platform-picker{border:0;padding:0;margin:18px 0 13px}.platform-picker legend{font-size:11px;font-weight:800;color:#35516a;margin-bottom:8px}.platform-picker label{display:inline-flex;margin-inline-end:7px}.platform-picker input{position:absolute;opacity:0;pointer-events:none}.platform-picker span{display:inline-flex!important;align-items:center;justify-content:center;min-width:78px;padding:8px 11px!important;margin:0!important;border:1px solid #dce6ed;border-radius:11px;background:#f9fbfc;color:#47647b!important;font-size:11px!important;font-weight:700!important;cursor:pointer}.platform-picker input:checked+span{border-color:#1dc8c5;background:#e8fbfa;color:#066d76!important;box-shadow:0 0 0 2px rgba(17,199,200,.08)}.consent-row{display:flex;align-items:flex-start;gap:9px;margin:8px 0 15px;color:#617487;font-size:10.5px;line-height:1.7}.consent-row input{margin-top:4px;accent-color:#0ebbbd}.consent-row a{color:#078f98;text-decoration:underline}.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}.waitlist-submit{width:100%;border:0}.waitlist-submit:disabled{opacity:.68;cursor:wait}.waitlist-submit .submit-arrow{margin-inline-start:auto;font-size:18px}.form-status{min-height:22px;margin-top:10px;font-size:10.5px;line-height:1.6}.form-status.success{color:#12805d}.form-status.error{color:#b64242}.form-status.pending{color:#9b6b13}.form-status.sending{color:#587188}
.legal-page{background:#f6f9fb;color:var(--ink);min-height:100vh}.legal-header{position:sticky;top:0;z-index:20;background:rgba(5,23,47,.96);border-bottom:1px solid rgba(255,255,255,.07);backdrop-filter:blur(14px)}.legal-nav{height:72px;display:flex;align-items:center;justify-content:space-between;gap:16px}.legal-back{color:#d4e2ee;font-size:12px}.legal-hero{padding:70px 0 35px;background:linear-gradient(145deg,#041327,#07325a);color:#fff}.legal-hero h1{font-size:clamp(32px,5vw,54px);margin:8px 0}.legal-hero p{color:#b9cfdf;max-width:760px}.legal-content{padding:52px 0 80px}.legal-card{max-width:900px;margin:auto;padding:34px;border:1px solid #e1e9ef;border-radius:24px;background:#fff;box-shadow:0 14px 40px rgba(5,36,65,.06)}.legal-card h2{margin:28px 0 7px;font-size:20px}.legal-card h2:first-child{margin-top:0}.legal-card p,.legal-card li{color:#5f7182;font-size:13px;line-height:1.95}.legal-card ul{padding-inline-start:22px}.legal-updated{display:inline-block;margin-bottom:20px;padding:6px 10px;border-radius:99px;background:#e9fafa;color:#0a8087;font-size:10px;font-weight:700}.legal-lang-block[hidden]{display:none}.support-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:24px}.support-option{display:flex;gap:12px;align-items:center;padding:18px;border:1px solid #e2eaf0;border-radius:17px;background:#fbfdfe}.support-option .social-logo{width:42px;height:42px}.support-option b,.support-option small{display:block}.support-option small{color:#748596}.legal-note{padding:14px;border-radius:15px;background:#fff8e9;border:1px solid #f3dfb5;color:#765b22!important}
.pointer-aura{width:170px;height:170px;margin:-85px 0 0 -85px;background:radial-gradient(circle,rgba(40,221,216,.075) 0,rgba(40,221,216,.035) 38%,rgba(40,221,216,0) 70%)}body.motion-enhanced.pointer-active .pointer-aura{opacity:.72}body.motion-enhanced .motion-pop.is-motion-hovered{filter:saturate(1.015)}body.motion-enhanced .feature-card.motion-pop.is-motion-hovered,body.motion-enhanced .compare-card.motion-pop.is-motion-hovered,body.motion-enhanced .trust-detail-card.motion-pop.is-motion-hovered,body.motion-enhanced .screen-preview.motion-pop.is-motion-hovered{box-shadow:0 20px 44px rgba(7,40,72,.10);border-color:rgba(19,181,184,.18)}
@media(max-width:980px){.trust-detail-grid{grid-template-columns:1fr 1fr}.screen-gallery{grid-template-columns:1fr 1fr}.waitlist-card{grid-template-columns:1fr;gap:25px}.waitlist-copy{text-align:center}.waitlist-copy p{margin-inline:auto}.waitlist-points{justify-content:center}}
@media(max-width:680px){.hero-origin-badge{font-size:10px;max-width:92%;justify-content:center}.trust-detail-grid{grid-template-columns:1fr}.screen-gallery{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;margin-inline:-18px;padding-inline:18px}.screen-preview{min-width:78vw;scroll-snap-align:center}.waitlist-section{padding:58px 0}.waitlist-card{padding:19px;border-radius:24px}.waitlist-form{padding:17px}.form-row{grid-template-columns:1fr}.waitlist-copy h2{font-size:31px}.platform-picker{display:flex;flex-wrap:wrap;gap:6px}.platform-picker label{margin:0}.support-grid{grid-template-columns:1fr}.legal-card{padding:22px}.legal-hero{padding-top:45px}}
.floating-support{position:fixed;z-index:45;inset:auto 22px 22px auto;display:flex;align-items:center;gap:8px;padding:8px 12px 8px 9px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(5,29,54,.92);color:#eaf8ff;box-shadow:0 12px 34px rgba(0,0,0,.18);backdrop-filter:blur(12px);font-size:11px;font-weight:700;transition:transform .2s,border-color .2s}.floating-support span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--teal);color:#05344b;font-size:15px;font-weight:800}.floating-support:hover{transform:translateY(-2px);border-color:rgba(47,219,214,.35)}html[dir="ltr"] .floating-support{inset:auto auto 22px 22px}@media(max-width:680px){.floating-support{inset:auto 12px 12px auto;padding:6px}.floating-support b{display:none}html[dir="ltr"] .floating-support{inset:auto auto 12px 12px}}

/* SULFA v8.2 — official hands logo integration */
.brand-logo{
  width:44px;
  height:44px;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 6px 16px rgba(3,19,39,.18));
  flex:0 0 44px;
}
.brand{
  gap:12px;
}
.brand-name{
  letter-spacing:1.4px;
}
.mini-logo{
  width:92px;
  height:auto;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 12px 26px rgba(0,0,0,.28));
}
.mini-phone strong{
  margin-top:2px;
}
.legal-header .brand-logo,
.footer-brand .brand-logo{
  width:46px;
  flex-basis:46px;
}
@media(max-width:680px){
  .brand-logo{width:40px;flex-basis:40px}
  .brand-name{font-size:18px;letter-spacing:1.1px}
  .mini-logo{width:84px}
}

/* SULFA v8.3 — custom bilingual wordmark */
.brand-wordmark{
  display:flex;
  flex-direction:column;
  gap:2px;
  line-height:1;
}
.brand-name{display:none}
.brand-ar{
  font-size:22px;
  font-weight:900;
  letter-spacing:0;
  color:#ffffff;
}
.brand-en{
  font-size:10px;
  font-weight:800;
  letter-spacing:2.4px;
  color:#75f0ee;
  opacity:.92;
  direction:ltr;
}
.site-header .brand-wordmark{
  transform:translateY(1px);
}
.footer-brand .brand-wordmark,
.legal-header .brand-wordmark{
  transform:none;
}
.mini-phone strong{
  font-size:30px;
  letter-spacing:0;
}
.mini-phone small{
  color:#75f0ee;
  font-weight:800;
  letter-spacing:2px;
  font-size:11px;
}
@media(max-width:680px){
  .brand-ar{font-size:19px}
  .brand-en{font-size:9px;letter-spacing:2px}
}

/* =========================================================
   SULFA v9 — launch readiness + mobile-first hero
   ========================================================= */

/* Stronger mobile/tablet stacking: never allow the phone mockup to collide
   with the hero copy, regardless of device pixel ratio or browser zoom. */
@media (max-width:980px){
  .hero-grid{
    display:flex!important;
    flex-direction:column!important;
    grid-template-columns:none!important;
    gap:28px!important;
  }
  .hero-copy{
    order:1;
    width:100%;
    max-width:720px;
    margin-inline:auto;
    text-align:center;
  }
  .hero-visual{
    order:2;
    width:100%;
    max-width:520px;
    margin:6px auto 0!important;
    transform:none!important;
  }
}

@media (max-width:680px){
  .site-header{background:rgba(4,20,40,.94)}
  .nav-wrap{height:66px;gap:10px}
  .brand-logo{width:36px;height:36px;flex-basis:36px}
  .brand-ar{font-size:17px}.brand-en{font-size:8px;letter-spacing:1.7px}
  .menu-toggle{width:40px;height:38px;padding:5px}
  .nav-links{top:70px;inset-inline:12px;border-radius:16px}

  .hero{padding:92px 0 34px!important;min-height:auto!important}
  .hero-grid{gap:24px!important}
  .hero-copy .eyebrow{font-size:10px;line-height:1.5;max-width:94%;justify-content:center}
  .hero-copy h1{
    font-size:clamp(34px,9.5vw,40px)!important;
    line-height:1.34!important;
    margin:14px auto 10px!important;
    max-width:360px;
    letter-spacing:-.25px;
  }
  .hero-copy p{font-size:13px!important;line-height:1.9!important;max-width:355px!important;margin-inline:auto!important}
  .hero-origin-badge{margin:13px auto 0!important;max-width:350px!important;font-size:9.5px!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr;gap:9px!important;max-width:330px;margin:17px auto 0!important}
  .hero-actions .btn{width:100%;min-height:46px!important;font-size:13px}
  .store-note{max-width:340px;margin:14px auto 0!important;justify-content:center!important;gap:7px!important}
  .store-note>span:first-child{width:100%;font-size:10px;margin-bottom:0}
  .store-badge{min-height:35px!important;padding:6px 10px!important;font-size:10px}

  .hero-visual{min-height:426px!important;max-width:100%!important;margin-top:4px!important;overflow:visible}
  .phone{
    width:222px!important;
    height:426px!important;
    transform:none!important;
    border-radius:37px!important;
    padding:7px!important;
  }
  .phone:before{border-radius:34px!important}
  .phone-screen{border-radius:30px!important;padding:35px 9px 8px!important}
  .phone-notch{width:78px!important;height:19px!important;top:12px!important}
  .orbit-a{width:275px!important;height:275px!important}
  .orbit-b{width:326px!important;height:326px!important}
  .trust-float{display:none!important}
  .trust-strip{margin-top:22px!important}

  .floating-support{bottom:max(12px,env(safe-area-inset-bottom));right:12px}
  html[dir="ltr"] .floating-support{left:12px;right:auto}
}

@media(max-width:370px){
  .hero-copy h1{font-size:32px!important;max-width:330px}
  .hero-copy p{font-size:12.5px!important}
  .phone{width:210px!important;height:404px!important}
  .hero-visual{min-height:404px!important}
  .orbit-a{width:260px!important;height:260px!important}.orbit-b{width:306px!important;height:306px!important}
}

/* Waitlist success state */
.waitlist-success{
  padding:30px 26px;
  border-radius:24px;
  background:linear-gradient(160deg,#ffffff,#f1fbfb);
  color:var(--ink);
  text-align:center;
  border:1px solid rgba(31,193,191,.22);
  box-shadow:0 22px 60px rgba(0,0,0,.18);
}
.waitlist-success[hidden]{display:none!important}
.success-check{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;margin:0 auto 14px;background:linear-gradient(135deg,#11c7c8,#54e3c9);color:#06334c;font-size:30px;font-weight:900;box-shadow:0 12px 30px rgba(17,199,200,.24)}
.waitlist-success h3{margin:0 0 7px;font-size:24px;line-height:1.5}.waitlist-success>p{margin:0 auto 10px;max-width:440px;color:#5e7486;font-size:13px}.waitlist-success>small{display:block;color:#678297;margin:9px auto;max-width:440px}.success-platform{display:flex;justify-content:center;gap:7px;margin:13px 0}.success-platform span{padding:6px 10px;border-radius:999px;background:#eaf3f6;color:#6f8290;font-size:10px;font-weight:800}.success-platform[data-platform="android"] span:first-child,.success-platform[data-platform="ios"] span:last-child,.success-platform[data-platform="both"] span{background:#daf9f5;color:#087d82;border:1px solid #a9e9e5}.success-follow{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:17px}.success-follow a{padding:12px;border:1px solid #dce8ed;border-radius:14px;background:#fff;transition:.2s}.success-follow a:hover{transform:translateY(-2px);border-color:#9edfdc}.success-follow b,.success-follow span{display:block}.success-follow b{font-size:12px}.success-follow span{font-size:9px;color:#6f8798;margin-top:2px}
@media(max-width:520px){.waitlist-success{padding:25px 18px}.success-follow{grid-template-columns:1fr}.waitlist-success h3{font-size:21px}}

/* Analytics — intentionally noindexed and data-protected by a server secret. */
.analytics-page{min-height:100vh;background:#f4f8fa;color:var(--ink)}.analytics-header{background:#04172f;color:#fff}.analytics-nav{height:76px;display:flex;align-items:center;justify-content:space-between}.analytics-home{font-size:12px;color:#b9d0df}.analytics-main{padding:54px 0 80px}.analytics-login{max-width:520px;margin:70px auto;padding:32px;border-radius:24px;background:#fff;border:1px solid #e1eaf0;box-shadow:0 18px 50px rgba(7,39,71,.08);text-align:center}.analytics-login h1{margin:10px 0 4px}.analytics-login p{color:#6a7d8d;font-size:13px}.analytics-login form{display:flex;gap:8px;margin-top:20px}.analytics-login input{flex:1;min-width:0;height:48px;border:1px solid #dce7ed;border-radius:12px;padding:0 12px;direction:ltr}.analytics-error{min-height:22px;color:#b64242;font-size:11px;margin-top:8px}.analytics-title-row{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:24px}.analytics-title-row h1{margin:8px 0 0}.analytics-logout{border:1px solid #d9e5eb;border-radius:10px;background:#fff;padding:8px 12px;color:#5d7384;cursor:pointer}.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:13px}.kpi-grid article,.analytics-panel{background:#fff;border:1px solid #e1e9ef;border-radius:20px;box-shadow:0 10px 30px rgba(7,39,71,.045)}.kpi-grid article{padding:20px}.kpi-grid span{display:block;color:#718596;font-size:10px}.kpi-grid strong{display:block;font-size:28px;margin-top:5px;color:#0a385e}.analytics-panels{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-top:13px}.analytics-panel{padding:20px}.analytics-panel h2{font-size:15px;margin:0 0 12px}.metric-line{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-top:1px solid #edf2f5;font-size:12px}.analytics-days{margin-top:13px}.analytics-table-wrap{overflow-x:auto}.analytics-panel table{width:100%;border-collapse:collapse;font-size:11px;text-align:start}.analytics-panel th,.analytics-panel td{padding:10px;border-top:1px solid #e8eff3;text-align:start}.analytics-panel th{color:#698092}.analytics-dashboard[hidden],.analytics-login[hidden]{display:none!important}
@media(max-width:780px){.analytics-main{padding-top:25px}.analytics-login{margin:25px auto}.analytics-login form{flex-direction:column}.kpi-grid{grid-template-columns:1fr 1fr}.analytics-panels{grid-template-columns:1fr}.analytics-title-row{align-items:flex-start}.kpi-grid strong{font-size:24px}}
@media(max-width:680px){
  .lang-switch{display:flex!important;transform:scale(.9);transform-origin:center}
  .lang-switch button{padding:5px 7px;font-size:10px}
  .nav-actions{gap:4px;margin-inline-start:auto}
}
.floating-support{transition:transform .22s ease,opacity .22s ease,border-color .2s ease}
.floating-support.support-hidden{opacity:0;pointer-events:none;transform:translateY(10px) scale(.94)}

/* SULFA v9.2 — analytics dashboard */
.analytics-subtitle{margin:7px 0 0;color:#718596;font-size:11px;max-width:680px}
.analytics-actions{display:flex;gap:8px;align-items:center}
.analytics-refresh,.analytics-logout{border:1px solid #d9e5eb;border-radius:10px;background:#fff;padding:8px 12px;color:#5d7384;cursor:pointer;transition:.2s}
.analytics-refresh:hover,.analytics-logout:hover{border-color:#11bfc2;color:#087a83;transform:translateY(-1px)}
.analytics-range{display:flex;gap:8px;flex-wrap:wrap;margin:-4px 0 18px}
.analytics-range button{border:1px solid #dbe7ed;background:#fff;color:#5f7485;border-radius:999px;padding:8px 14px;cursor:pointer;font:inherit;font-size:11px;transition:.2s}
.analytics-range button.active{background:#0a385e;color:#fff;border-color:#0a385e;box-shadow:0 8px 20px rgba(10,56,94,.14)}
.kpi-grid-five{grid-template-columns:repeat(5,1fr)}
.kpi-grid article small{display:block;margin-top:2px;color:#95a5b1;font-size:9px;line-height:1.55}
.conversion-kpi{background:linear-gradient(145deg,#effdfb,#fff)!important;border-color:#bfeeed!important}.conversion-kpi strong{color:#078a8c!important}
.analytics-charts-grid{display:grid;grid-template-columns:1.55fr .8fr;gap:13px;margin-top:13px}
.analytics-chart-panel,.analytics-platform-panel{min-height:330px}
.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:10px}.panel-head h2{margin:0}.panel-head p{margin:3px 0 0;color:#8495a2;font-size:10px}.panel-head>strong{font-size:25px;color:#0a385e}
.trend-chart{width:100%;height:245px;display:grid;place-items:center;color:#8495a2;font-size:11px;direction:ltr}.trend-chart svg{width:100%;height:100%;overflow:visible}.trend-chart.is-empty{border:1px dashed #dce7ed;border-radius:16px}
.chart-grid-line{stroke:#e7eef2;stroke-width:1}.chart-area{fill:rgba(17,199,200,.10)}.chart-line{fill:none;stroke:#0fb9bd;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}.chart-dot{fill:#fff;stroke:#0a9096;stroke-width:3}.chart-label{fill:#82939f;font-size:10px;font-family:Cairo,Arial,sans-serif}
.platform-chart-wrap{display:grid;place-items:center;gap:20px}.platform-donut{width:150px;height:150px;border-radius:50%;display:grid;place-items:center;position:relative;background:#e8eef2}.platform-donut:after{content:"";position:absolute;width:92px;height:92px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 1px #edf2f4}.platform-donut span{position:relative;z-index:2;font-size:26px;font-weight:800;color:#0a385e}.platform-legend{width:100%;display:grid;gap:8px}.platform-legend>div{display:grid;grid-template-columns:12px 1fr auto 44px;align-items:center;gap:7px;font-size:11px}.platform-legend b{color:#0a385e}.platform-legend small{color:#8495a2;text-align:left}.dot{width:9px;height:9px;border-radius:50%}.dot.android{background:#13c7c8}.dot.ios{background:#2563eb}.dot.both{background:#e5aa36}
.metric-bar{height:6px;background:#eef3f5;border-radius:99px;overflow:hidden;margin:-4px 0 7px}.metric-bar i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#10b8bc,#40dcd1);transition:width .45s ease}.analytics-mini-note{font-size:9px;color:#8b9aa6;line-height:1.7;margin:12px 0 0}
.recent-waitlist-panel{margin-top:13px}.privacy-chip{font-size:9px;border:1px solid #d7e9ec;color:#17878b;background:#effcfc;padding:5px 8px;border-radius:99px}.analytics-empty{padding:22px;text-align:center;color:#8495a2;font-size:11px;border-top:1px solid #edf2f5}.analytics-generated{text-align:center;color:#91a1ad;font-size:9px;margin:13px 0 0}.dashboard-error-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:100;background:#7b2530;color:#fff;padding:11px 15px;border-radius:12px;box-shadow:0 14px 36px rgba(0,0,0,.18);font-size:11px;max-width:min(520px,calc(100% - 30px));text-align:center}.analytics-loading .analytics-refresh{opacity:.55;pointer-events:none}.analytics-loading .analytics-refresh:after{content:"…"}
@media(max-width:1050px){.kpi-grid-five{grid-template-columns:repeat(3,1fr)}.analytics-charts-grid{grid-template-columns:1fr}.analytics-platform-panel{min-height:auto}.platform-chart-wrap{grid-template-columns:170px 1fr}.analytics-panels{grid-template-columns:1fr 1fr}.analytics-panels>article:last-child{grid-column:1/-1}}
@media(max-width:680px){.analytics-title-row{display:grid;gap:12px}.analytics-actions{width:100%}.analytics-actions button{flex:1}.analytics-range{display:grid;grid-template-columns:1fr 1fr}.kpi-grid-five{grid-template-columns:1fr 1fr}.kpi-grid-five article:last-child{grid-column:1/-1}.analytics-charts-grid{grid-template-columns:1fr}.analytics-chart-panel,.analytics-platform-panel{min-height:auto}.trend-chart{height:220px}.platform-chart-wrap{grid-template-columns:1fr}.analytics-panels{grid-template-columns:1fr}.analytics-panels>article:last-child{grid-column:auto}.analytics-panel{padding:16px}.analytics-panel table{min-width:620px}.recent-waitlist-panel table{min-width:700px}}
