/* Konoz certificate - the platform's golden-lace design.
 * Extracted from konoz-ours.css so the same design shows on the verification page, print/PDF,
 * the student's page, the gallery and the admin panel (independent of the public site theme).
 * Markup: resources/views/pages/public/partials/landing/ko-sheet.blade.php */
/* design tokens (scoped to the certificate so they never leak into the page) */
.sheet.sheet--art, .kzc-scale .sheet {
  --teal: #186078; --teal-deep: #0e4558; --teal-soft: #e4f1f4; --gold: #d89018; --gold-light: #f0c466; --gold-deep: #a86c08; --gold-soft: #fdf3dc; --muted: #627780; --ink: #2a3a41;
  --font-body: 'IBM Plex Sans Arabic', 'Tajawal', system-ui, sans-serif; --font-cert: 'Aref Ruqaa', serif; --font-display: 'Amiri', serif;
  --pat-light: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='none' stroke='%23186078' stroke-opacity='.22' stroke-width='1.3'%3E%3Crect x='20' y='20' width='40' height='40'/%3E%3Crect x='20' y='20' width='40' height='40' transform='rotate(45 40 40)'/%3E%3Ccircle cx='40' cy='40' r='9'/%3E%3C/g%3E%3C/svg%3E");
  --pat-white: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='.14' stroke-width='1.2'%3E%3Crect x='20' y='20' width='40' height='40'/%3E%3Crect x='20' y='20' width='40' height='40' transform='rotate(45 40 40)'/%3E%3Ccircle cx='40' cy='40' r='9'/%3E%3C/g%3E%3C/svg%3E");
}


