/* =====================================================================
   DOROO PARTNER — Landing page (doroo.net/partner)
   Shares the brand tokens used across the partner platform (auth.css)
   and the main Doroo+ site, but builds a full marketing layout.
   ===================================================================== */

:root{
  --bg:#F5F7FA;
  --bg-soft:#EEF2F6;
  --ink:#0E1A26;
  --ink-soft:#5B6B7A;
  --ink-faint:#94A3B0;
  --line:rgba(14,26,38,.09);
  --line-strong:rgba(14,26,38,.14);

  --blue:#1E88E5;
  --blue-deep:#0B4DA1;
  --blue-bright:#29B6F6;
  --aqua-deep:#0A6E74;
  --aqua-mid:#0EA5AE;
  --aqua-bright:#22D3EE;
  --gold:#E8A23A;
  --gold-light:#FFD874;
  --mint:#1FCF8C;
  --mint-deep:#149567;
  --danger:#D64545;

  --dark:#081019;
  --dark-panel:#0F1C2A;
  --dark-line:#1E2E3F;
  --dark-ink-soft:#8496A6;

  --surface:rgba(255,255,255,.74);
  --surface-solid:#FFFFFF;

  --radius-xl:28px;
  --radius-lg:18px;
  --radius-md:14px;
  --radius-sm:10px;

  --font-display:'Manrope','Tajawal',-apple-system,BlinkMacSystemFont,sans-serif;
  --font-body:-apple-system,BlinkMacSystemFont,'Inter','Tajawal',sans-serif;
  --font-mono:'IBM Plex Mono','Tajawal',monospace;

  --ease:cubic-bezier(.22,.8,.24,1);
  --ease-spring:cubic-bezier(.34,1.36,.64,1);
  --ease-apple:cubic-bezier(.16,1,.3,1);
  --maxw:1160px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  line-height:1.5;
  position:relative;
  overflow-x:hidden;
}
img,svg{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:800;margin:0;letter-spacing:-.02em;}
p{margin:0;}
section{position:relative;}
.container{max-width:var(--maxw);margin:0 auto;padding:0 24px;}
.section-pad{padding:104px 0;}
@media(max-width:768px){.section-pad{padding:68px 0;}}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
}

/* ---------------------------------------------------------------------
   Ambient aurora backdrop (same family as the auth pages)
   --------------------------------------------------------------------- */
.aurora{position:fixed;z-index:0;overflow:hidden;pointer-events:none;}
.aurora span{position:absolute;border-radius:50%;filter:blur(80px);opacity:.5;will-change:transform;}
.aurora span:nth-child(1){width:560px;height:560px;top:-200px;left:-140px;background:radial-gradient(circle at 30% 30%, var(--blue-bright), transparent 70%);animation:drift1 26s ease-in-out infinite alternate;}
.aurora span:nth-child(2){width:480px;height:480px;top:120px;right:-160px;background:radial-gradient(circle at 60% 40%, var(--gold-light), transparent 70%);opacity:.35;animation:drift2 32s ease-in-out infinite alternate;}
.aurora span:nth-child(3){width:420px;height:420px;top:640px;left:8%;background:radial-gradient(circle at 50% 50%, var(--mint), transparent 70%);opacity:.2;animation:drift3 38s ease-in-out infinite alternate;}
@keyframes drift1{from{transform:translate(0,0) scale(1);}to{transform:translate(60px,40px) scale(1.08);}}
@keyframes drift2{from{transform:translate(0,0) scale(1);}to{transform:translate(-50px,-30px) scale(1.1);}}
@keyframes drift3{from{transform:translate(0,0) scale(1);}to{transform:translate(40px,-40px) scale(1.12);}}

/* ---------------------------------------------------------------------
   Header
   --------------------------------------------------------------------- */
