/*
  PLACEHOLDERS: values in <span class="ph"> are highlighted and must be confirmed
  before launch (legal entity, contact details, partner counts).
  Delete the .ph rule below to remove the highlight.
  Commercial figures and service levels are drafted, not placeholder-marked —
  review the pricing table, the how-it-works timings and the FAQ before publishing.
*/
.ph{background:#FFF1B8;color:#141A2B;box-shadow:inset 0 0 0 1px #E3C24F;border-radius:3px;padding:0 .2em}

:root{
  --ink:#141A2B;
  --deep:#2C3E63;
  --paper:#F4F5F3;
  --sand:#E7E4DA;
  --seal:#B8382B;
  --muted:#5A6379;
  --line:#CFD3CC;
  --font:"IBM Plex Sans Arabic",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font);font-size:1.0625rem;line-height:1.62}
a{color:inherit}
svg{display:block}
:focus-visible{outline:3px solid var(--seal);outline-offset:3px;border-radius:4px}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px;top:12px}
.skip:focus{left:16px;background:var(--ink);color:#fff;padding:8px 14px;z-index:100}
.small{font-size:.9rem;color:var(--muted)}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:5px;font:inherit;font-weight:600;text-decoration:none;border:2px solid transparent;cursor:pointer;line-height:1.2}
.btn-primary{background:var(--seal);color:#fff}
.btn-primary:hover{background:#992D22}
.btn-sm{min-height:40px;padding:0 16px;font-size:.95rem}
.btn-block{width:100%}

.site-header{position:sticky;top:0;z-index:10;background:rgba(244,245,243,.93);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid rgba(207,211,204,.7)}
.bar{display:flex;align-items:center;gap:32px;height:68px}
.brand{display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.brand svg{width:30px;height:30px;flex:none}
.word{font-weight:700;font-size:1.3rem;letter-spacing:-.02em}
.site-nav{margin-left:auto}
.nav{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.nav a{text-decoration:none;font-weight:500;font-size:.95rem;color:var(--muted)}
.nav a:hover{color:var(--ink)}

.hero{padding:76px 0 104px}
.hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(2.3rem,5vw,4rem);line-height:1.06;letter-spacing:-.03em;font-weight:700;margin:0 0 24px;max-width:17ch}
.lede{font-size:1.2rem;line-height:1.55;color:#39425C;max-width:35rem;margin:0 0 32px}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:16px}
.hero .small{margin:0; text-wrap: pretty; max-width: 60ch;}
.app-card{position:relative;margin:0 0 0 auto;max-width:440px;background:#fff;border-radius:10px;padding:26px 28px 22px;box-shadow:0 1px 0 var(--line),0 28px 56px -30px rgba(20,26,43,.45)}
.app-head{display:flex;justify-content:space-between;align-items:baseline;font-weight:600;margin-bottom:14px}
.app-id{font-weight:400;font-size:.85rem;color:var(--muted)}
.app-rows{margin:0}
.app-rows div{display:grid;grid-template-columns:128px 1fr;gap:12px;padding:11px 0;border-top:1px dashed var(--line)}
.app-rows dt{font-size:.9rem;color:var(--muted)}
.app-rows dd{margin:0;font-weight:500}
.status{display:inline-flex;align-items:center;padding:2px 12px;border-radius:999px;background:var(--sand);font-size:.875rem;font-weight:600;transition:background .2s,color .2s}
.status.ok{background:var(--ink);color:#fff}
.app-card figcaption{margin-top:12px;font-size:.8rem;color:var(--muted)}
.seal{position:absolute;right:20px;bottom:38px;width:116px;height:116px;opacity:0;mix-blend-mode:multiply;pointer-events:none}
.app-card.stamped .seal{animation:stamp .5s cubic-bezier(.3,1.35,.5,1) forwards}
.app-card.stamped{animation:thud .22s .26s ease-out}
.app-card.static .seal{animation:none;opacity:.9;transform:rotate(-8deg)}
.app-card.static{animation:none}
@keyframes stamp{0%{opacity:0;transform:scale(1.8) rotate(-15deg)}55%{opacity:1;transform:scale(.93) rotate(-7deg)}100%{opacity:.9;transform:scale(1) rotate(-8deg)}}
@keyframes thud{50%{transform:translateY(2px)}}

.section{padding:96px 0}
.section h2{font-size:clamp(1.85rem,3.5vw,2.7rem);line-height:1.14;letter-spacing:-.02em;font-weight:700;margin:0 0 16px;max-width:22ch}
.section-lede{color:var(--muted);max-width:38rem;margin:0}

.features{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 48px;margin-top:56px}
.feature{border-top:2px solid var(--ink);padding-top:20px}
.feature h3{font-size:1.15rem;line-height:1.3;margin:0 0 8px;font-weight:600}
.feature p{margin:0;color:var(--muted)}

.regions{background:#fff}
.reg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;margin-top:56px}
.reg{border-top:2px solid var(--seal);padding-top:20px}
.reg h3{font-size:1.3rem;margin:0 0 16px;font-weight:700}
.reg dl{margin:0}
.reg dt{font-size:.85rem;color:var(--muted);margin-top:16px}
.reg dd{margin:4px 0 0;font-weight:500}
.reg dd:first-of-type{font-weight:400}

.steps{list-style:none;margin:56px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:40px}
.steps li{position:relative}
.steps .n{display:block;font-size:3rem;line-height:1;font-weight:700;color:var(--deep);margin-bottom:14px}
.steps li:not(:last-child)::after{content:"";position:absolute;top:24px;left:48px;right:-20px;border-top:2px dashed var(--line)}
.steps h3{font-size:1.15rem;margin:0 0 8px;font-weight:600}
.steps p{margin:0;color:var(--muted)}
.steps .when{display:block;margin-top:8px;font-size:.85rem;color:var(--deep);font-weight:600}

.int-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.int-grid p{color:var(--muted);max-width:30rem}
.platforms{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;column-gap:40px}
.platforms li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:15px 0;border-bottom:1px solid var(--line);font-weight:600;font-size:1.08rem}
.platforms li span{font-weight:400;font-size:.85rem;color:var(--muted)}

.pricing{background:var(--ink);color:#E4E7ED}
.pricing h2{color:#fff}
.price-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:72px;align-items:start}
.price-grid p{color:rgba(228,231,237,.82);max-width:29rem;margin:0 0 28px}
.price-table{width:100%;border-collapse:collapse}
.price-table th,.price-table td{padding:15px 0;border-bottom:1px solid rgba(255,255,255,.14);vertical-align:baseline}
.price-table tr:first-child th,.price-table tr:first-child td{border-top:1px solid rgba(255,255,255,.14)}
.price-table th{text-align:left;font-weight:400;color:rgba(228,231,237,.85);padding-right:16px}
.price-table td{text-align:right;font-weight:600;color:#fff;white-space:nowrap}

.apply-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:64px;align-items:start}
.apply-intro > p{color:var(--muted);max-width:30rem}
.apply-intro h3{font-size:1.1rem;margin:36px 0 12px;font-weight:600}
.checklist{list-style:none;margin:0 0 28px;padding:0}
.checklist li{position:relative;padding:8px 0 8px 24px}
.checklist li::before{content:"";position:absolute;left:0;top:17px;width:9px;height:9px;background:var(--seal);border-radius:2px}

.form-panel{background:#fff;border:1px solid var(--line);border-radius:10px;padding:32px}
.row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.field{margin-bottom:30px;display:flex;flex-direction:column;position:relative}
.field label{display:block;font-weight:600;font-size:.95rem;margin-bottom:6px}
.hint{display:block;font-weight:400;font-size:11px;color:var(--muted);margin-top:2px}
.hint-sm{font-size:11px;line-height:115%;position: relative; top: -2px;}
.field input[type=text],.field input[type=email],.field select{width:100%;min-height:48px;padding:10px 14px;border:1.5px solid #A9B0BF;border-radius:5px;font:inherit;background:#fff;color:var(--ink);margin-top:auto}
.field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 20px) 52%,calc(100% - 14px) 52%;background-size:6px 6px;background-repeat:no-repeat;padding-right:40px}
.field input:focus-visible,.field select:focus-visible{outline:3px solid rgba(44,62,99,.3);outline-offset:0;border-color:var(--deep)}
.field [aria-invalid=true]{border-color:var(--seal)}
.error{color:var(--seal);font-size:.9rem;margin:6px 0 0}
.field .error,.consent-wrap .error{position:absolute;left:0;top:100%;margin:4px 0 0;font-size:12px;line-height:1.3;opacity:0;pointer-events:none;transition:opacity .15s ease}
.field .error[hidden],.consent-wrap .error[hidden]{display:block}
.field .error:not([hidden]),.consent-wrap .error:not([hidden]){opacity:1}
.consent{display:flex;gap:12px;align-items:flex-start;font-size:12px;margin-bottom:6px}
.consent input{width:20px;height:20px;margin-top:3px;flex:none;accent-color:var(--ink)}
.consent-wrap{margin-bottom:36px;position:relative}
.form-panel .small{margin:14px 0 0}
.success{outline:none}
.success svg{width:44px;height:44px}
.success h3{font-size:1.5rem;font-weight:700;margin:14px 0 8px}
.success p{color:var(--muted);margin:0}

.faq{background:#fff}
.faq-grid{display:grid;grid-template-columns:1fr 1.6fr;gap:64px;align-items:start}
.faq details{border-bottom:1px solid var(--line)}
.faq details:first-child{border-top:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:20px 40px 20px 0;font-weight:600;font-size:1.08rem;position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:4px;top:14px;font-size:1.6rem;font-weight:400;line-height:1.2;color:var(--deep);transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 22px;color:var(--muted);max-width:42rem}

.site-footer{background:var(--ink);color:rgba(228,231,237,.8);padding:64px 0 32px;font-size:.92rem}
.site-footer .word{color:#fff}
.disclosure{border-left:3px solid var(--seal);padding-left:16px;margin:20px 0 0;max-width:36rem}
.entity{max-width:36rem;font-size:.88rem;color:rgba(228,231,237,.68);margin:20px 0 0}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px}
.foot-links{list-style:none;margin:0;padding:0}
.foot-links li{padding:4px 0}
.foot-links a{text-decoration:none}
.foot-links a:hover{color:#fff;text-decoration:underline}
.foot-base{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:48px;padding-top:24px;border-top:1px solid rgba(255,255,255,.14)}
.foot-base p{margin:0;max-width:44rem}

.privacy{background:#fff}
.privacy .legal-copy{max-width:820px}
.privacy .legal-copy h1{font-size:clamp(1.85rem,3.5vw,2.7rem);line-height:1.14;letter-spacing:-.02em;font-weight:700;margin:0 0 16px}
.privacy .legal-copy h2{font-size:1.15rem;line-height:1.3;margin:32px 0 8px;font-weight:600}
.privacy .legal-copy p{margin:0 0 14px;color:var(--muted)}
.privacy .legal-copy ul{margin:0 0 18px;padding-left:22px;color:var(--muted)}
.privacy .legal-copy li{margin:6px 0}
.privacy .legal-meta{font-size:.9rem;color:var(--muted);margin-bottom:28px}

.notfound{background:#fff}
.notfound .wrap{max-width:640px;text-align:center}
.notfound .code{font-size:clamp(3rem,10vw,5rem);line-height:1;font-weight:700;color:var(--seal);margin:0 0 8px}
.notfound h1{font-size:clamp(1.85rem,3.5vw,2.7rem);line-height:1.14;letter-spacing:-.02em;font-weight:700;margin:0 0 16px}
.notfound p{color:var(--muted);margin:0 0 24px}
.notfound .actions{justify-content:center;margin-bottom:8px}

.notfound-page{min-height:100vh;display:flex;flex-direction:column}
.notfound-page main{flex:1;display:flex}
.notfound-page .notfound{flex:1;display:flex;align-items:center}
.notfound-page .notfound .wrap{margin:0 auto}

@media (prefers-reduced-motion:reduce){.faq summary::after,.status,.error{transition:none}}
@media (max-width:980px){
  .features,.reg-grid{grid-template-columns:1fr 1fr}
  .steps{grid-template-columns:1fr 1fr}
  .steps li::after{display:none}
  .price-grid,.apply-grid,.int-grid,.faq-grid{grid-template-columns:1fr;gap:40px}
}
@media (max-width:820px){
  .site-nav{display:none}
  .bar .btn{margin-left:auto}
  .hero{padding:48px 0 72px}
  .hero-grid{grid-template-columns:1fr;gap:48px}
  .app-card{margin:0;max-width:none}
  .foot-grid{grid-template-columns:1fr 1fr}
  .foot-grid > div:first-child{grid-column:1 / -1}
}
@media (max-width:600px){
  .section{padding:72px 0}
  .features,.steps,.platforms,.row,.reg-grid{grid-template-columns:1fr}
  .row{gap:0}
  .field{margin-bottom:24px}
  .form-panel{padding:22px}
  .app-rows div{grid-template-columns:110px 1fr}
  .seal{width:94px;height:94px;right:12px}
  .consent-wrap{margin-top: 30px;}
}
