/* =====================================================================
   Dalya Way — landing page (loads AFTER assets/css/site.css)
   Landing-only sections: hero, ribbon, program rows, features band,
   results, steps, plans, testimonials, FAQ accordion, painted CTA.
   ===================================================================== */

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;overflow:clip;padding:calc(var(--hdr-h) + 44px) 0 70px;
  background:
    radial-gradient(700px 480px at 100% 0%,rgba(253,79,77,.16),transparent 62%),
    radial-gradient(560px 460px at 0% 70%,rgba(253,79,77,.10),transparent 62%),
    linear-gradient(180deg,#fff5f4 0%,#fff 100%)}
.hero-in{display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:center;min-height:640px}
.hero h1{font-size:clamp(2.6rem,5.2vw,4.25rem);color:var(--ink);margin:0;line-height:1.18}
@media (min-width:1200px){[lang=ar] .hero h1{white-space:nowrap}}
.hero .kicker{display:inline-flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 14px 6px 8px;font-weight:700;font-size:.9rem;color:var(--ink-2);margin-bottom:22px;box-shadow:0 8px 20px rgba(35,36,37,.06)}
.hero .kicker b{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--pink);color:#fff;font-size:.75rem}
.hero .lead{font-size:1.2rem;color:#666;margin:22px 0 32px;max-width:560px;line-height:1.75}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.hero-cta .btn{padding:16px 26px;font-size:1.05rem}
.hero .proof{display:flex;flex-wrap:wrap;gap:22px;margin-top:34px;padding-top:24px;border-top:1px solid var(--line)}
.hero .proof span{display:inline-flex;align-items:center;gap:8px;font-weight:700;color:var(--ink-2);font-size:.95rem}
.hero .proof i{color:var(--pink)}
.hero-media{position:relative;isolation:isolate}

/* hero art (DW cut-out) */
.hero-art{position:relative;isolation:isolate;width:118%;margin-inline-start:-4%}
.hero-art .glow{position:absolute;inset:14% 0 4%;background:radial-gradient(closest-side,rgba(253,79,77,.30),rgba(253,79,77,0) 72%);z-index:-1;filter:blur(14px)}
.hero-art img{width:100%;height:auto;display:block;filter:drop-shadow(0 26px 34px rgba(35,36,37,.16))}
.hero-art .tag{position:absolute;bottom:5%;inset-inline-start:6%;background:#fff;color:var(--ink);border:2px solid var(--ink);padding:6px 20px 8px;border-radius:999px;font-size:1.7rem;transform:rotate(-6deg);box-shadow:5px 5px 0 var(--pink);white-space:nowrap;z-index:2}
[lang=en] .hero-art .tag{font-size:1.9rem}

/* ---------- ribbon ---------- */
.marq-wrap{overflow:hidden;overflow:clip;background:#fff}
.marq{background:var(--black);color:#fff;overflow:hidden;padding:15px 0;transform:rotate(-1.4deg);width:106%;margin:-6px -3% 4px}
.marq-in{display:flex;width:max-content;animation:marq 44s linear infinite}
.marq span{display:flex;gap:30px;padding-inline-end:30px;font-family:var(--ff-disp);font-weight:800;font-size:1.1rem;white-space:nowrap;letter-spacing:.02em}
.marq i{color:var(--pink);font-style:normal}
@keyframes marq{to{transform:translateX(-50%)}}
[dir=rtl] .marq-in{animation-name:marq-rtl}
@keyframes marq-rtl{to{transform:translateX(50%)}}
@media (prefers-reduced-motion:reduce){.marq-in{animation:none}}

/* ---------- program (3 cards) ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.rows{display:grid;gap:22px;margin:26px 0 30px}
.row{display:flex;gap:18px;align-items:flex-start}
.sq{flex:none;width:58px;height:58px;border-radius:14px;background:var(--pink);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:1.35rem;box-shadow:0 10px 24px rgba(253,79,77,.28);transform:rotate(-6deg)}
.row b{display:block;font-size:1.25rem;color:var(--ink);margin-bottom:4px;font-family:var(--ff-disp);font-weight:800}
.row span{color:var(--mut)}
.row .sq,.row .sq i{color:#fff}
.rows.three{grid-template-columns:repeat(3,1fr);gap:24px;margin:0}
.rows.three .row{flex-direction:column;align-items:center;text-align:center;background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px 22px 26px;box-shadow:0 10px 30px rgba(35,36,37,.05);transition:.25s}
.rows.three .row:hover{transform:translateY(-6px);box-shadow:0 22px 50px rgba(253,79,77,.12);border-color:var(--pink-soft)}
.rows.three .sq{width:66px;height:66px;font-size:1.5rem;margin-bottom:10px}

/* ---------- features (black band with brush decor) ---------- */
.sec-feat{background:var(--black);color:#fff;position:relative;overflow:hidden;overflow:clip}
.sec-feat .deco{opacity:.95}
.sec-feat .da{width:380px;height:110px;top:-20px;inset-inline-start:-90px;transform:rotate(-16deg)}
.sec-feat .db{width:300px;height:90px;bottom:60px;inset-inline-end:-80px;transform:rotate(-14deg);opacity:.8}
.sec-feat .container{position:relative}
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 34px}
.feat{text-align:center}
.feat .ic{position:relative;width:74px;height:74px;display:inline-flex;align-items:center;justify-content:center;color:#fff;font-size:1.45rem;margin-bottom:18px;isolation:isolate}
.feat .ic::before{content:'';position:absolute;inset:0;background:var(--pink);border-radius:46% 54% 52% 48%/52% 48% 52% 48%;filter:url(#brush-sm);z-index:-1}
.feat b{display:block;font-size:1.3rem;font-family:var(--ff-disp);font-weight:800;margin-bottom:8px}
.feat p{margin:0;color:#c8c9cb;font-size:.98rem}

/* ---------- results ---------- */
.results{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.result{border-radius:var(--r-card);overflow:hidden;background:#fff;box-shadow:0 18px 44px rgba(35,36,37,.10);border:1px solid var(--line)}
.ba{display:grid;grid-template-columns:1fr 1fr}
.ba figure{margin:0;position:relative;aspect-ratio:3/4;background:linear-gradient(160deg,var(--pink-soft),#fff);display:flex;align-items:center;justify-content:center;color:var(--mut);font-weight:800}
.ba figure img{width:100%;height:100%;object-fit:cover}
.ba figcaption{position:absolute;bottom:10px;inset-inline-start:10px;background:var(--black);color:#fff;font-size:.78rem;padding:4px 10px;border-radius:6px;font-weight:800}
.result .meta{padding:14px 18px;color:var(--mut);font-size:.9rem;border-top:1px solid var(--line)}

/* ---------- steps (outlined numbers) ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.step{background:#fff;border:1px solid var(--line);border-radius:18px;padding:28px 24px 26px;position:relative;transition:.25s;box-shadow:0 10px 30px rgba(35,36,37,.05)}
.step:hover{transform:translateY(-6px);border-color:var(--pink-soft);box-shadow:0 22px 50px rgba(253,79,77,.12)}
.step .n{display:block;font-family:var(--ff-disp);font-weight:900;font-size:3.6rem;line-height:1;color:transparent;-webkit-text-stroke:2px var(--pink);margin-bottom:14px}
.step b{display:block;font-family:var(--ff-disp);font-weight:800;font-size:1.15rem;margin-bottom:6px}
.step span{color:var(--mut);font-size:.95rem}

.cards.first{margin-bottom:70px}

/* ---------- plans (black band, white cards) ---------- */
.plans{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.plan{background:#fff;color:var(--ink);border-radius:25px;padding:30px 26px 26px;display:flex;flex-direction:column;position:relative;transition:.25s}
.plan:hover{transform:translateY(-6px)}
.plan.featured{outline:3px solid var(--pink);outline-offset:4px}
@media (min-width:1001px){.plan.featured{order:2;transform:translateY(-12px)}.plan.featured:hover{transform:translateY(-18px)}.plan:nth-child(2){order:1}.plan:nth-child(3){order:3}}
.plan .ribbon{position:absolute;top:-14px;inset-inline-start:22px;background:var(--pink);color:#fff;font-size:.8rem;font-weight:800;padding:6px 14px;border-radius:6px;transform:rotate(-2deg)}
.plan h3{font-family:var(--ff-disp);font-weight:800;font-size:1.45rem;margin:6px 0 4px}
.plan .sub{color:var(--mut);font-size:.92rem;margin:0 0 16px}
.price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.price s{color:var(--mut);font-size:1.05rem}
.price b{font-family:var(--ff-disp);font-weight:800;font-size:2.7rem;color:var(--pink);line-height:1}
.price small{color:var(--ink-2);font-weight:800}
.limited{display:inline-block;font-size:.82rem;color:var(--pink-2);font-weight:800;margin:6px 0 14px}
.plan .gift{background:var(--pink-wash);border:1.5px dashed var(--pink);border-radius:10px;padding:10px 12px;font-size:.88rem;color:var(--ink-2);margin-bottom:16px;font-weight:700}
.plan ul{list-style:none;padding:0;margin:0 0 22px;display:grid;gap:10px;flex:1}
.plan li{display:flex;gap:10px;align-items:flex-start;color:var(--ink-2);font-size:.95rem}
.plan li i{color:var(--pink);margin-top:6px;font-size:.8rem}

/* ---------- testimonials (snap slider) ---------- */
.tests-wrap{position:relative}
.tests{display:flex;gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:6px 6px 14px;-webkit-overflow-scrolling:touch}
.tests::-webkit-scrollbar{display:none}
.test{flex:0 0 calc((100% - 56px)/3);scroll-snap-align:start;background:#fff;border:1px solid var(--line);border-radius:var(--r-card);padding:26px;box-shadow:0 10px 30px rgba(35,36,37,.06);position:relative;display:flex;flex-direction:column}
.test::before{content:'\201C';position:absolute;top:8px;inset-inline-end:20px;font-size:4.5rem;line-height:1;color:var(--pink-soft);font-family:serif}
.test .who{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.test .av{flex:none;width:48px;height:48px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:900;color:#fff;font-size:.95rem;outline:2px solid var(--pink);outline-offset:2px}
.test .who b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.test .who span{color:var(--mut);font-size:.82rem}
.test .stars{color:#ffb020;font-size:.85rem;margin-bottom:10px}
.test .txt{margin:0;color:var(--ink-2);line-height:1.8;max-height:9.2em;overflow:hidden;position:relative;flex:1}
.test .txt::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2.6em;background:linear-gradient(rgba(255,255,255,0),#fff)}
.test.open .txt{max-height:none}
.test.open .txt::after{display:none}
.test .more{align-self:flex-start;margin-top:10px;background:none;border:0;color:var(--pink);font:inherit;font-weight:800;cursor:pointer;padding:0}
.test .more.hide{display:none}
.tests-nav{display:flex;justify-content:center;gap:10px;margin-top:8px}
.tests-nav .tn{width:44px;height:44px;border-radius:50%;border:1px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:.2s;font-size:.9rem}
.tests-nav .tn:hover{background:var(--ink);color:#fff}
[dir=ltr] .tests-nav .tn i{transform:scaleX(-1)}

/* ---------- faq (landing accordion) ---------- */
.faq{max-width:860px;margin:0 auto;display:grid;gap:12px}
.q{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden}
.q button{width:100%;display:flex;align-items:center;gap:14px;background:none;border:0;color:var(--ink);font:inherit;font-weight:800;font-size:1.02rem;padding:18px 20px;cursor:pointer;text-align:start}
.q button .ic{flex:none;width:34px;height:34px;border-radius:50%;background:var(--pink);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:.8rem}
.q button .ch{margin-inline-start:auto;color:var(--mut);transition:.25s}
.q .a{display:none;padding:0 20px 18px 68px;color:var(--ink-2);line-height:1.85}
[dir=rtl] .q .a{padding:0 68px 18px 20px}
.q.open .a{display:block}
.q.open button .ch{transform:rotate(180deg)}

/* ---------- CTA: angled painted panel on black ---------- */
.cta{padding:110px 0;background:var(--black);color:#fff;position:relative;overflow:hidden;overflow:clip}
.panel{position:relative;padding:64px 60px;isolation:isolate;color:var(--ink)}
.panel::before{content:'';position:absolute;inset:0;background:var(--pink);clip-path:polygon(0 7%,100% 0,98.5% 100%,1.5% 93%);filter:url(#brush);z-index:-1;will-change:transform}
.panel-in{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}
.panel h2{font-size:clamp(2rem,4.6vw,3.2rem);margin:0;color:var(--ink)}
.panel .script{display:block;font-size:clamp(2.6rem,6.5vw,4.6rem);color:#fff;margin-top:4px;text-shadow:3px 3px 0 var(--ink)}
.panel p{color:#2a1c1c;font-size:1.08rem;max-width:560px;margin:14px 0 30px;font-weight:500}
.panel .rowb{display:flex;gap:14px;flex-wrap:wrap}
.panel-logo{display:flex;align-items:center;justify-content:center}
.panel-logo .card{background:var(--black);border-radius:24px;padding:36px 34px 30px;transform:rotate(-4deg);box-shadow:0 28px 50px rgba(0,0,0,.35);outline:4px solid #fff;width:min(100%,400px)}
.panel-logo img{width:100%;height:auto;display:block}

/* ---------- responsive (landing) ---------- */
@media (max-width:1000px){
  .feats,.plans,.results,.steps{grid-template-columns:repeat(2,1fr)}
  .plan.featured{grid-column:1/-1}
  .test{flex-basis:calc((100% - 34px)/2)}
  .rows.three{grid-template-columns:1fr 1fr}
  .panel{padding:48px 36px}
  .panel-in{grid-template-columns:1fr}
  .panel-logo .card{width:min(100%,290px);padding:26px 24px 22px}
  .hero-art{width:104%;margin-inline-start:-2%}
}
@media (max-width:760px){
  .hero{padding:calc(var(--hdr-h) + 30px) 0 50px}
  .hero-in,.split{grid-template-columns:1fr;gap:44px;min-height:0}
  .hero-art{width:100%;margin:0}
  .hero-art .tag{font-size:1.35rem;padding:5px 16px 7px;bottom:2%}
  .marq span{font-size:.95rem}
  .feats,.plans,.results,.steps{grid-template-columns:1fr}
  .plan.featured{grid-column:auto;background:linear-gradient(180deg,#fff,var(--pink-wash));box-shadow:0 20px 50px rgba(253,79,77,.28);margin-top:10px}
  .plan.featured .ribbon{font-size:.9rem;padding:8px 16px}
  .test{flex-basis:86%}
  .cards{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -20px;padding:4px 20px 16px;-webkit-overflow-scrolling:touch}
  .cards::-webkit-scrollbar{display:none}
  .cards .card{flex:0 0 78%;scroll-snap-align:start}
  .cards.first{margin-bottom:30px}
  .rows.three{grid-template-columns:1fr}
  .cta{padding:70px 0}
  .panel{padding:56px 24px 48px}
  .panel::before{clip-path:polygon(0 3%,100% 0,99% 100%,1% 97%)}
}

/* ---------- touch devices: cheap rough edges (no SVG filters) ---------- */
@media (pointer:coarse), (max-width:760px){
  .feat .ic::before,.panel::before{filter:none;will-change:auto}
  .panel::before{clip-path:polygon(0 6%,8% 4%,18% 6%,30% 3%,42% 5%,55% 2%,68% 4%,80% 1%,92% 3%,100% 0,99.5% 20%,98.8% 45%,99.4% 70%,98.5% 100%,88% 99%,76% 100%,64% 98.5%,52% 100%,40% 98.6%,28% 100%,16% 98.5%,6% 99.5%,1.5% 93%,.6% 70%,1.2% 40%,.4% 20%)}
}

/* ---------- about + certificates ---------- */
.split.about{gap:60px}
.about-media{position:relative;isolation:isolate;max-width:440px;margin-inline:auto;width:100%}
.about-media .s1{width:112%;height:44%;top:30%;inset-inline-start:-8%;transform:rotate(-12deg);z-index:-1}
.about-photo{border-radius:28px;overflow:hidden;aspect-ratio:4/5;background:var(--black);box-shadow:0 30px 60px rgba(35,36,37,.18)}
.about-photo img{width:100%;height:100%;object-fit:cover;display:block}
.about-photo.ph{display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 40%,#3a3b3d,#232425 70%)}
.about-photo.ph img{width:62%;height:auto;object-fit:contain}
.about-stats{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:-34px;position:relative;z-index:2;padding:0 10px}
.about-stats div{background:#fff;border:1px solid var(--line);border-radius:14px;padding:10px 18px;text-align:center;box-shadow:0 12px 30px rgba(35,36,37,.10);min-width:100px}
.about-stats b{display:block;font-family:var(--ff-disp);font-weight:800;font-size:1.5rem;color:var(--pink);line-height:1.1}
.about-stats span{font-size:.8rem;color:var(--mut);font-weight:700}
.about-p{color:var(--ink-2);font-size:1.05rem;line-height:1.9;margin:0 0 12px}
.certs h3{font-family:var(--ff-disp);font-weight:800;font-size:1.1rem;margin:24px 0 12px;display:flex;align-items:center;gap:8px}
.certs h3 i{color:var(--pink)}
.certs-grid{display:flex;gap:10px;flex-wrap:wrap}
.cert{border:1px solid var(--line);background:#fff;padding:4px;border-radius:12px;cursor:pointer;width:104px;height:78px;overflow:hidden;transition:.2s}
.cert:hover{transform:translateY(-4px);border-color:var(--pink);box-shadow:0 14px 30px rgba(253,79,77,.16)}
.cert img{width:100%;height:100%;object-fit:cover;border-radius:8px;display:block}
.lb{position:fixed;inset:0;background:rgba(0,0,0,.86);display:none;align-items:center;justify-content:center;z-index:100;padding:20px}
.lb.open{display:flex}
.lb img{max-width:100%;max-height:92vh;border-radius:12px;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.lb-x{position:absolute;top:14px;inset-inline-end:16px;width:44px;height:44px;border-radius:50%;border:0;background:#fff;color:var(--ink);font-size:1.6rem;cursor:pointer;line-height:1}
@media (max-width:760px){.split.about{gap:40px}.about-media{max-width:320px}.cert{width:84px;height:64px}}

/* ---------- free trial band ---------- */
.trial-band{padding:0 0 100px;background:var(--pink-wash)}
.trial-box{position:relative;isolation:isolate;overflow:hidden;background:var(--black);color:#fff;border-radius:var(--r-card);padding:40px 44px;display:flex;align-items:center;justify-content:space-between;gap:30px;box-shadow:0 26px 60px rgba(35,36,37,.22)}
.trial-box .deco{width:320px;height:90px;top:-34px;inset-inline-end:-80px;transform:rotate(-14deg);opacity:.9;z-index:-1}
.trial-box .eyebrow{margin-bottom:8px}
.trial-box h2{font-size:clamp(1.5rem,3.2vw,2.15rem);margin:0;color:#fff}
.trial-box p{color:#cfd0d2;margin:10px 0 0;max-width:560px}
.trial-chips{display:flex;gap:8px 18px;flex-wrap:wrap;margin-top:16px}
.trial-chips span{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:.9rem;color:#fff}
.trial-chips i{color:var(--pink)}
.trial-box .btn{flex:none;padding:16px 26px;font-size:1.05rem}
.plans-trial{text-align:center;margin:40px 0 0;color:#cfd0d2;font-weight:700}
.plans-trial a{color:#fff;border-bottom:2px solid var(--pink);padding-bottom:2px;margin-inline-start:6px;white-space:nowrap;transition:.2s}
.plans-trial a:hover{color:var(--pink)}
@media (max-width:1000px){.trial-box{flex-direction:column;align-items:flex-start;padding:34px 30px}}
@media (max-width:760px){.trial-band{padding-bottom:64px}.trial-box{padding:30px 22px}.trial-box .btn{width:100%;justify-content:center}.trial-box .deco{display:none}}