header{position:relative;z-index:5;padding:20px 0;}
.nav-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;}
.p-logo{display:flex;align-items:center;gap:10px;font-family:var(--font-display);font-weight:800;font-size:18px;letter-spacing:-.01em;}
.p-logo img{width:30px;height:30px;border-radius:8px;transition:transform .4s var(--ease-apple);}
a:hover > .p-logo img,.p-logo:hover img{transform:rotate(-6deg) scale(1.06);}
.p-logo .word-doroo{background:linear-gradient(90deg,var(--blue-deep),var(--blue-bright));-webkit-background-clip:text;background-clip:text;color:transparent;}
.p-logo .word-partner{background:linear-gradient(90deg, var(--gold), #ff74c2 55%, var(--blue-bright));-webkit-background-clip:text;background-clip:text;color:transparent;}
.p-nav{display:flex;align-items:center;gap:30px;font-size:14.5px;font-weight:600;color:var(--ink-soft);}
.p-nav a{position:relative;padding-bottom:3px;transition:color .3s var(--ease-apple);}
.p-nav a::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease-apple);}
.p-nav a:hover{color:var(--ink);}
.p-nav a:hover::after{transform:scaleX(1);}
.p-cta{display:flex;align-items:center;gap:12px;}

/* language dropdown */
.lang-dropdown{position:relative;}
.lang-current{
  display:flex;align-items:center;gap:7px;font-family:var(--font-mono);font-size:12px;font-weight:500;
  background:var(--bg-soft);border:1px solid var(--line);color:var(--ink);
  padding:9px 13px;border-radius:100px;cursor:pointer;transition:border-color .2s;
}
.lang-current:hover{border-color:var(--ink-soft);}
.lang-current svg{width:12px;height:12px;stroke:var(--ink-soft);transition:transform .2s;}
.lang-dropdown.open .lang-current svg{transform:rotate(180deg);}
.lang-menu{
  position:absolute;top:calc(100% + 8px);right:0;min-width:150px;
  background:#fff;border:1px solid var(--line);border-radius:12px;
  box-shadow:0 16px 40px -14px rgba(14,26,38,.25);padding:6px;
  opacity:0;visibility:hidden;transform:translateY(-6px);transition:opacity .18s ease, transform .18s ease, visibility .18s;
  z-index:50;
}
html[dir="rtl"] .lang-menu{right:auto;left:0;}
.lang-dropdown.open .lang-menu{opacity:1;visibility:visible;transform:translateY(0);}
.lang-menu button{
  display:flex;align-items:center;justify-content:space-between;width:100%;
  font-family:var(--font-body);font-size:13.5px;font-weight:500;color:var(--ink);
  background:transparent;border:none;padding:9px 11px;border-radius:8px;cursor:pointer;text-align:left;
}
html[dir="rtl"] .lang-menu button{text-align:right;}
.lang-menu button:hover{background:var(--bg-soft);}
.lang-menu button .code{font-family:var(--font-mono);font-size:11px;color:var(--ink-soft);}
.lang-menu button.active{color:var(--aqua-deep);}
.lang-menu button.active .code{color:var(--aqua-deep);}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:100px;font-size:14.5px;font-weight:700;letter-spacing:-.005em;cursor:pointer;transition:transform .35s var(--ease-apple),box-shadow .35s var(--ease-apple),background-position .5s var(--ease-apple),border-color .25s var(--ease-apple);border:none;}
.btn-accent{background:linear-gradient(120deg,var(--blue-deep),var(--blue) 55%,var(--blue-bright));background-size:160% 160%;color:#fff;box-shadow:0 10px 26px -10px rgba(11,77,161,.55);}
.btn-accent:hover{background-position:100% 50%;box-shadow:0 14px 32px -10px rgba(11,77,161,.6);transform:translateY(-2px);}
.btn-accent:active{transform:translateY(0) scale(.97);box-shadow:0 6px 18px -10px rgba(11,77,161,.6);}
.btn-gold{background:linear-gradient(120deg,var(--gold),var(--gold-light));color:#4A3306;box-shadow:0 10px 26px -10px rgba(232,162,58,.55);}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 14px 32px -10px rgba(232,162,58,.6);}
.btn-gold:active{transform:translateY(0) scale(.97);}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line-strong);}
.btn-ghost:hover{border-color:var(--ink);transform:translateY(-2px);}
.btn-ghost:active{transform:translateY(0) scale(.97);}
.btn-lg{padding:15px 30px;font-size:15.5px;}
.btn svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.4;transition:transform .35s var(--ease-apple);}
.btn:hover svg{transform:translateX(2px);}

