/* Kontra+ site stylesheet, rebuilt 12 Oct 2026 to the brand spec (revised 23 Sep 2026).
   Layout is carried by paper and ink. Seal green and redline are semantic only: green marks
   what is live or settled, red only what is flagged. Brass appears once per page (the hero
   eyebrow) and is never a fill. Square corners, no gradients, no shadows. Archivo for Latin,
   IBM Plex Sans Arabic for Arabic, never smaller than the Latin, never letter spaced. */

:root{
  --bg:#F7F5EF; --paper2:#EFECE2; --panel:#FFFFFF; --ink:#0E1A16; --muted:#4A4740;
  --line:#DCD8C9; --line2:#C3BFAE; --seal:#0F5C46; --red:#8C1D1D; --red-soft:#F5E6E2;
  --brass:#9A7431; --btn:#0E1A16; --btn-ink:#F7F5EF;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0B120F; --paper2:#101815; --panel:#131C18; --ink:#E9ECEF; --muted:#C3C8CD;
    --line:#26332C; --line2:#33473D; --seal:#6FC79B; --red:#E07F88; --red-soft:#2A1418;
    --brass:#C9963C; --btn:#E9ECEF; --btn-ink:#0B120F; color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0B120F; --paper2:#101815; --panel:#131C18; --ink:#E9ECEF; --muted:#C3C8CD;
  --line:#26332C; --line2:#33473D; --seal:#6FC79B; --red:#E07F88; --red-soft:#2A1418;
  --brass:#C9963C; --btn:#E9ECEF; --btn-ink:#0B120F; color-scheme:dark;
}

*{box-sizing:border-box;border-radius:0}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Archivo,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:17px;line-height:1.62;font-weight:400;-webkit-font-smoothing:antialiased;overflow-x:hidden}
[dir="rtl"] body,body[dir="rtl"]{font-family:"IBM Plex Sans Arabic",Archivo,"Segoe UI",Tahoma,sans-serif;font-size:18px;line-height:1.85}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.wrap{max-width:74rem;margin:0 auto;padding:0 1.5rem}
.narrow{max-width:50rem}
@media(max-width:640px){.wrap{padding:0 1rem}}

