/* Wiklik public pages (wiklik.html, office-support.html). Extends legal.css. Mobile first, RTL-safe. */
.lang-wrap{position:relative}
.lang-btn{display:flex;align-items:center;gap:6px;min-height:36px;background:#1a1a1a;border:.5px solid #444;border-radius:20px;padding:5px 12px;cursor:pointer;font-size:13px;color:rgba(255,255,255,.9);user-select:none}
.lang-menu{position:absolute;top:calc(100% + 6px);inset-inline-end:0;background:#111;border:.5px solid #2a2a2a;border-radius:12px;padding:5px;min-width:220px;max-height:min(70vh,440px);overflow-y:auto;display:none;z-index:300;box-shadow:0 12px 32px rgba(0,0,0,.5)}
.lang-menu.open{display:block}
.lang-opt{display:flex;align-items:center;gap:8px;min-height:40px;padding:7px 10px;border-radius:7px;cursor:pointer;font-size:13px;color:#bbb}
.lang-opt:hover{background:#1a1a1a}.lang-opt.active{background:rgba(91,91,255,.12);color:#fff}
.flag-img{display:inline-block;width:20px;height:15px;border-radius:2px;object-fit:cover}
.flag-img.sm{width:18px;height:13px}
.lang-caret{font-size:9px;color:#666}

.wk-logo{display:inline-flex;align-items:center;gap:.5rem}
.wk-logo img{width:26px;height:26px;border-radius:6px}

.wk-hero{padding:2.5rem 0 2rem;border-bottom:.5px solid var(--border)}
.wk-hero .wk-brand{display:flex;align-items:center;gap:.75rem;margin-bottom:1rem}
.wk-hero .wk-brand img{width:56px;height:56px;border-radius:12px}
.wk-hero .wk-brand span{font-size:clamp(30px,7vw,44px);font-weight:900;letter-spacing:-1.5px;line-height:1}
.wk-hero h1{font-size:clamp(24px,5vw,38px);font-weight:800;letter-spacing:-.8px;line-height:1.15;margin-bottom:.85rem}
.wk-hero p{font-size:15px;color:var(--light);max-width:640px}
.wk-cta{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.5rem}
.wk-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-radius:22px;font-size:14px;font-weight:700;text-decoration:none}
.wk-btn:hover{text-decoration:none}
.wk-btn.primary{background:var(--white);color:var(--black)}
.wk-btn.primary:hover{background:var(--accent);color:var(--white)}
.wk-btn.ghost{border:.5px solid rgba(255,255,255,.4);color:var(--white)}
.wk-btn.ghost:hover{border-color:var(--accent);color:var(--accent)}

.wk-grid{display:grid;grid-template-columns:1fr;gap:.85rem;margin:1rem 0 .5rem}
.wk-card{background:var(--card);border:.5px solid var(--border);border-radius:12px;padding:1rem 1.15rem}
.wk-card h3{font-size:15px;font-weight:700;color:var(--white);margin:0 0 .35rem}
.wk-card p{font-size:14px;color:var(--light);margin:0}
.contact-card{background:var(--card);border:.5px solid var(--border);border-radius:12px;padding:1rem 1.25rem;margin:1rem 0}
.contact-card p{margin-bottom:.4rem}
.wk-table{width:100%;border-collapse:collapse;font-size:14px;margin:.75rem 0}
.wk-table th,.wk-table td{border-bottom:.5px solid var(--border);padding:.55rem .4rem;text-align:start;vertical-align:top;color:var(--light)}
.wk-table th{color:var(--white);font-weight:600;width:28%}
.wk-note{font-size:12px;color:var(--gray)}
.legal-body section{scroll-margin-top:72px}
/* legal.css .legal-body resets the side padding of .wrap: keep a 16px+ gutter on phones */
main.wrap.legal-body{padding-left:clamp(1rem,4vw,1.5rem);padding-right:clamp(1rem,4vw,1.5rem)}
.wk-foot{padding:1.75rem 0 2.5rem;border-top:.5px solid var(--border);font-size:12px;color:var(--gray)}
.wk-foot p{margin-bottom:.35rem}
.wk-foot a{color:var(--gray)}

@media(min-width:700px){
  .wk-grid{grid-template-columns:1fr 1fr}
  .wk-hero{padding:3.5rem 0 2.75rem}
}
@media(max-width:899px){
  .nav-links{display:none}
  .nav-right{margin-inline-start:auto}
}
@media(max-width:420px){
  .btn-login{display:none}
  .wk-table th{width:auto;display:block;border-bottom:0;padding-bottom:0}
  .wk-table td{display:block}
}

/* RTL (ar_sa): lang.js sets dir="rtl" on <html> for pages with data-m360m-rtl */
[dir="rtl"] .nav-links{margin-left:0;margin-right:auto}
[dir="rtl"] .nav-right{margin-left:0;margin-right:1rem}
[dir="rtl"] .legal-body ul,[dir="rtl"] .legal-body ol{padding-left:0;padding-right:1.4rem}
[dir="rtl"] .process-steps li{padding:.85rem 3rem .85rem 0;border-left:0;border-right:2px solid var(--border);margin-left:0;margin-right:1rem}
[dir="rtl"] .process-steps li:last-child{border-right-color:transparent}
[dir="rtl"] .process-steps li::before{left:auto;right:-1.05rem}
[dir="rtl"] .wk-hero .wk-brand span,[dir="rtl"] .wk-hero h1{letter-spacing:0}
.ltr{direction:ltr;unicode-bidi:embed}