/*.hamburger{display:none;background:none;border:none;cursor:pointer;padding:8px;margin:-8px 0;flex-shrink:0;}*/
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:6px;}
.hamburger span{width:22px;height:2px;background:var(--ink);border-radius:2px;}

/*.hamburger span{display:block;width:22px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px;transition:transform .2s var(--ease),opacity .2s var(--ease);}*/
.hamburger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.hamburger[aria-expanded="true"] span:nth-child(2){opacity:0;}
.hamburger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.nav-menu{display:none;}

@media(max-width:860px){
  .p-nav{display:none;}
  .p-cta .btn-ghost,.p-cta .btn-accent{display:none;}
  .hamburger{display:flex;flex-direction:column;justify-content:center;}

  .nav-menu{
    display:flex;flex-direction:column;gap:4px;
    max-width:var(--maxw);margin:0 auto;padding:0 24px;
    max-height:0;overflow:hidden;opacity:0;
    transition:max-height .25s var(--ease),opacity .2s var(--ease),padding .25s var(--ease);
  }
  .nav-menu.open{
    max-height:420px;opacity:1;padding:10px 24px 22px;
  }
  .nav-menu a{
    font-size:15px;font-weight:600;padding:12px 4px;
    border-bottom:1px solid var(--line);
  }
  .nav-menu-actions{display:flex;flex-direction:column;gap:10px;margin-top:14px;}
  .nav-menu-actions .btn{width:100%;}
}

@media(max-width:420px){
  .p-logo span{font-size:16px;}
  .lang-current span:not(.code){font-size:11px;}
}

/* ---------------------------------------------------------------------
   Hero
   --------------------------------------------------------------------- */