h1,h2,h3,h4{margin:0;line-height:1.15;letter-spacing:-.02em}
h1{font-size:clamp(2.05rem,4.6vw,3.35rem);font-weight:700}
h2{font-size:clamp(1.55rem,3vw,2.2rem);font-weight:700}
h3{font-size:1.14rem;font-weight:600;letter-spacing:-.01em}
[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3,[dir="rtl"] h4{letter-spacing:0;line-height:1.4}
[dir="rtl"] h1{font-size:clamp(1.95rem,4.2vw,3rem)}
p{margin:.85rem 0}
.lede{font-size:1.16rem;color:var(--muted);max-width:42rem}
.eyebrow{font-size:.72rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.eyebrow.brass{color:var(--brass)}
[dir="rtl"] .eyebrow{letter-spacing:0;text-transform:none;font-size:.9rem}
.muted{color:var(--muted)}
.small{font-size:.86rem}
.mono{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Consolas,monospace}
.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}

section{padding:5.2rem 0;border-top:1px solid var(--line)}
section.first{border-top:0}
.sechead{max-width:46rem;margin-bottom:2.4rem}
.sechead h2{margin-top:.7rem}
@media(max-width:640px){section{padding:3.6rem 0}}

/* ---------- header ---------- */
.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip:focus{width:auto;height:auto;clip:auto;inset-inline-start:1rem;top:1rem;background:var(--panel);padding:.5rem 1rem;z-index:99}
header.site{position:sticky;top:0;z-index:40;background:var(--bg);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:1.4rem;height:4.1rem}
.logo{display:flex;align-items:center;gap:.55rem;font-weight:700;letter-spacing:-.02em;font-size:1.16rem;text-decoration:none;flex:none}
.logo svg{width:1.9rem;height:1.9rem;display:block}
[dir="rtl"] .logo{direction:ltr}
nav.main{display:flex;gap:1.35rem;align-items:center;margin-inline-start:auto;font-size:.92rem}
nav.main a{text-decoration:none;color:var(--muted);font-weight:500}
nav.main a:hover,nav.main a[aria-current="page"]{color:var(--ink)}
nav.main a.btn-p,nav.main a.btn-p:hover{color:var(--btn-ink)}
nav.main a[aria-current="page"]{text-decoration:underline;text-underline-offset:.4rem}
.lang{font-weight:600!important;color:var(--ink)!important}
details.menu{display:none;margin-inline-start:auto}
details.menu summary{list-style:none;cursor:pointer;border:1px solid var(--line);padding:.45rem .8rem;font-size:.9rem;font-weight:600}
details.menu summary::-webkit-details-marker{display:none}
details.menu .drop{position:absolute;inset-inline:0;top:4.1rem;background:var(--bg);border-bottom:1px solid var(--line);padding:.6rem 1rem 1.2rem}
details.menu .drop a{display:block;padding:.65rem 0;border-bottom:1px solid var(--line);text-decoration:none;font-weight:500}
details.menu .drop a:last-child{border-bottom:0}
@media(max-width:980px){nav.main .opt{display:none}}
@media(max-width:720px){nav.main{display:none}details.menu{display:block}}

/* ---------- buttons ---------- */
.btn{display:inline-block;padding:.8rem 1.35rem;font-weight:600;font-size:.95rem;text-decoration:none;border:1px solid var(--line2);
  color:var(--ink);background:transparent;cursor:pointer;line-height:1.3;font-family:inherit}
.btn-p{background:var(--btn);color:var(--btn-ink);border-color:var(--btn)}
.btn-p:hover{opacity:.9}
.btn-s:hover{border-color:var(--ink)}
.btn.sm{padding:.55rem 1rem;font-size:.88rem}
.btns{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:2rem;align-items:center}
.textlink{font-weight:600;text-decoration:underline;text-underline-offset:.25rem}

/* ---------- hero ---------- */
.hero{padding:4.4rem 0 3.6rem}
.hero-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:3rem;align-items:center}
.hero h1{margin-top:1rem}
.hero .lede{margin-top:1.3rem}
.second{margin-top:1.5rem;padding-top:1.1rem;border-top:1px solid var(--line);font-size:.95rem;color:var(--muted);max-width:34rem}
.second a{color:var(--ink)}
@media(max-width:1080px){.hero-grid{grid-template-columns:minmax(0,1fr);gap:2.4rem}}
@media(max-width:640px){.hero{padding:2.8rem 0 2.6rem}}

/* product pictures */
figure.shot{margin:0;border:1px solid var(--line);background:var(--panel)}
figure.shot .cap,figcaption{font-size:.8rem;color:var(--muted);padding:.6rem .85rem;border-top:1px solid var(--line);line-height:1.5}
figure.shot img{width:100%}
.phone{max-width:20rem}

/* ---------- metric strip ---------- */
.metrics{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.metric{padding:1.6rem 1.4rem;border-inline-start:1px solid var(--line);text-align:center}
.metric:first-child{border-inline-start:0}
.metric b{display:block;font-size:2.1rem;font-weight:700;letter-spacing:-.03em;line-height:1.1}
.metric span{display:block;font-size:.86rem;color:var(--muted);margin-top:.35rem}
@media(max-width:860px){.metrics{grid-template-columns:1fr 1fr}.metric:nth-child(3){border-inline-start:0}.metric:nth-child(n+3){border-top:1px solid var(--line)}}

/* ---------- cards and grids ---------- */
.grid{display:grid;gap:0;border:1px solid var(--line);background:var(--panel)}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.cell{padding:1.6rem 1.5rem;border-inline-start:1px solid var(--line)}
.g2 .cell:nth-child(2n+1),.g3 .cell:nth-child(3n+1),.g4 .cell:nth-child(4n+1){border-inline-start:0}
.g2 .cell:nth-child(n+3),.g3 .cell:nth-child(n+4),.g4 .cell:nth-child(n+5){border-top:1px solid var(--line)}
.cell .k{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.74rem;color:var(--muted)}
.cell h3{margin:.55rem 0 .45rem}
.cell p{margin:0;font-size:.95rem;color:var(--muted)}
@media(max-width:900px){
  .g3,.g4{grid-template-columns:1fr 1fr}
  .g3 .cell,.g4 .cell{border-inline-start:1px solid var(--line);border-top:0}
  .g3 .cell:nth-child(2n+1),.g4 .cell:nth-child(2n+1){border-inline-start:0}
  .g3 .cell:nth-child(n+3),.g4 .cell:nth-child(n+3){border-top:1px solid var(--line)}
}
@media(max-width:640px){
  .g2,.g3,.g4{grid-template-columns:1fr}
  .grid .cell{border-inline-start:0!important;border-top:1px solid var(--line)!important}
  .grid .cell:first-child{border-top:0!important}
}
.live{color:var(--seal);font-weight:600}
.flag{color:var(--red);font-weight:600}

/* ---------- product tour ---------- */
.tour-tabs{display:flex;gap:0;border-bottom:1px solid var(--line);margin-bottom:1.4rem;overflow-x:auto;scrollbar-width:none}
.tour-tabs::-webkit-scrollbar{display:none}
.tour-tabs button{background:none;border:0;border-bottom:2px solid transparent;padding:.75rem 1.1rem;margin-bottom:-1px;cursor:pointer;
  font:inherit;font-size:.95rem;color:var(--muted);white-space:nowrap}
.tour-tabs button[aria-selected="true"]{color:var(--ink);border-bottom-color:var(--ink);font-weight:600}
.tour-panel[hidden]{display:none}
.tour-panel .tp{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:2.4rem;align-items:start}
.tour-panel .tp p{color:var(--muted)}
@media(max-width:980px){.tour-panel .tp{grid-template-columns:minmax(0,1fr);gap:1.4rem}}

/* ---------- plans ---------- */
.plans{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);background:var(--panel)}
.plan{padding:1.8rem 1.6rem;border-inline-start:1px solid var(--line);display:flex;flex-direction:column}
.plan:first-child{border-inline-start:0}
.plan.featured{outline:2px solid var(--ink);outline-offset:-2px;position:relative}
.plan .tag{position:absolute;top:-.8rem;inset-inline-start:1.4rem;background:var(--ink);color:var(--bg);font-size:.68rem;font-weight:600;
  letter-spacing:.14em;text-transform:uppercase;padding:.22rem .6rem}
