/* ==========================================================================
   FRAMES TECH — secondary pages (company profile · legal · 404)
   ========================================================================== */

.pg{background:var(--ink);color:var(--tx)}
.pg-hdr{
  position:sticky;inset-block-start:0;z-index:40;background:rgba(4,7,14,.78);
  backdrop-filter:blur(16px);border-block-end:1px solid var(--line-2)
}
.pg-hdr .wrap{display:flex;align-items:center;gap:1rem;min-height:70px}
.pg-hdr img{height:30px;width:auto}
.pg-hdr .back{margin-inline-start:auto;font-size:.88rem;font-weight:600;color:var(--tx-2);display:inline-flex;gap:.45rem;align-items:center}
.pg-hdr .back:hover{color:var(--az)}

.doc{max-width:1000px;margin-inline:auto;padding-block:clamp(34px,5vw,70px)}
.doc h1{font-size:clamp(1.8rem,3.4vw,2.6rem);margin-block:.4rem .7rem}
.doc h2{font-size:clamp(1.15rem,1.7vw,1.42rem);margin-block:2rem .7rem}
.doc h3{font-size:1.02rem;margin-block:1.4rem .4rem}
.doc p,.doc li{color:var(--tx-2);font-size:.98rem}
.doc ul{margin-block:.6rem;display:grid;gap:.4rem}
.doc ul li{padding-inline-start:1.3rem;position:relative}
.doc ul li::before{content:"";position:absolute;inset-inline-start:0;inset-block-start:.6em;width:6px;height:6px;border-radius:2px;background:var(--az);transform:rotate(45deg)}
.doc .note{border:1px solid var(--line);border-radius:14px;padding:1rem 1.15rem;background:var(--surface);color:var(--tx-2);font-size:.92rem;margin-block:1.4rem}
.doc hr{border:0;border-block-start:1px solid var(--line-2);margin-block:2rem}
.doc strong{color:var(--tx)}
.doc a{color:var(--az)}

/* ---------------- company profile sheet ---------------- */
.pf-tools{
  position:fixed;inset-block-end:1.2rem;inset-inline-end:1.2rem;z-index:50;display:flex;gap:.6rem
}
.sheet{
  width:min(1080px,100% - 2rem);margin:clamp(20px,3vw,40px) auto;background:var(--ink-2);
  border:1px solid var(--line);border-radius:22px;overflow:hidden;position:relative
}
.sheet-in{padding:clamp(26px,4vw,56px)}
.sheet + .sheet{margin-block-start:clamp(20px,3vw,34px)}
.sheet-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding-block-end:clamp(18px,2.4vw,30px);
  border-block-end:1px solid var(--line-2);margin-block-end:clamp(22px,3vw,40px)}
.sheet-top img{height:clamp(30px,3.4vw,44px);width:auto}
.sheet-tag{font-size:var(--f-xs);letter-spacing:.24em;color:var(--az);font-weight:700}
.sheet h1{font-size:clamp(1.7rem,3.6vw,2.7rem);margin-block:.6rem}
.sheet h1 em{font-style:normal;background:linear-gradient(100deg,var(--sky),var(--az) 50%,var(--md));-webkit-background-clip:text;background-clip:text;color:transparent}
.sheet h2{font-size:clamp(1.05rem,1.5vw,1.3rem);margin-block:clamp(20px,2.4vw,30px) .7rem;display:flex;align-items:center;gap:.6rem}
.sheet h2::before{content:"";width:20px;height:2px;background:var(--az);border-radius:2px}
.sheet p,.sheet li{color:var(--tx-2);font-size:.95rem}
.sheet ul{display:grid;gap:.4rem}
.sheet ul li{padding-inline-start:1.25rem;position:relative}
.sheet ul li::before{content:"";position:absolute;inset-inline-start:0;inset-block-start:.62em;width:6px;height:6px;border-radius:2px;background:var(--az);transform:rotate(45deg)}
.pf-facts{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-block:clamp(20px,2.6vw,34px)}
.pf-facts div{border:1px solid var(--line);border-radius:14px;padding:.95rem 1.05rem;background:var(--surface)}
.pf-facts b{display:block;font-size:var(--f-xs);letter-spacing:.16em;text-transform:uppercase;color:var(--az);font-weight:700}
[dir="rtl"] .pf-facts b{letter-spacing:0;text-transform:none;font-size:var(--f-sm)}
.pf-facts span{display:block;margin-block-start:.3rem;font-weight:600;color:var(--tx)}
.pf-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,2.6vw,36px)}
.pf-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.2vw,30px)}
.pf-box{border:1px solid var(--line);border-radius:16px;padding:1.1rem 1.2rem;background:var(--surface);break-inside:avoid}
.pf-box h3{font-size:1rem;margin-block-end:.5rem;color:var(--tx)}
.pf-box ul li{font-size:.9rem}
.pf-steps{counter-reset:pf;display:grid;gap:.6rem}
.pf-steps li{counter-increment:pf;position:relative;padding-inline-start:2.4rem;color:var(--tx-2);font-size:.93rem}
.pf-steps li::before{content:counter(pf,decimal-leading-zero);position:absolute;inset-inline-start:0;inset-block-start:0;
  width:1.7rem;height:1.7rem;display:grid;place-items:center;border-radius:8px;font-size:.72rem;font-weight:800;
  color:var(--az);border:1px solid rgba(6,169,211,.35);background:rgba(6,169,211,.08)}