.hero{padding:56px 0 30px;position:relative;z-index:1;}
.eyebrow{font-family:var(--font-mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue);display:inline-flex;align-items:center;gap:10px;margin-bottom:20px;}
.eyebrow::before{content:'';width:22px;height:1px;background:var(--blue);display:inline-block;}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;}
@media(max-width:900px){.hero-grid{grid-template-columns:1fr;gap:36px;}}
.hero h1{font-size:46px;line-height:1.08;}
@media(max-width:600px){.hero h1{font-size:32px;}}
.hero .sub{color:var(--ink-soft);font-size:17px;line-height:1.6;margin:20px 0 30px;max-width:520px;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;align-items:center;}
.hero-note{margin-top:20px;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.hero-note .dot{width:4px;height:4px;border-radius:50%;background:var(--ink-faint);display:inline-block;}

.hero-visual{position:relative;animation:hero-float 7s ease-in-out infinite;}
.commission-highlight{position:relative;background:var(--surface);backdrop-filter:blur(28px) saturate(180%);-webkit-backdrop-filter:blur(28px) saturate(180%);border:1px solid rgba(255,255,255,.7);border-radius:var(--radius-xl);padding:30px 30px 26px;box-shadow:0 1px 1px rgba(14,26,38,.03),0 24px 60px -24px rgba(14,165,174,.32),0 40px 80px -40px rgba(14,26,38,.2);text-align:center;overflow:hidden;transition:transform .5s var(--ease-apple),box-shadow .5s var(--ease-apple);}
.commission-highlight:hover{transform:translateY(-4px);box-shadow:0 1px 1px rgba(14,26,38,.03),0 32px 70px -24px rgba(14,165,174,.4),0 48px 90px -40px rgba(14,26,38,.24);}
@keyframes hero-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}
@media(max-width:900px){.hero-visual{animation:none;}}
.commission-highlight::before{content:'';position:absolute;top:-60px;right:-60px;width:160px;height:160px;background:radial-gradient(circle, rgba(34,211,238,.28), transparent 70%);pointer-events:none;}
.ch-head{position:relative;display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;text-align:left;}
.ch-head > span:first-child{font-family:var(--font-mono);font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);}
.rate-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(14,165,174,.14);color:#00bc6c;font-size:11.5px;font-weight:700;padding:5px 10px;border-radius:100px;}
.rate-badge .dot{width:6px;height:6px;border-radius:50%;background:var(--aqua-deep);animation:pulse-dot 2.2s ease-in-out infinite;}
@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.45;transform:scale(1.3);}}
.ch-num{position:relative;font-family:var(--font-display);font-weight:800;font-size:60px;line-height:1;background:linear-gradient(120deg, #40f4ff, #009fff);-webkit-background-clip:text;background-clip:text;color:transparent;}
.ch-num span{font-size:80px;font-weight:700;}
.ch-label{position:relative;font-weight:700;font-size:14.5px;color:var(--ink);margin-top:6px;}
.ch-note{position:relative;font-size:13px;color:var(--ink-soft);line-height:1.5;margin-top:16px;}
.ch-note strong{color:var(--ink);}
.payout-chip{position:absolute;bottom:-18px;right:-14px;background:var(--surface-solid);border:1px solid var(--line);border-radius:100px;padding:10px 16px;box-shadow:0 14px 32px -14px rgba(14,26,38,.25);display:flex;align-items:center;gap:10px;font-size:13px;font-weight:700;animation:chip-float 5s ease-in-out infinite;animation-delay:.3s;}
@keyframes chip-float{0%,100%{transform:translateY(0);}50%{transform:translateY(-6px);}}
@media(max-width:900px){.payout-chip{animation:none;}}
@media(max-width:600px){.payout-chip{right:0;}}
.payout-chip .pc-dot{width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px rgba(31,207,140,.18);animation:pulse-dot 2.2s ease-in-out infinite;animation-delay:.6s;}

/* ---------------------------------------------------------------------
   Trust strip
   --------------------------------------------------------------------- */
.trust-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;margin-top:64px;position:relative;z-index:1;}
.trust-row{display:flex;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:center;}
.trust-item{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:600;color:var(--ink-soft);}
.trust-item svg{width:18px;height:18px;stroke:var(--mint-deep);stroke-width:2.4;flex-shrink:0;}

/* ---------------------------------------------------------------------
   Head block (shared section heading)
   --------------------------------------------------------------------- */
.head-block{max-width:640px;margin:0 auto 52px;text-align:center;}
.head-block h2{font-size:34px;line-height:1.15;}
@media(max-width:600px){.head-block h2{font-size:26px;}}
.head-block .sub{color:var(--ink-soft);font-size:16px;margin-top:14px;line-height:1.6;}
.section-dark .eyebrow{color:var(--blue-bright);}
.section-dark .eyebrow::before{background:var(--blue-bright);}
.section-dark{background:var(--dark);color:#fff;}
.section-dark .head-block .sub{color:var(--dark-ink-soft);}

/* ---------------------------------------------------------------------
   Who it's for chips
   --------------------------------------------------------------------- */
.audience-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
@media(max-width:900px){.audience-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.audience-grid{grid-template-columns:1fr;}}
.audience-card{background:var(--surface-solid);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px 20px;text-align:center;transition:transform .2s var(--ease),box-shadow .2s var(--ease),border-color .2s var(--ease);}
.audience-card:hover{transform:translateY(-3px);box-shadow:0 20px 40px -24px rgba(14,26,38,.2);border-color:rgba(30,136,229,.35);}
.audience-icon{width:46px;height:46px;border-radius:13px;background:rgba(30,136,229,.12);color:var(--blue-deep);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.audience-icon svg{width:22px;height:22px;stroke-width:2;}
.audience-card h4{font-size:15px;margin-bottom:6px;}
.audience-card p{font-size:13px;color:var(--ink-soft);line-height:1.5;}

/* ---------------------------------------------------------------------
   How it works — 5 step path
   --------------------------------------------------------------------- */
.path{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:18px;counter-reset:step;}
@media(max-width:980px){.path{grid-template-columns:repeat(2,1fr);}}
@media(max-width:560px){.path{grid-template-columns:1fr;}}
.path::before{content:'';position:absolute;top:26px;left:6%;right:6%;height:2px;background:linear-gradient(90deg,var(--blue),var(--mint),var(--gold));opacity:.35;}
@media(max-width:980px){.path::before{display:none;}}
.path-step{position:relative;background:var(--surface-solid);border:1px solid var(--line);border-radius:var(--radius-lg);padding:26px 20px 22px;}
.path-num{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--blue-deep),var(--blue-bright));color:#fff;font-family:var(--font-display);font-weight:800;font-size:15px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;position:relative;z-index:1;}
.path-step:nth-child(2) .path-num{background:linear-gradient(135deg,#149567,var(--mint));}
.path-step:nth-child(3) .path-num{background:linear-gradient(135deg,var(--gold),#c97f16);}
.path-step:nth-child(4) .path-num{background:linear-gradient(135deg,var(--blue-deep),var(--blue-bright));}
.path-step:nth-child(5) .path-num{background:linear-gradient(135deg,#149567,var(--mint));}
.path-step h4{font-size:15.5px;margin-bottom:8px;line-height:1.3;}
.path-step p{font-size:13.5px;color:var(--ink-soft);line-height:1.55;}

/* ---------------------------------------------------------------------
   Commission tiers
   --------------------------------------------------------------------- */
.tier-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
@media(max-width:900px){.tier-grid{grid-template-columns:1fr;}}
.tier-card{position:relative;border:1px solid var(--dark-line);border-radius:var(--radius-xl);padding:32px 28px;background:var(--dark-panel);overflow:hidden;}
.tier-card::before{content:'';position:absolute;inset:0;pointer-events:none;}
.tier-card.t-starter::before{background:radial-gradient(70% 140% at 100% 0%, rgba(41,182,246,.16), transparent 70%);}
.tier-card.t-growth::before{background:radial-gradient(70% 140% at 100% 0%, rgba(31,207,140,.16), transparent 70%);}
.tier-card.t-gold::before{background:radial-gradient(70% 140% at 100% 0%, rgba(232,162,58,.22), transparent 70%);border:1.5px solid rgba(232,162,58,.5);}
.tier-card.t-gold{border-color:rgba(232,162,58,.5);}
.tier-top{position:relative;display:flex;align-items:center;justify-content:space-between;margin-bottom:22px;}
.tier-icon{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;}
.tier-icon svg{width:20px;height:20px;stroke-width:2;}
.t-starter .tier-icon{background:rgba(41,182,246,.16);color:var(--blue-bright);}
.t-growth .tier-icon{background:rgba(31,207,140,.18);color:var(--mint);}
.t-gold .tier-icon{background:linear-gradient(135deg,rgba(232,162,58,.3),rgba(255,216,116,.34));color:var(--gold-light);}
.tier-pill{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;padding:5px 10px;border-radius:100px;background:rgba(255,255,255,.08);color:#d7e5f1;}
.tier-card.t-gold .tier-pill{background:linear-gradient(120deg,rgba(232,162,58,.35),rgba(255,216,116,.35));color:#ffedd1;font-weight:700;}
.tier-card h3{position:relative;font-size:19px;color:#fff;margin-bottom:6px;}
.tier-rate{position:relative;font-family:var(--font-display);font-weight:800;font-size:54px;line-height:1;color:#fff;margin:14px 0 6px;}
.tier-rate span{font-size:16px;font-weight:600;color:var(--dark-ink-soft);margin-left:4px;}
.tier-card .tier-desc{position:relative;font-size:13.5px;color:var(--dark-ink-soft);line-height:1.6;margin-bottom:18px;}
.tier-card ul{position:relative;list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;}
.tier-card li{display:flex;gap:9px;align-items:flex-start;font-size:13.5px;color:#dfe7ee;}
.tier-card li svg{width:15px;height:15px;stroke:var(--mint);flex-shrink:0;margin-top:2px;}
.tier-card.t-gold li svg{stroke:var(--gold-light);}
.tier-ladder-note{text-align:center;color:var(--dark-ink-soft);font-size:13.5px;margin-top:30px;max-width:560px;margin-left:auto;margin-right:auto;}
.tier-ladder-note strong{color:#fff;}

/* ---------------------------------------------------------------------
   Payout timeline mini-strip
   --------------------------------------------------------------------- */
.mini-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:56px;}
@media(max-width:820px){.mini-strip{grid-template-columns:1fr;}}
.mini-card{background:var(--surface-solid);border:1px solid var(--line);border-radius:var(--radius-lg);padding:24px;display:flex;gap:16px;align-items:flex-start;}
.mini-icon{width:40px;height:40px;border-radius:11px;background:rgba(30,136,229,.12);color:var(--blue-deep);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.mini-icon svg{width:19px;height:19px;stroke-width:2;}
.mini-card h4{font-size:14.5px;margin-bottom:6px;}
.mini-card p{font-size:13px;color:var(--ink-soft);line-height:1.5;}

/* ---------------------------------------------------------------------
   FAQ (accordion)
   --------------------------------------------------------------------- */
.faq-list{max-width:760px;margin:0 auto;display:flex;flex-direction:column;gap:12px;}
.faq-item{border:1px solid var(--dark-line);border-radius:var(--radius-lg);background:rgba(255,255,255,.03);overflow:hidden;}
.faq-q{width:100%;background:none;border:none;padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;color:#fff;font-family:var(--font-display);font-weight:700;font-size:15px;text-align:left;}
.faq-q svg{width:18px;height:18px;stroke:var(--dark-ink-soft);stroke-width:2.4;flex-shrink:0;transition:transform .25s var(--ease);}
.faq-item.open .faq-q svg{transform:rotate(180deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s var(--ease);}
.faq-a p{padding:0 22px 20px;font-size:14px;color:var(--dark-ink-soft);line-height:1.6;}

/* ---------------------------------------------------------------------
   Final CTA
   --------------------------------------------------------------------- */
.final-cta{text-align:center;}
.final-cta h2{font-size:36px;line-height:1.15;}
@media(max-width:600px){.final-cta h2{font-size:26px;}}
.final-cta .sub{max-width:520px;margin:16px auto 32px;color:var(--ink-soft);font-size:16px;line-height:1.6;}

/* ---------------------------------------------------------------------
   Footer
   --------------------------------------------------------------------- */
footer{padding:44px 0;border-top:1px solid var(--line);}
.p-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;}
.p-foot-links{display:flex;gap:22px;flex-wrap:wrap;font-size:13.5px;color:var(--ink-soft);}
.p-foot-links a:hover{color:var(--ink);}
.p-foot-copy{font-size:13px;color:var(--ink-faint);}

/* ---------------------------------------------------------------------
   Motion — hero entrance, scroll reveals, count-up, hover polish
   (kept subtle & physical, in the spirit of Apple's marketing pages)
   --------------------------------------------------------------------- */

/* Hero: staggered fade + rise on load (blur-focus, matching the main site) */
.hero-in{opacity:0;transform:translateY(20px) scale(.98);filter:blur(6px);transition:opacity 1s var(--ease-apple),transform 1s var(--ease-apple),filter 1s var(--ease-apple);transition-delay:var(--reveal-delay,0s);}
.hero-in.is-visible{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}

/* Headline: each word masked in its own overflow-hidden window and
   wiped upward into place — the classic Apple keynote-page reveal. */
.hero h1{overflow:visible;}
.hero h1 .word-mask{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em;}
.hero h1 .word-inner{display:inline-block;transform:translateY(112%);transition:transform 1s var(--ease-apple);transition-delay:var(--d,0ms);}
.hero h1.title-in .word-inner{transform:translateY(0);}

/* Generic scroll-triggered reveal, used on section content below the fold */
[data-reveal]{opacity:0;transform:translateY(30px) scale(.97);filter:blur(7px);transition:opacity 1.1s var(--ease-apple),transform 1.1s var(--ease-apple),filter 1.1s var(--ease-apple);transition-delay:var(--reveal-delay,0s);}
[data-reveal].is-visible{opacity:1;transform:translateY(0) scale(1);filter:blur(0);}

@media (prefers-reduced-motion: reduce){
  .hero h1 .word-inner{transition-delay:0ms !important;}
  [data-reveal],.hero-in{transition-delay:0ms !important;filter:none !important;}
}

/* Count-up numbers (hero rate, tier rates) */
.count-up{display:inline-block;font-variant-numeric:tabular-nums;}

/* Magnetic primary CTAs — JS sets the translate() on mousemove */
.btn.magnetic{transition:transform .18s var(--ease-apple),box-shadow .45s var(--ease-apple),background-position .5s var(--ease-apple);}
.btn.magnetic:not(:hover){transform:translate(0,0) !important;}

/* Live cursor-tilt on the hero commission card — JS drives the
   transform on mousemove; keep this transition snappy so it tracks
   the cursor instead of trailing it like the scroll reveals. */
.commission-highlight{will-change:transform;transition:transform .35s cubic-bezier(.22,1,.36,1),box-shadow .5s var(--ease-apple);}

/* Card hover polish — replace flat states with a soft lift + longer, calmer easing */
.audience-card{transition:transform .45s var(--ease-apple),box-shadow .45s var(--ease-apple),border-color .45s var(--ease-apple);}
.audience-card:hover{transform:translateY(-5px);}
.audience-icon{transition:transform .4s var(--ease-apple);}
.audience-card:hover .audience-icon{transform:scale(1.08) rotate(-4deg);}

.path-step{transition:transform .45s var(--ease-apple),box-shadow .45s var(--ease-apple),border-color .45s var(--ease-apple);}
.path-step:hover{transform:translateY(-5px);box-shadow:0 20px 40px -26px rgba(14,26,38,.22);border-color:rgba(30,136,229,.3);}
.path-num{transition:transform .4s var(--ease-apple);}
.path-step:hover .path-num{transform:scale(1.08);}

.tier-card{transition:transform .45s var(--ease-apple),box-shadow .45s var(--ease-apple),border-color .45s var(--ease-apple);}
.tier-card:hover{transform:translateY(-6px);box-shadow:0 30px 60px -30px rgba(0,0,0,.45);}
.tier-card.t-gold:hover{box-shadow:0 30px 60px -26px rgba(232,162,58,.28);}

.mini-card{transition:transform .45s var(--ease-apple),box-shadow .45s var(--ease-apple);}
.mini-card:hover{transform:translateY(-4px);box-shadow:0 20px 40px -26px rgba(14,26,38,.18);}
.mini-icon{transition:transform .4s var(--ease-apple);}
.mini-card:hover .mini-icon{transform:scale(1.08);}

.trust-item svg{transition:transform .3s var(--ease-apple);}
.trust-item:hover svg{transform:scale(1.15);}

/* FAQ — calmer easing + gentle content fade alongside the height transition */
.faq-item{transition:border-color .3s var(--ease-apple);}
.faq-item.open{border-color:rgba(41,182,246,.35);}
.faq-q{transition:color .25s var(--ease-apple);}
.faq-q svg{transition:transform .4s var(--ease-apple);}
.faq-a{transition:max-height .5s var(--ease-apple),opacity .35s var(--ease-apple);opacity:0;}
.faq-item.open .faq-a{opacity:1;}

@media (prefers-reduced-motion: reduce){
  .hero-visual,.payout-chip,.rate-badge .dot,.payout-chip .pc-dot{animation:none !important;}
}

/* RTL support (Arabic docs/pages that include this file) */
html[dir="rtl"] body{font-family:'Tajawal',sans-serif;}
html[dir="rtl"] h1,html[dir="rtl"] h2,html[dir="rtl"] h3,html[dir="rtl"] h4{font-family:'Tajawal',sans-serif;letter-spacing:0;}
html[dir="rtl"] .eyebrow::before{transform:scaleX(-1);}
html[dir="rtl"] .payout-chip{right:auto;left:-14px;}
html[dir="rtl"] .ch-head{text-align:right;}
html[dir="rtl"] .commission-highlight::before{right:auto;left:-60px;}
html[dir="rtl"] .lang-current{direction:ltr;}