.sheet__lace {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.sheet__bg {
  object-fit: cover;
}

.sheet__logo {
  position: absolute;
  top: 8.4cqw;
  width: 10.4cqw;
  height: auto;
  z-index: 2;
}

.sheet__logo--r {
  right: 9.5cqw;
}

.sheet__logo--l {
  left: 9.5cqw;
}

.sheet__in {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 5.4cqw 12cqw 6.6cqw;
  text-align: center;
}

.sheet__head {
  display: grid;
  justify-items: center;
  gap: .3cqw;
}

.sheet__org {
  margin: 0;
  font-family: var(--font-display), serif;
  font-size: 3.3cqw;
  font-weight: 700;
  color: #0e4558;
}

.sheet__title {
  margin: 0;
  font-family: var(--font-display), serif;
  font-size: 6.6cqw;
  font-weight: 700;
  line-height: 1.25;
  color: #0e4558;
}

.sheet__div {
  position: relative;
  display: block;
  width: 28cqw;
  height: 1.6cqw;
  background: linear-gradient(90deg, transparent, #1a8a9d 40%) left center / 46% .2cqw no-repeat, linear-gradient(270deg, transparent, #1a8a9d 40%) right center / 46% .2cqw no-repeat;
}

.sheet__div::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.1cqw;
  height: 1.1cqw;
  translate: -50% -50%;
  rotate: 45deg;
  background: #c98a14;
}

.sheet__intro {
  margin: 0;
  font-family: var(--font-display), serif;
  font-size: 2.6cqw;
  font-weight: 700;
  color: #4a5f66;
}

.sheet__name {
  position: relative;
  padding-bottom: 1cqw;
  font-family: var(--font-display), serif;
  font-weight: 700;
  font-size: 5.4cqw;
  line-height: 1.25;
  color: #0e4558;
}

.sheet__name::after {
  content: '';
  position: absolute;
  inset-inline: 6%;
  bottom: 0;
  height: .28cqw;
  background: linear-gradient(90deg, transparent, #c98a14, transparent);
}

.sheet__body {
  display: grid;
  gap: .1cqw;
  max-width: 62cqw;
}

.sheet__body p {
  margin: 0;
  font-family: var(--font-display), serif;
  font-size: 2.45cqw;
  font-weight: 700;
  line-height: 1.75;
  color: #33474d;
}

.sheet__bottom {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: end;
  width: 100%;
  gap: 2cqw;
  padding-inline: 1cqw;
}

.sheet__team {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 1.4cqw;
}

.sheet__team--duo .sheet__sig b {
  min-width: 0;
  padding-inline: .8cqw;
  font-size: 2cqw;
}

.sheet__team--duo .sheet__sigimg img {
  max-width: 9cqw;
}

.sheet__team--duo .sheet__stamp {
  width: 4cqw;
  height: 4cqw;
}

.sheet__sig {
  display: grid;
  justify-items: center;
  gap: .2cqw;
}

.sheet__sig small {
  font-family: var(--font-display), serif;
  font-size: 2.1cqw;
  font-weight: 700;
  color: #12768a;
}

.sheet__sigimg {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: .8cqw;
  height: 5.6cqw;
}

.sheet__stamp {
  width: 5.6cqw;
  height: 5.6cqw;
  object-fit: contain;
  opacity: .92;
}

.sheet__sigimg img {
  max-width: 13cqw;
  max-height: 5cqw;
  object-fit: contain;
}

.sheet__sig b {
  min-width: 19cqw;
  padding-top: .5cqw;
  border-top: 2px solid #c98a14;
  font-family: var(--font-display), serif;
  font-size: 2.5cqw;
  color: #0c5668;
}

.sheet__mid {
  display: grid;
  justify-items: center;
  gap: .4cqw;
}

.sheet__seal {
  display: grid;
  place-items: center;
  width: 7.6cqw;
  height: 7.6cqw;
}

.sheet__seal img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.sheet__qrbox {
  padding: .5cqw;
  border: 1.5px solid #1a8a9d;
  border-radius: .8cqw;
  background: #fff;
}

.sheet__qr {
  width: 4.2cqw;
  height: 4.2cqw;
}

.sheet__qr svg {
  display: block;
  width: 100%;
  height: 100%;
}

.sheet__facts {
  display: flex;
  align-items: stretch;
  justify-content: center;
  width: 100%;
  margin-top: 1cqw;
  border-block: 1px solid #c98a14;
  font-family: var(--font-display), serif;
}

.sheet__facts span {
  display: flex;
  align-items: baseline;
  gap: .8cqw;
  padding: .7cqw 2.2cqw;
  white-space: nowrap;
}

.sheet__facts span + span {
  border-inline-start: 1px solid #c98a14;
}

.sheet__facts small {
  font-size: 1.7cqw;
  font-weight: 700;
  color: #12768a;
}

.sheet__facts b {
  font-size: 1.8cqw;
  font-weight: 800;
  color: #1f3338;
}

.sheet__verify {
  font-size: 1.2cqw;
  font-weight: 700;
  color: #6b7a80;
}

.sheet--art .sheet__logo {
  top: 7cqw;
  width: 13.5cqw;
}

.sheet--art .sheet__logo--r {
  right: 15cqw;
}

.sheet--art .sheet__logo--l {
  left: 15cqw;
}

.sheet--art .sheet__in {
  justify-content: flex-start;
  gap: .9cqw;
  padding: 15.8cqw 12cqw 7.6cqw;
}

.sheet--art .sheet__head {
  display: contents;
}

.sheet--art .sheet__org {
  display: none;
}

.sheet--art .sheet__div {
  display: none;
}

.sheet--art .sheet__title {
  position: absolute;
  top: 6.2cqw;
  left: 50%;
  translate: -50% 0;
  white-space: nowrap;
  font-family: var(--font-cert), var(--font-display), serif;
  font-size: 6.4cqw;
  font-weight: 700;
  line-height: 1.15;
  background: none;
  color: #0a4a5b;
  -webkit-text-fill-color: #0a4a5b;
  text-shadow: .2cqw .2cqw 0 rgba(201, 138, 20, .45);
}

.sheet--art .sheet__intro {
  font-size: 2.8cqw;
  color: #2b3d44;
}

.sheet--art .sheet__name {
  font-size: 5cqw;
  color: #0a4a5b;
}

.sheet--art .sheet__body {
  max-width: 64cqw;
}

.sheet--art .sheet__body p {
  font-size: 2.9cqw;
  line-height: 1.6;
  color: #1f3338;
}

.sheet--art .sheet__bottom {
  margin-top: auto;
  margin-inline: 3cqw;
  width: auto;
  gap: 1cqw;
}

.sheet--art .sheet__verify {
  display: none;
}

.sheet--art .sheet__sigimg {
  height: 6cqw;
}

.sheet--art .sheet__sigimg img {
  max-width: 17cqw;
  max-height: 5.8cqw;
}

.sheet--art .sheet__stamp {
  width: 7cqw;
  height: 7cqw;
}

.sheet--art .sheet__sig b {
  min-width: 19cqw;
  padding-top: .9cqw;
  border-top: 0;
  background: linear-gradient(90deg, transparent, #c98a14, transparent) top / 100% .28cqw no-repeat;
  font-size: 3.5cqw;
}

.sheet--art .sheet__sigimg {
  margin-top: .4cqw;
}

.sheet--art .sheet__team {
  translate: 3cqw 0;
}

.sheet--art .sheet__bottom > .sheet__sig {
  translate: -3cqw 0;
}

.sheet--art .sheet__sig small {
  font-size: 2.9cqw;
}

.sheet--art .sheet__seal {
  width: 6.4cqw;
  height: 6.4cqw;
}

.sheet--art .sheet__qrbox {
  padding: .6cqw;
}

.sheet--art .sheet__qr {
  width: 5cqw;
  height: 5cqw;
}

.sheet--art .sheet__facts {
  width: auto;
}

.sheet--art .sheet__team--duo .sheet__sig b {
  min-width: 0;
  font-size: 2.1cqw;
}

.sheet--art .sheet__team--duo .sheet__sigimg img {
  max-width: 10cqw;
}

.sheet--art .sheet__team--duo .sheet__stamp {
  width: 4.6cqw;
  height: 4.6cqw;
}

.sheet {
  position: relative;
  width: min(1000px, 100%);
  aspect-ratio: 1.414 / 1;
  overflow: hidden;
  color: #2b3d44;
  background: #fffdf7;
  box-shadow: 0 24px 60px rgba(14, 69, 88, .22);
  container-type: inline-size;
}

.sheet__lace {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.sheet__bg {
  object-fit: cover;
}

.sheet__logo {
  position: absolute;
  top: 8.4cqw;
  width: 10.4cqw;
  height: auto;
  z-index: 2;
}

.sheet__logo--r {
  right: 9.5cqw;
}

.sheet__logo--l {
  left: 9.5cqw;
}

.sheet__in {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 5.4cqw 12cqw 6.6cqw;
  text-align: center;
}

.sheet__head {
  display: grid;
  justify-items: center;
  gap: .3cqw;
}

.sheet__org {
  margin: 0;
  font-family: var(--font-display), serif;
  font-size: 3.3cqw;
  font-weight: 700;
  color: #0e4558;
}

.sheet__title {
  margin: 0;
  font-family: var(--font-display), serif;
  font-size: 6.6cqw;
  font-weight: 700;
  line-height: 1.25;
  color: #0e4558;
}

.sheet__div {
  position: relative;
  display: block;
  width: 28cqw;
  height: 1.6cqw;
  background: linear-gradient(90deg, transparent, #1a8a9d 40%) left center / 46% .2cqw no-repeat, linear-gradient(270deg, transparent, #1a8a9d 40%) right center / 46% .2cqw no-repeat;
}

.sheet__div::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.1cqw;
  height: 1.1cqw;
  translate: -50% -50%;
  rotate: 45deg;
  background: #c98a14;
}

.sheet__intro {
  margin: 0;
  font-family: var(--font-display), serif;
  font-size: 2.6cqw;
  font-weight: 700;
  color: #4a5f66;
}

.sheet__name {
  position: relative;
  padding-bottom: 1cqw;
  font-family: var(--font-display), serif;
  font-weight: 700;
  font-size: 5.4cqw;
  line-height: 1.25;
  color: #0e4558;
}

.sheet__name::after {
  content: '';
  position: absolute;
  inset-inline: 6%;
  bottom: 0;
  height: .28cqw;
  background: linear-gradient(90deg, transparent, #c98a14, transparent);
}

.sheet__body {
  display: grid;
  gap: .1cqw;
  max-width: 62cqw;
}

.sheet__body p {
  margin: 0;
  font-family: var(--font-display), serif;
  font-size: 2.45cqw;
  font-weight: 700;
  line-height: 1.75;
  color: #33474d;
}

.sheet__bottom {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: end;
  width: 100%;
  gap: 2cqw;
  padding-inline: 1cqw;
}

.sheet__team {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 1.4cqw;
}

.sheet__team--duo .sheet__sig b {
  min-width: 0;
  padding-inline: .8cqw;
  font-size: 2cqw;
}

.sheet__team--duo .sheet__sigimg img {
  max-width: 9cqw;
}

.sheet__team--duo .sheet__stamp {
  width: 4cqw;
  height: 4cqw;
}

.sheet__sig {
  display: grid;
  justify-items: center;
  gap: .2cqw;
}

.sheet__sig small {
  font-family: var(--font-display), serif;
  font-size: 2.1cqw;
  font-weight: 700;
  color: #12768a;
}

.sheet__sigimg {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: .8cqw;
  height: 5.6cqw;
}

.sheet__stamp {
  width: 5.6cqw;
  height: 5.6cqw;
  object-fit: contain;
  opacity: .92;
}

.sheet__sigimg img {
  max-width: 13cqw;
  max-height: 5cqw;
  object-fit: contain;
}

.sheet__sig b {
  min-width: 19cqw;
  padding-top: .5cqw;
  border-top: 2px solid #c98a14;
  font-family: var(--font-display), serif;
  font-size: 2.5cqw;
  color: #0c5668;
}

.sheet__mid {
  display: grid;
  justify-items: center;
  gap: .4cqw;
}

.sheet__seal {
  display: grid;
  place-items: center;
  width: 7.6cqw;
  height: 7.6cqw;
}

.sheet__seal img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.sheet__qrbox {
  padding: .5cqw;
  border: 1.5px solid #1a8a9d;
  border-radius: .8cqw;
  background: #fff;
}

.sheet__qr {
  width: 4.2cqw;
  height: 4.2cqw;
}

.sheet__qr svg {
  display: block;
  width: 100%;
  height: 100%;
}

.sheet__course {
  font-size: 3cqw !important;
  color: #0c5668 !important;
}

.sheet__facts {
  display: flex;
  align-items: stretch;
  justify-content: center;
  width: 100%;
  margin-top: 1cqw;
  border-block: 1px solid #c98a14;
  font-family: var(--font-display), serif;
}

.sheet__facts span {
  display: flex;
  align-items: baseline;
  gap: .8cqw;
  padding: .7cqw 2.2cqw;
  white-space: nowrap;
}

.sheet__facts span + span {
  border-inline-start: 1px solid #c98a14;
}

.sheet__facts small {
  font-size: 1.7cqw;
  font-weight: 700;
  color: #12768a;
}

.sheet__facts b {
  font-size: 1.8cqw;
  font-weight: 800;
  color: #1f3338;
}

.sheet__verify {
  font-size: 1.2cqw;
  font-weight: 700;
  color: #6b7a80;
}

.sheet--art .sheet__logo {
  top: 7cqw;
  width: 13.5cqw;
}

.sheet--art .sheet__logo--r {
  right: 15cqw;
}

.sheet--art .sheet__logo--l {
  left: 15cqw;
}

.sheet--art .sheet__in {
  justify-content: flex-start;
  gap: .9cqw;
  padding: 15.8cqw 12cqw 7.6cqw;
}

.sheet--art .sheet__head {
  display: contents;
}

.sheet--art .sheet__org {
  display: none;
}

.sheet--art .sheet__div {
  display: none;
}

.sheet--art .sheet__title {
  position: absolute;
  top: 6.2cqw;
  left: 50%;
  translate: -50% 0;
  white-space: nowrap;
  font-family: var(--font-cert), var(--font-display), serif;
  font-size: 6.4cqw;
  font-weight: 700;
  line-height: 1.15;
  background: none;
  color: #0a4a5b;
  -webkit-text-fill-color: #0a4a5b;
  text-shadow: .2cqw .2cqw 0 rgba(201, 138, 20, .45);
}

.sheet--art .sheet__intro {
  font-size: 2.8cqw;
  color: #2b3d44;
}

.sheet--art .sheet__name {
  font-size: 5cqw;
  color: #0a4a5b;
}

.sheet--art .sheet__body {
  max-width: 64cqw;
}

.sheet--art .sheet__body p {
  font-size: 2.9cqw;
  line-height: 1.6;
  color: #1f3338;
}

.sheet--art .sheet__bottom {
  margin-top: auto;
  margin-inline: 3cqw;
  width: auto;
  gap: 1cqw;
}

.sheet--art .sheet__verify {
  display: none;
}

.sheet--art .sheet__sigimg {
  height: 6cqw;
}

.sheet--art .sheet__sigimg img {
  max-width: 17cqw;
  max-height: 5.8cqw;
}

.sheet--art .sheet__stamp {
  width: 7cqw;
  height: 7cqw;
}

.sheet--art .sheet__sig b {
  min-width: 19cqw;
  padding-top: .9cqw;
  border-top: 0;
  background: linear-gradient(90deg, transparent, #c98a14, transparent) top / 100% .28cqw no-repeat;
  font-size: 3.5cqw;
}

.sheet--art .sheet__sigimg {
  margin-top: .4cqw;
}

.sheet--art .sheet__team {
  translate: 3cqw 0;
}

.sheet--art .sheet__bottom > .sheet__sig {
  translate: -3cqw 0;
}

.sheet--art .sheet__sig small {
  font-size: 2.9cqw;
}

.sheet--art .sheet__seal {
  width: 6.4cqw;
  height: 6.4cqw;
}

.sheet--art .sheet__qrbox {
  padding: .6cqw;
}

.sheet--art .sheet__qr {
  width: 5cqw;
  height: 5cqw;
}

.sheet--art .sheet__facts {
  width: auto;
}

.sheet--art .sheet__team--duo .sheet__sig b {
  min-width: 0;
  font-size: 2.1cqw;
}

.sheet--art .sheet__team--duo .sheet__sigimg img {
  max-width: 10cqw;
}

.sheet--art .sheet__team--duo .sheet__stamp {
  width: 4.6cqw;
  height: 4.6cqw;
}

@media print {
  .sheet {
    width: 100%;
    box-shadow: none;
    print-color-adjust: exact;
    -webkit-print-color-adjust: exact;
  }
}

.sheet__wm {
  position: absolute;
  top: 56%;
  left: 50%;
  width: 40cqw;
  height: auto;
  translate: -50% -50%;
  opacity: .075;
  pointer-events: none;
}

/* Certificate: phrase under the grade, bigger platform seal */
/* tighter lines so the extra phrase and the bigger seal still fit inside the frame */
.sheet--art .sheet__in {
  gap: .5cqw;
}

.sheet--art .sheet__body p {
  line-height: 1.4;
}

.sheet--art .sheet__sig small,
.sheet--art .sheet__sig b {
  line-height: 1.3;
}

.sheet--art .sheet__body p.sheet__phrase {
  max-width: 62cqw;
  margin-inline: auto;
  font-size: 2.4cqw;
  color: #33474d;
}

.sheet--art .sheet__seal {
  width: 8.6cqw;
  height: 8.6cqw;
}

/* Certificate: bigger director signature and seal */
.sheet--art .sheet__bottom > .sheet__sig .sheet__sigimg {
  height: 8cqw;
}

.sheet--art .sheet__bottom > .sheet__sig .sheet__sigimg img {
  max-width: 21cqw;
  max-height: 7.8cqw;
}

.sheet--art .sheet__bottom > .sheet__sig .sheet__stamp {
  width: 9cqw;
  height: 9cqw;
}

/* teacher with a signature: her name sits under the signature */
.sheet__tname{display:block;font-family:var(--font-display),serif;font-size:3.5cqw;font-weight:700;color:#0c5668;text-align:center;line-height:1.3}