[dir="rtl"] .plan .tag{letter-spacing:0;font-size:.82rem}
.plan .kind{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:600}
[dir="rtl"] .plan .kind{letter-spacing:0;font-size:.86rem}
.plan h3{font-size:1.45rem;margin:.5rem 0 .2rem}
.price{font-size:2.15rem;font-weight:700;letter-spacing:-.03em;line-height:1.1;margin-top:.9rem}
.price small{font-size:.95rem;font-weight:500;color:var(--muted);letter-spacing:0}
.per{font-size:.88rem;color:var(--muted);margin-top:.35rem}
.plan ul{list-style:none;padding:0;margin:1.3rem 0 1.5rem;font-size:.93rem;flex:1}
.plan li{padding:.5rem 0 .5rem 1.3rem;border-top:1px solid var(--line);position:relative}
[dir="rtl"] .plan li{padding:.5rem 1.3rem .5rem 0}
.plan li::before{content:"";position:absolute;inset-inline-start:0;top:1.05rem;width:.55rem;height:1px;background:var(--ink)}
.plan .btn{text-align:center}
@media(max-width:900px){.plans{grid-template-columns:1fr}.plan{border-inline-start:0;border-top:1px solid var(--line)}.plan:first-child{border-top:0}}

.oneoff{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:2rem;align-items:center;border:1px solid var(--line);background:var(--panel);padding:1.8rem 1.6rem}
@media(max-width:900px){.oneoff{grid-template-columns:minmax(0,1fr)}}

/* ---------- tables ---------- */
.tablewrap{overflow-x:auto;border:1px solid var(--line);background:var(--panel)}
table{width:100%;border-collapse:collapse;font-size:.93rem}
th,td{border-bottom:1px solid var(--line);padding:.8rem .9rem;text-align:start;vertical-align:top}
tr:last-child td{border-bottom:0}
th{font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);font-weight:600;white-space:nowrap}
[dir="rtl"] th{letter-spacing:0;font-size:.84rem;text-transform:none}
td.num{font-family:"JetBrains Mono",ui-monospace,monospace;white-space:nowrap}
.tier1{color:var(--red);font-weight:600;white-space:nowrap}
.tier2{font-weight:600;white-space:nowrap}
.tier3{color:var(--muted);font-weight:600;white-space:nowrap}