.pf-foot{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;align-items:center;
  margin-block-start:clamp(24px,3vw,40px);padding-block-start:1.2rem;border-block-start:1px solid var(--line-2);
  font-size:.86rem;color:var(--tx-2)}
.pf-foot b{color:var(--tx)}
.pf-sign{margin-block-start:1.4rem;padding:1rem 1.15rem;border:1px dashed var(--line);border-radius:14px;color:var(--tx-2);font-size:.86rem}

@media (max-width:820px){
  .pf-facts{grid-template-columns:1fr 1fr}
  .pf-cols,.pf-grid-2{grid-template-columns:1fr}
}
@media (max-width:520px){ .pf-facts{grid-template-columns:1fr} }

/* print: A4 sheets */
@media print{
  @page{size:A4;margin:14mm 12mm}
  body{background:#fff!important;color:#0A1B30!important}
  .pg-hdr,.pf-tools,.grain,.spot,.pf-share,footer.foot{display:none!important}
  .sheet{border:0!important;border-radius:0!important;background:#fff!important;color:#0A1B30!important;
    width:100%;margin:0;break-after:page;page-break-after:always}
  .sheet:last-of-type{break-after:auto;page-break-after:auto}
  .sheet-in{padding:0}
  .sheet-top{border-color:#d7dbe0}
  .sheet h1,.sheet h3,.pf-facts span,.pf-foot b{color:#0A1B30!important}
  .sheet h1 em{-webkit-text-fill-color:#1F98CA;color:#1F98CA}
  .sheet p,.sheet li,.pf-steps li,.pf-sign,.pf-foot{color:#3d5064!important}
  .sheet h2::before{background:#1F98CA}
  .pf-facts div,.pf-box{border-color:#d7dbe0!important;background:#fff!important}
  .pf-facts b,.sheet-tag{color:#1F98CA!important}
  ul li::before,.sheet ul li::before{background:#1F98CA!important}
  .pf-steps li::before{color:#1F98CA;border-color:#bcd3e2;background:#f2f8fb}
  a{color:#0A1B30!important;text-decoration:none}
}

/* ---------------- share + QR on the profile sheet ---------------- */
.pf-share{margin-block-start:1.6rem;padding-block-start:1.2rem;border-block-start:1px solid var(--line-2)}
.pf-qr{display:flex;align-items:center;gap:.9rem;margin-block-start:1.2rem}
.pf-qr img{width:104px;height:104px;background:#fff;border-radius:12px;padding:8px;flex:none}
.pf-qr span{font-size:.86rem;color:var(--tx-2)}
@media print{
  .pf-qr img{border:1px solid #d7dbe0}
  .pf-qr span{color:#3d5064!important}
}

/* ---------------- ضبط الطباعة النهائي (A4) ----------------
   الهدف: نص مقروء، لا انقسام داخل صناديق، ولوحة بيانات مضغوطة
   بحيث تُطبع الأقسام الثلاثة على 4 صفحات A4 نظيفة. */
@media print{
  /* القياس والكثافة: نص مقروء ~9pt مع احتواء كل قسم في صفحة A4 واحدة */
  html{font-size:12.6px}
  .pf-facts{grid-template-columns:repeat(3,1fr)}
  .pf-grid-2{grid-template-columns:repeat(3,1fr)}
  .pf-cols{grid-template-columns:1fr 1fr;gap:.7rem}
  .pf-facts div{padding-block:.42rem}
  .pf-qr img{width:76px;height:76px}
  .pf-qr{margin-block-start:.55rem}
  .pf-sign{padding-block:.5rem;margin-block-start:.65rem}
  .pf-foot{margin-block-start:.6rem}
  .sheet h1{font-size:1.32rem}
  .sheet-in>p:first-of-type{font-size:.9rem;line-height:1.42}
  .sheet h2{margin-block-start:.7rem}
  .sheet-top{margin-block-end:.3rem}
  .pf-box{padding-block:.6rem}
  .pf-box li,.pf-cols li{line-height:1.42}
  /* فواصل نظيفة: لا كتلة تُقسَّم بين صفحتين، والعنوان لا يتيتّم */
  .pf-box,.pf-grid-2>*,.pf-facts>*,.pf-cols>*,.pf-sign{break-inside:avoid;page-break-inside:avoid}
  .sheet h2,.sheet h3{break-after:avoid;page-break-after:avoid}
}
