/* La Shop à Agents — v3 Black Friday funnel. Mobile first. */
@font-face{font-family:Montserrat;font-weight:600;src:url(/assets/fonts/Montserrat-600.woff2) format('woff2');font-display:swap}
@font-face{font-family:Montserrat;font-weight:700;src:url(/assets/fonts/Montserrat-700.woff2) format('woff2');font-display:swap}
@font-face{font-family:Montserrat;font-weight:800;src:url(/assets/fonts/Montserrat-800.woff2) format('woff2');font-display:swap}
@font-face{font-family:Lato;font-weight:400;src:url(/assets/fonts/Lato-Regular.woff2) format('woff2');font-display:swap}
@font-face{font-family:Lato;font-weight:700;src:url(/assets/fonts/Lato-Bold.woff2) format('woff2');font-display:swap}
@font-face{font-family:Cairo;font-weight:400;src:url(/assets/fonts/Cairo-400.woff2) format('woff2');font-display:swap}
@font-face{font-family:Cairo;font-weight:700;src:url(/assets/fonts/Cairo-700.woff2) format('woff2');font-display:swap}
@font-face{font-family:Cairo;font-weight:900;src:url(/assets/fonts/Cairo-900.woff2) format('woff2');font-display:swap}
:root{--ink:#11131C;--ink2:#1B1E2B;--txt:#2A2E3D;--mut:#5D6375;--o:#F7821B;--o2:#FF9A3D;--od:#B5530C;--cream:#FFF6EC;--line:#ECE6DE;--y:#FFD84D;--g:#1F9D55;--r:16px;
--hf:Montserrat,system-ui,sans-serif;--bf:Lato,system-ui,-apple-system,'Segoe UI',sans-serif}
html[lang=ar]{--hf:Cairo,system-ui,sans-serif;--bf:Cairo,system-ui,sans-serif}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font:400 17px/1.6 var(--bf);color:var(--txt);background:#fff;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--od)}
.wrap{max-width:1160px;margin:0 auto;padding:0 16px}.narrow{max-width:820px}
h1,h2,h3{font-family:var(--hf);color:var(--ink);line-height:1.15;margin:0 0 .5em;letter-spacing:-.01em}
h2{font-size:clamp(27px,4.2vw,42px);font-weight:800;text-align:center}
h3{font-size:19px;font-weight:700}
.sec{padding:clamp(48px,7vw,88px) 0}.sec-sub{text-align:center;color:var(--mut);max-width:680px;margin:-6px auto 30px;font-size:18px}
.cream{background:var(--cream)}.dark{background:var(--ink);color:#D6D9E4}.dark h2,.dark h3{color:#fff}.dark .sec-sub{color:#AEB3C4}
/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:linear-gradient(180deg,var(--o2),var(--o));color:var(--ink);font:800 19px/1.2 var(--hf);text-decoration:none;border:0;border-radius:999px;padding:19px 34px;min-height:62px;cursor:pointer;box-shadow:0 10px 28px -10px rgba(247,130,27,.8),inset 0 -3px 0 rgba(0,0,0,.12);transition:transform .15s,box-shadow .15s;text-align:center}
.btn:hover{transform:translateY(-2px);box-shadow:0 16px 34px -10px rgba(247,130,27,.9),inset 0 -3px 0 rgba(0,0,0,.12)}
.btn:focus-visible{outline:3px solid var(--y);outline-offset:3px}
.btn.block{width:100%}.btn.sm{padding:12px 22px;min-height:48px;font-size:16px}
.btn.ghost{background:transparent;color:#fff;border:2px solid var(--o);box-shadow:none}
.cta-wrap{text-align:center;margin-top:34px}.cta-wrap .btn{width:100%;max-width:460px;animation:pulse 2.6s ease-in-out infinite}
.cta-sub{font-size:14px;color:var(--mut);margin:10px 0 0}.dark .cta-sub{color:#AEB3C4}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.025)}}
@media (prefers-reduced-motion:reduce){.cta-wrap .btn{animation:none}html{scroll-behavior:auto}}
.linklike{background:none;border:0;color:inherit;text-decoration:underline;cursor:pointer;font:inherit;padding:0}
/* BF bar */
.bf-bar{background:#000;color:#fff;font-size:14px;position:relative;z-index:5}
.bf-bar .wrap{display:flex;align-items:center;justify-content:center;gap:10px 14px;flex-wrap:wrap;padding-top:9px;padding-bottom:9px;text-align:center}
.bf-tag{background:var(--o);color:#000;font:800 12px/1 var(--hf);letter-spacing:.08em;padding:6px 9px;border-radius:6px}
.bf-txt b{color:var(--o2)}.bf-cd{display:flex;align-items:center;gap:8px}.bf-cd small{color:#AEB3C4}
/* countdown */
.cd{display:flex;gap:8px;justify-content:center;direction:ltr}
.cd span{background:var(--ink2);border:1px solid #2F3445;border-radius:10px;min-width:58px;padding:7px 4px;text-align:center;color:#fff}
.cd b{display:block;font:800 24px/1 var(--hf);font-variant-numeric:tabular-nums}.cd i{font-style:normal;font-size:11px;color:#AEB3C4;text-transform:uppercase;letter-spacing:.06em}
.cd.mini{gap:4px}.cd.mini span{min-width:0;padding:3px 6px;border-radius:6px;display:flex;gap:2px;align-items:baseline;background:#1D2030}
.cd.mini b{font-size:14px;display:inline}.cd.mini i{font-size:10px}
.cd.done{display:none}
/* hero */
.hero{background:radial-gradient(1000px 520px at 85% 10%,rgba(247,130,27,.28),transparent 60%),radial-gradient(700px 400px at 0% 100%,rgba(108,92,231,.22),transparent 60%),var(--ink);color:#D6D9E4;padding:22px 0 34px;overflow:hidden}
.hero-grid{display:grid;gap:26px;align-items:center}
.hero .logo{height:44px;width:auto;margin-bottom:18px;background:#fff;border-radius:12px;padding:6px 10px}
.eyebrow{display:inline-block;color:var(--o2);font:800 13px/1 var(--hf);letter-spacing:.12em;text-transform:uppercase;margin:0 0 12px;border:1px solid rgba(247,130,27,.45);padding:8px 12px;border-radius:999px}
html[lang=ar] .eyebrow{letter-spacing:0}
.hero h1{color:#fff;font-size:clamp(31px,4.3vw,52px);font-weight:800;margin-bottom:16px}
mark{background:linear-gradient(transparent 58%,rgba(247,130,27,.85) 58%);color:inherit;padding:0 .08em}
.hero .lead{font-size:clamp(17px,2vw,20px);color:#C9CDDA;margin:0 0 22px;max-width:580px}
.price-card{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:18px;backdrop-filter:blur(6px);max-width:520px}
.pc-top{display:flex;justify-content:space-between;gap:10px;font-size:14px;align-items:center}
.pc-lbl{color:#fff;font-weight:700}.pc-next{background:rgba(255,216,77,.12);color:var(--y);padding:4px 10px;border-radius:999px;font-weight:700;font-size:13px}
.pc-price{display:flex;align-items:baseline;gap:12px;margin:6px 0 12px}.pc-price b{font:800 64px/1 var(--hf);color:#fff}.pc-price span{color:#C9CDDA;font-size:15px}
.price-card .cta-wrap{margin-top:14px}.price-card .btn{max-width:none}
.pay{display:flex;gap:6px;justify-content:center;flex-wrap:wrap;margin-top:12px}
.pay span{font:700 11px/1 system-ui;border:1px solid rgba(127,127,127,.4);border-radius:5px;padding:5px 7px;opacity:.8}
.hero-visual{position:relative}
.hero-visual>img:first-child{border-radius:18px;background:#fff;box-shadow:0 30px 80px -20px rgba(0,0,0,.7);padding:10px}
.hero-visual .face{position:absolute;width:34%;bottom:-34px;inset-inline-end:-8px;filter:drop-shadow(0 20px 30px rgba(0,0,0,.5));pointer-events:none}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:40px}
.stats div{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:14px;padding:12px;text-align:center}
.stats b{display:block;font:800 26px/1.1 var(--hf);color:var(--o2)}.stats span{font-size:13px;color:#AEB3C4}
.stats div:last-child{grid-column:1/-1}
/* pains */
.pains{display:grid;gap:14px}.pain{background:#FAFAFC;border:1px solid var(--line);border-radius:var(--r);padding:20px}
.pain .em{font-size:30px}.pain h3{margin:.3em 0 .2em}.pain p{margin:0;color:var(--mut)}
.turn{text-align:center;font:700 clamp(19px,2.4vw,24px)/1.35 var(--hf);color:var(--ink);margin:30px auto 0;max-width:720px}
.turn::before{content:'';display:block;width:60px;height:4px;border-radius:4px;background:var(--o);margin:0 auto 18px}
/* steps */
.steps{display:grid;gap:16px}.step{position:relative;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px;box-shadow:0 10px 30px -18px rgba(17,19,28,.35)}
.step img{border-radius:10px;border:1px solid var(--line);aspect-ratio:10/7;object-fit:cover;object-position:top;margin-bottom:12px}
.step .n{position:absolute;top:-12px;inset-inline-start:-8px;width:40px;height:40px;border-radius:50%;background:var(--o);color:var(--ink);font:800 19px/40px var(--hf);text-align:center;box-shadow:0 6px 14px -4px rgba(247,130,27,.8)}
.step p{margin:0;color:var(--mut);font-size:15px}
/* products */
.prods{display:grid;gap:16px}
.prod{background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);display:flex;flex-direction:column}
.pimg{position:relative;background:#F4F1EC}.pimg img{aspect-ratio:1600/837;object-fit:cover}
.pn{position:absolute;top:10px;inset-inline-start:10px;background:var(--ink);color:#fff;font:800 15px/34px var(--hf);width:34px;height:34px;text-align:center;border-radius:50%}
.pt{padding:14px 16px 16px}.pt h3{margin:0 0 4px}.pt p{margin:0 0 10px;color:var(--mut);font-size:15px}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chips em{font-style:normal;font-size:12px;font-weight:700;background:var(--cream);color:var(--od);padding:4px 9px;border-radius:999px}
/* gallery + tool */
.gal{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.gal figure{margin:0;background:#fff;border-radius:12px;overflow:hidden}.gal img{width:100%;height:100%;object-fit:cover;object-position:top;aspect-ratio:4/3}
.gal figure:first-child{grid-column:1/-1}
.tool{display:grid;gap:20px;align-items:center;margin-top:40px;background:var(--ink2);border:1px solid #2F3445;border-radius:20px;padding:20px}
.tool img{border-radius:12px}.tool p{color:#C9CDDA}
/* compare */
.tbl{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--r);border:1px solid var(--line)}
table{width:100%;border-collapse:collapse;min-width:560px;font-size:15px}
th,td{padding:14px 12px;border-bottom:1px solid var(--line);text-align:center}tbody th{text-align:start;font-weight:700;color:var(--ink)}
thead th{font:800 14px/1.2 var(--hf);color:var(--mut);background:#FAFAFC}
thead th:nth-child(2),td.us{background:#FFF1E3;color:var(--ink);font-weight:800}thead th:nth-child(2){color:var(--od)}
/* founder */
.founder{display:grid;gap:26px;align-items:center}.founder img{border-radius:20px;box-shadow:0 20px 50px -24px rgba(17,19,28,.5)}
.founder h2{text-align:start}.sign{font-family:var(--hf);font-weight:700;color:var(--od)}
/* fit */
.fit{display:grid;gap:16px}.fit>div{border-radius:var(--r);padding:22px;border:1px solid var(--line)}
.fit ul{list-style:none;padding:0;margin:0}.fit li{padding:7px 0 7px 32px;position:relative}
html[dir=rtl] .fit li{padding:7px 32px 7px 0}
.fit li::before{position:absolute;inset-inline-start:0;top:7px;width:22px;height:22px;border-radius:50%;font:800 13px/22px system-ui;text-align:center}
.yes{background:#F1FBF5}.yes li::before{content:'✓';background:var(--g);color:#fff}
.no{background:#FDF3F3}.no li::before{content:'✕';background:#D64545;color:#fff}
/* guarantee */
.guarantee{background:linear-gradient(180deg,#fff,var(--cream))}
.g{display:grid;gap:22px;align-items:center;max-width:900px}.g h2{text-align:start}
.seal{width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,var(--o2),var(--od));display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;margin:auto;box-shadow:0 0 0 8px #fff,0 0 0 10px var(--o),0 20px 40px -12px rgba(181,83,12,.6)}
.seal b{font:800 52px/1 var(--hf)}.seal span{font:800 13px/1 var(--hf);letter-spacing:.12em}
.seal.sm{width:64px;height:64px;box-shadow:0 0 0 4px #fff,0 0 0 5px var(--o);flex:none}.seal.sm b{font-size:24px}
/* offer box */
.offer{max-width:640px;margin:auto;background:linear-gradient(180deg,#1E2232,#151826);border:2px solid var(--o);border-radius:24px;padding:28px 20px;text-align:center;box-shadow:0 30px 90px -30px rgba(247,130,27,.55)}
.offer .bf-tag{display:inline-block;margin-bottom:12px}
.ticks{list-style:none;padding:0;margin:18px 0;text-align:start}
.ticks li{padding:7px 0 7px 32px;position:relative;border-bottom:1px dashed rgba(127,127,127,.25)}
html[dir=rtl] .ticks li{padding:7px 32px 7px 0}
.ticks li::before{content:'✓';position:absolute;inset-inline-start:0;top:8px;width:22px;height:22px;border-radius:50%;background:var(--o);color:var(--ink);font:800 13px/22px system-ui;text-align:center}
.offer .ticks li{color:#fff}
.pc-price.big{justify-content:center;flex-direction:column;align-items:center;gap:4px}.pc-price.big b{font-size:78px}.pc-price.big span{color:var(--y);font-weight:700}
.note{font-size:13px;color:#AEB3C4;margin-top:14px}
/* faq */
.faq details{border:1px solid var(--line);border-radius:12px;margin-bottom:10px;background:#fff}
.faq summary{cursor:pointer;padding:16px 46px 16px 18px;font:700 17px/1.35 var(--hf);color:var(--ink);list-style:none;position:relative}
html[dir=rtl] .faq summary{padding:16px 18px 16px 46px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';position:absolute;inset-inline-end:18px;top:12px;font-size:26px;color:var(--o);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}.faq p{padding:0 18px 16px;margin:0;color:var(--mut)}
.ps{background:#FFFBEA;border-inline-start:4px solid var(--y);padding:16px 18px;border-radius:8px;margin-top:30px}
/* footer */
.ft{background:var(--ink);color:#8E94A8;font-size:13px;padding:36px 0 120px;text-align:center}
.ft img{margin:0 auto 14px;background:#fff;border-radius:10px;padding:5px 9px;height:40px;width:auto}.ft a{color:#C9CDDA}.ft nav{margin-bottom:10px}.ft .sm{max-width:760px;margin:8px auto}
/* sticky */
.sticky{position:fixed;left:0;right:0;bottom:0;z-index:40;background:rgba(17,19,28,.97);color:#fff;padding:10px 14px calc(10px + env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;gap:10px;transform:translateY(110%);transition:transform .3s;box-shadow:0 -10px 30px rgba(0,0,0,.25)}
.sticky.on{transform:none}.sticky>div{display:flex;flex-direction:column;gap:4px;font-size:14px}.sticky .cd{justify-content:flex-start}
/* popup */
.pop{position:fixed;inset:0;z-index:60;background:rgba(10,11,18,.72);display:flex;align-items:center;justify-content:center;padding:16px}
.pop[hidden]{display:none}
.pop-in{position:relative;background:#fff;border-radius:22px;max-width:440px;width:100%;padding:24px 22px;text-align:center;max-height:92vh;overflow:auto;animation:popin .25s ease-out}
@keyframes popin{from{transform:translateY(20px);opacity:0}}
.pop-in img{border-radius:12px;margin-bottom:14px;border:1px solid var(--line)}
.pop-in h3{font-size:24px}.pop-in .x{position:absolute;top:8px;inset-inline-end:10px;background:none;border:0;font-size:30px;line-height:1;color:var(--mut);cursor:pointer}
#lead input{width:100%;font:inherit;padding:14px;border:1.5px solid #D9D4CC;border-radius:12px;margin-bottom:10px}
#lead input:focus{outline:none;border-color:var(--o);box-shadow:0 0 0 3px rgba(247,130,27,.2)}
#lead .btn{width:100%;font-size:17px;min-height:56px;padding:14px}
.hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important}
.legal{font-size:11.5px;color:var(--mut);line-height:1.45;margin:10px 0 6px}
.err{color:#C0392B;font-size:14px;min-height:1px;margin:6px 0 0}
.pop .linklike{font-size:13px;color:var(--mut)}
/* cookie */
#cookie{position:fixed;left:12px;right:12px;bottom:12px;z-index:70;display:none}
#cookie.show{display:block}
#cookie .in{max-width:760px;margin:auto;background:#fff;border:1px solid var(--line);border-radius:14px;padding:14px 16px;box-shadow:0 20px 50px -10px rgba(0,0,0,.35);display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:13.5px}
#cookie p{margin:0;flex:1 1 300px}#cookie .bt{display:flex;gap:8px}
#cookie button{font:700 14px var(--hf);border-radius:999px;padding:10px 18px;cursor:pointer;border:2px solid var(--o)}
#cookie .ref{background:#fff;color:var(--od)}#cookie .acc{background:var(--o);color:var(--ink)}
/* checkout */
.co{background:#F6F4F0}.co .bf-bar{position:sticky;top:0;z-index:30}
.co-grid{display:grid;gap:22px;padding-top:22px;padding-bottom:40px}
.co .logo{height:40px;width:auto;margin-bottom:14px}.co h1{font-size:clamp(28px,4vw,38px);font-weight:800}
.co .sec-sub{text-align:start;margin:0 0 16px}
.card{background:#fff;border-radius:18px;padding:20px;box-shadow:0 20px 50px -30px rgba(17,19,28,.45);border:1px solid var(--line)}
.fg{display:grid;gap:12px;margin-bottom:16px}.fg label{font:700 14px var(--hf);color:var(--ink)}
.fg input{display:block;width:100%;margin-top:6px;font:400 17px var(--bf);padding:14px;border:1.5px solid #D9D4CC;border-radius:12px}
.fg input:focus{outline:none;border-color:var(--o);box-shadow:0 0 0 3px rgba(247,130,27,.2)}
.fg small{display:block;font:400 12.5px var(--bf);color:var(--mut);margin-top:4px}
.bump{display:block;border:2px dashed var(--o);background:#FFF9F2;border-radius:14px;margin:12px 0;cursor:pointer;overflow:hidden}
.bump-h{display:flex;align-items:center;gap:10px;background:#FFE9D2;padding:12px 14px}
.bump-h input{width:22px;height:22px;accent-color:var(--od);flex:none}
.flag{font:800 15px var(--hf);color:#C0392B;flex:1;animation:blink 1.6s ease-in-out infinite}
@keyframes blink{50%{opacity:.55}}
.bp{font:800 16px var(--hf);color:var(--ink)}
.bump-b{display:grid;grid-template-columns:96px 1fr;gap:12px;padding:12px 14px;align-items:start}
.bump-b img{border-radius:8px}.bump-b p{margin:0;font-size:14.5px;line-height:1.5}
.bump.on{border-style:solid;background:#FFF3E6}
.summary{background:#FAFAFC;border-radius:12px;padding:12px 14px;margin:16px 0;font-size:15px}
.summary .ln{display:flex;justify-content:space-between;gap:10px;padding:4px 0}.summary .tot{border-top:1px solid var(--line);margin-top:6px;padding-top:8px;font:800 18px var(--hf);color:var(--ink)}
.summary small{color:var(--mut)}
.ck{display:flex;gap:10px;align-items:flex-start;font-size:14px;margin:8px 0 14px;color:var(--mut);cursor:pointer}.ck input{margin-top:3px;width:18px;height:18px;accent-color:var(--od)}
.terms{font-size:12.5px;color:var(--mut);text-align:center;margin:10px 0 0}.co .pay span{color:var(--txt)}
.co-side{background:#fff;border-radius:18px;padding:18px;border:1px solid var(--line);align-self:start}
.co-side>img{border-radius:12px;margin-bottom:12px}.trust{list-style:none;padding:0;margin:14px 0;font-size:14px}.trust li{padding:6px 0}
.mini-g{display:flex;gap:14px;align-items:center;background:var(--cream);border-radius:12px;padding:12px;font-size:13.5px}.mini-g p{margin:0}
.co .ft{padding-bottom:40px}
/* desktop */
@media (min-width:760px){
 .stats{grid-template-columns:repeat(5,1fr)}.stats div:last-child{grid-column:auto}
 .pains{grid-template-columns:repeat(3,1fr)}.steps{grid-template-columns:repeat(2,1fr)}
 .prods{grid-template-columns:repeat(2,1fr)}.gal{grid-template-columns:repeat(3,1fr)}.gal figure:first-child{grid-column:span 2;grid-row:span 2}
 .tool{grid-template-columns:1.1fr 1fr;padding:28px}.founder{grid-template-columns:1fr 1.1fr}.fit{grid-template-columns:1fr 1fr}.g{grid-template-columns:180px 1fr}
 .sticky{display:none}.ft{padding-bottom:40px}
}
@media (min-width:1000px){
 .hero{padding:26px 0 46px}.hero-grid{grid-template-columns:1.02fr 1fr;gap:46px}.steps{grid-template-columns:repeat(4,1fr)}.prods{grid-template-columns:repeat(3,1fr)}
 .co-grid{grid-template-columns:1.25fr 1fr;gap:32px;padding-top:30px}.co-side{position:sticky;top:70px}
}
@media (max-width:999px){.hero-visual{margin:10px 0 0}.hero-visual .face{width:30%;bottom:-20px}}
@media (max-width:600px){.bf-bar .bf-tag{display:none}.bf-bar .wrap{gap:4px 10px;padding-top:7px;padding-bottom:7px}.bf-txt{font-size:12.5px}}
@media (max-width:420px){.pc-price b{font-size:54px}.cd span{min-width:52px}.bf-bar{font-size:13px}.bf-cd small{display:none}}