/* ---------- specimen ---------- */
.specimen{border:1px solid var(--line);background:var(--panel);margin:2rem 0}
.specimen .head{padding:.75rem 1.1rem;border-bottom:1px solid var(--line);font-size:.74rem;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);font-weight:600;background:var(--paper2)}
[dir="rtl"] .specimen .head{letter-spacing:0;text-transform:none;font-size:.88rem}
.specimen .body{padding:1.3rem 1.4rem;font-size:1.02rem}
.specimen .body .hit{border-bottom:2px solid var(--red);font-weight:600}
.specimen .verdict{padding:1.1rem 1.4rem;border-top:1px solid var(--line);border-inline-start:3px solid var(--red);font-size:.95rem}
.specimen .verdict b{color:var(--red)}
pre.term{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.8rem;line-height:1.65;background:var(--panel);border:1px solid var(--line);
  padding:1.1rem 1.2rem;overflow-x:auto;margin:1.6rem 0;direction:ltr;text-align:left;white-space:pre}

/* ---------- fold-outs ---------- */
details.fold{border-bottom:1px solid var(--line);padding:1.15rem 0}
details.fold:first-of-type{border-top:1px solid var(--line)}
details.fold summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:1rem}
details.fold summary::-webkit-details-marker{display:none}
details.fold summary::after{content:"+";font-weight:600;color:var(--muted)}
details.fold[open] summary::after{content:"\2212"}
details.fold p{color:var(--muted);font-size:.97rem;margin:.7rem 0 0;max-width:44rem}

/* ---------- notes ---------- */
.note{font-size:.84rem;color:var(--muted)}
.rule-note{border-inline-start:2px solid var(--line2);padding-inline-start:1rem;color:var(--muted);font-size:.95rem;max-width:46rem}
.box{border:1px solid var(--line);background:var(--panel);padding:1.4rem 1.5rem}

/* ---------- enquiry form, NDA first ---------- */
form.enq{margin-top:2rem;display:grid;gap:1.1rem;max-width:42rem}
form.enq label{font-size:.84rem;font-weight:600}
form.enq input,form.enq textarea,form.enq select{width:100%;padding:.75rem .85rem;border:1px solid var(--line2);background:var(--panel);color:var(--ink);font:inherit;font-size:.96rem;margin-top:.35rem}
form.enq textarea{min-height:7rem;resize:vertical}
form.enq input:focus,form.enq textarea:focus,form.enq select:focus{outline:2px solid var(--seal);outline-offset:-1px}
.step{border:1px solid var(--line);padding:1.5rem;background:var(--panel)}
.step.locked{opacity:.4;pointer-events:none}
.step>div{margin-bottom:1rem}
.step>div:last-of-type{margin-bottom:0}
.stephead{font-weight:600;font-size:.76rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:.65rem;
  margin-bottom:1.3rem;padding-bottom:.95rem;border-bottom:1px solid var(--line)}
[dir="rtl"] .stephead{letter-spacing:0;text-transform:none;font-size:.95rem}
.stepnum{width:1.6rem;height:1.6rem;background:var(--ink);color:var(--bg);display:grid;place-items:center;font-size:.82rem;letter-spacing:0;flex:none}
.step button{margin-top:1.3rem}
.ndabox{max-height:23rem;overflow-y:auto;border:1px solid var(--line);padding:1.3rem 1.45rem;background:var(--bg);font-size:.88rem;line-height:1.65}
.ndabox h4{margin:0 0 .35rem;font-size:.86rem;letter-spacing:.07em;text-transform:uppercase}
[dir="rtl"] .ndabox h4{letter-spacing:0}
.ndabox p{margin:.78rem 0}
.ndameta{color:var(--muted);font-size:.8rem;margin:0 0 1.1rem!important;padding-bottom:.95rem;border-bottom:1px solid var(--line)}
.accept{display:flex;gap:.65rem;align-items:flex-start;margin-top:1.35rem;font-weight:400!important;font-size:.94rem!important;line-height:1.5}
.accept input{width:auto!important;margin-top:.25rem!important}
.ok{display:none;padding:1rem 1.2rem;border:1px solid var(--seal);border-inline-start-width:3px;font-size:.95rem}
.kp-veil{position:fixed;inset:0;background:rgba(14,26,22,.55);display:none;align-items:center;justify-content:center;padding:1.2rem;z-index:80}
.kp-veil.on{display:flex}
.kp-dialog{background:var(--panel);color:var(--ink);border:1px solid var(--line);max-width:30rem;width:100%;padding:1.8rem 1.7rem}
.kp-dialog h3{font-size:1.4rem;margin:.6rem 0 .3rem}
.kp-dialog p{font-size:.95rem;color:var(--muted)}
.kp-tick{width:2.4rem;height:2.4rem;background:var(--seal);display:grid;place-items:center}
.kp-tick svg{width:1.3rem;height:1.3rem}
.kp-ref{border:1px solid var(--line);padding:.7rem .9rem;margin:1rem 0}
.kp-ref span{display:block;font-size:.72rem;letter-spacing:.11em;text-transform:uppercase;font-weight:600;color:var(--muted);margin-bottom:.15rem}
[dir="rtl"] .kp-ref span{letter-spacing:0;text-transform:none;font-size:.86rem}
.kp-ref b{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:1.05rem;letter-spacing:.04em;direction:ltr;display:inline-block}
.kp-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:.4rem}
.kp-actions button,.kp-actions a{font:inherit;font-size:.93rem;font-weight:600;cursor:pointer;padding:.65rem 1.2rem;text-decoration:none;border:1px solid var(--line2)}
.kp-primary{background:var(--btn);color:var(--btn-ink);border-color:var(--btn)!important}
.kp-secondary{color:var(--ink);background:transparent}

