/* Landing page only — everything else comes from /shared/css/ds.css */
.hero { padding-block:clamp(2rem,6vw,5rem) var(--s16); position:relative; overflow:hidden; }
.hero::before { content:''; position:absolute; inset:-20% -10% auto auto; width:60vw; height:60vw; max-width:760px; max-height:760px; background:radial-gradient(closest-side,rgba(59,130,246,.18),transparent); pointer-events:none; }
[dir="rtl"] .hero::before { inset:-20% auto auto -10%; }
.hero__grid { display:grid; grid-template-columns:1.1fr .9fr; gap:var(--s12); align-items:center; position:relative; }
@media (max-width:900px) { .hero__grid { grid-template-columns:1fr; } .hero__visual { display:none; } }
@media (max-width:600px) { .hero .row .btn { flex:1 1 100%; } .trust { margin-top:var(--s2); } }
.trust { list-style:none; padding:0; margin:0; display:flex; flex-wrap:wrap; gap:var(--s2) var(--s6); color:var(--text-2); font-size:.92rem; }
.trust li span[aria-hidden] { color:var(--success); font-weight:800; margin-inline-end:6px; }

.mock { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-xl); padding:var(--s6); box-shadow:var(--shadow-lg); display:grid; gap:var(--s4); transform:rotate(1.5deg); }
[dir="rtl"] .mock { transform:rotate(-1.5deg); }
.mock__bar { display:flex; align-items:center; gap:var(--s3); } .mock__bar .badge { margin-inline-start:auto; }
.mock__row { display:flex; justify-content:space-between; gap:var(--s4); padding-block:var(--s3); border-top:1px solid var(--border); font-size:.92rem; }
.mock__slots { display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s2); } .mock__slots span { text-align:center; padding:10px 0; border:1px solid var(--border-strong); border-radius:var(--r-sm); font-weight:600; font-size:.9rem; }
.mock__slots .on { background:var(--primary); border-color:var(--primary); color:#fff; } .mock__slots .off { opacity:.4; text-decoration:line-through; }

.ico-box { width:48px; height:48px; border-radius:var(--r-md); background:var(--primary-soft); color:var(--primary-soft-text); display:flex; align-items:center; justify-content:center; font-size:1.4rem; font-weight:800; margin-bottom:var(--s4); font-family:var(--font-display); }
.card .chips { margin-top:var(--s4); } .card p { margin-top:var(--s2); }

.steps { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:var(--s8); counter-reset:s; }
@media (max-width:860px) { .steps { grid-template-columns:1fr; } }
.steps li { position:relative; padding:var(--s6); background:var(--bg); border:1px solid var(--border); border-radius:var(--r-lg); } .steps h3 { margin-block:var(--s3) var(--s2); }
.steps__n { width:40px; height:40px; border-radius:50%; background:var(--primary); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; font-family:var(--font-display); }

.free-card { display:flex; align-items:center; justify-content:space-between; gap:var(--s6); flex-wrap:wrap; }
.packs .pack { display:flex; flex-direction:column; gap:var(--s3); } .pack__name { font-weight:700; } .pack__price { font-family:var(--font-display); font-size:2rem; font-weight:800; letter-spacing:-.03em; }
.pack__price small { font-size:.9rem; font-weight:500; color:var(--text-3); letter-spacing:0; }
.pack__meta { font-size:.85rem; color:var(--text-3); min-height:2.6em; } .pack .btn { margin-top:auto; }
.pack--best { border-color:var(--primary); box-shadow:0 0 0 1px var(--primary); position:relative; }
.pack--best::before { content:attr(data-flag); position:absolute; top:-12px; inset-inline-start:var(--s5); background:var(--primary); color:#fff; font-size:.72rem; font-weight:700; padding:2px 10px; border-radius:var(--r-full); }

.about { display:grid; grid-template-columns:1.4fr .8fr; gap:var(--s12); align-items:center; }
@media (max-width:860px) { .about { grid-template-columns:1fr; } }
.about__card { display:grid; justify-items:center; gap:var(--s3); padding:var(--s10); text-align:center; }

.faq { display:grid; gap:var(--s3); } .faq details { background:var(--surface); border:1px solid var(--border); border-radius:var(--r-md); }
.faq summary { cursor:pointer; padding:var(--s4) var(--s5); font-weight:600; list-style:none; display:flex; justify-content:space-between; gap:var(--s4); }
.faq summary::-webkit-details-marker { display:none; } .faq summary::after { content:'+'; font-size:1.4rem; line-height:1; color:var(--text-3); transition:transform .2s; } .faq details[open] summary::after { transform:rotate(45deg); }
.faq details p { padding:0 var(--s5) var(--s5); color:var(--text-2); }

.cta { text-align:center; padding:clamp(2rem,6vw,4.5rem) var(--s6); background:linear-gradient(135deg,var(--primary-soft),var(--surface)); display:grid; gap:var(--s4); justify-items:center; } .cta .t-lead { max-width:46ch; }

.footer { border-top:1px solid var(--border); background:var(--surface); padding-block:var(--s12) var(--s6); } .footer a:not(.logo) { display:block; padding-block:7px; color:var(--text-2); font-size:.92rem; }
.card a.t-small { display:inline-block; padding-block:8px; } .footer .label { color:var(--text); }
.footer__grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:var(--s8); } @media (max-width:860px) { .footer__grid { grid-template-columns:1fr 1fr; } }
.footer__bottom { margin-top:var(--s10); padding-top:var(--s5); border-top:1px solid var(--border); }