/* ---------- manual (generated from MANUAL.html) ---------- */
.man{max-width:50rem}
.man h2{font-size:.8rem;letter-spacing:.15em;text-transform:uppercase;font-weight:600;color:var(--muted);margin:0 0 .4rem}
.man h2 .num{margin-inline-end:.6rem;color:var(--line2)}
.man h3{font-size:1.55rem;font-weight:600;margin:0 0 1rem;line-height:1.2}
.man h4{font-size:1.05rem;font-weight:600;margin:1.8rem 0 .5rem}
.man section{padding:0;border:0;margin:0 0 3.4rem}
.man p,.man ul,.man ol{max-width:42rem}
.man ul,.man ol{padding-inline-start:1.4rem}
.man li{margin:.35rem 0}
.man nav.toc{border:1px solid var(--line);background:var(--panel);padding:1.4rem 1.6rem;margin:0 0 3.2rem}
.man nav.toc ol{margin:0;columns:2;column-gap:2.2rem}
.man nav.toc li{break-inside:avoid}
.man nav.toc a{text-decoration:none;border-bottom:1px solid var(--line)}
.man pre{background:var(--panel);border:1px solid var(--line);font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.82rem;line-height:1.7;padding:1rem 1.15rem;overflow-x:auto;margin:0 0 1rem}
.man code{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.86em;background:var(--paper2);padding:.08em .35em}
.man pre code{background:none;padding:0}
.man table{margin:0 0 1.1rem;border:1px solid var(--line);background:var(--panel);display:block;overflow-x:auto;max-width:100%}
.note-box{border-inline-start:3px solid var(--seal);background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-inline-end:1px solid var(--line);padding:.9rem 1.1rem;margin:0 0 1.1rem}
.warn-box{border-inline-start:3px solid var(--red);background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-inline-end:1px solid var(--line);padding:.9rem 1.1rem;margin:0 0 1.1rem}
.note-box p:last-child,.warn-box p:last-child{margin-bottom:0}
.label{display:block;font-size:.7rem;letter-spacing:.13em;text-transform:uppercase;font-weight:600;margin-bottom:.3rem;color:var(--muted)}
.man .verdict{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:.78rem;padding:.1rem .4rem;border:1px solid var(--line2);white-space:nowrap}
.man .v-stop{color:var(--red);border-color:var(--red)}
.man .v-ok{color:var(--seal);border-color:var(--seal)}
@media(max-width:640px){.man nav.toc ol{columns:1}.man h3{font-size:1.3rem}}

/* ---------- footer ---------- */
footer.site{border-top:1px solid var(--line);padding:3.6rem 0 4rem;font-size:.9rem;color:var(--muted)}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2rem}
@media(max-width:860px){.fgrid{grid-template-columns:1fr 1fr}}
footer.site h4{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;margin:0 0 .8rem;color:var(--ink);font-weight:600}
[dir="rtl"] footer.site h4{letter-spacing:0;text-transform:none;font-size:.9rem}
footer.site ul{list-style:none;padding:0;margin:0}
footer.site li{margin:.45rem 0}
footer.site a{text-decoration:none}
footer.site a:hover{text-decoration:underline}
.legal{margin-top:2.4rem;padding-top:1.4rem;border-top:1px solid var(--line);font-size:.8rem}
