@import url('https://fonts.googleapis.com/css2?family=Courier+Prime:wght@400;700&display=swap');

/* Sadam Koumi biography notebook treatment — live editorial pass.
   Cream archival notebook / typed-letter sheet on the original Nile green page. */

:root{
  --sk-notebook-paper:#f2edd8;
  --sk-notebook-paper-deep:#e9e1c7;
  --sk-notebook-ink:#283129;
  --sk-notebook-rule:rgba(95,137,164,.16);
  --sk-notebook-margin:rgba(181,149,69,.42);
  --sk-notebook-muted:#776f5c;
}

/* Keep the original green page and the original content geometry. */
.sadam-page .sk-content-grid{
  position:relative;
  isolation:auto;
  margin-top:0;
  padding:38px 0 0;
  background:none;
  border:0;
  box-shadow:none;
}

/* Cream archival notebook sheet. */
.sadam-page .sk-story--note{
  position:relative;
  overflow:hidden;
  padding:clamp(34px,3.4vw,50px) clamp(28px,3.4vw,46px) clamp(38px,3.6vw,52px);
  background:
    radial-gradient(circle at 14% 22%,rgba(80,61,31,.03) 0 .8px,transparent 1.4px),
    radial-gradient(circle at 78% 69%,rgba(80,61,31,.024) 0 .8px,transparent 1.5px),
    linear-gradient(180deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,0) 9%),
    repeating-linear-gradient(
      to bottom,
      transparent 0,
      transparent 33px,
      var(--sk-notebook-rule) 33px,
      var(--sk-notebook-rule) 34px
    ),
    linear-gradient(180deg,#f7f2df 0%,var(--sk-notebook-paper) 56%,var(--sk-notebook-paper-deep) 100%);
  background-size:19px 19px,27px 27px,100% 100%,100% 34px,100% 100%;
  color:var(--sk-notebook-ink);
  border:1px solid rgba(111,95,63,.18);
  box-shadow:12px 15px 0 rgba(5,20,13,.11),0 24px 45px rgba(3,15,9,.18);
  transform:rotate(-.08deg);
}

/* Soft tape detail. */
.sadam-page .sk-story--note::before{
  content:"";
  position:absolute;
  z-index:4;
  width:90px;
  height:18px;
  left:50%;
  top:-8px;
  transform:translateX(-50%) rotate(1.15deg);
  background:rgba(225,210,164,.70);
  box-shadow:0 2px 5px rgba(61,44,17,.08);
}

/* Notebook margin line — warm gold, no crimson. */
.sadam-page .sk-story--note::after{
  content:"";
  position:absolute;
  z-index:0;
  top:0;
  bottom:0;
  left:56px;
  width:1px;
  background:var(--sk-notebook-margin);
  pointer-events:none;
}

.sadam-page .sk-story--note h2,
.sadam-page .sk-story--note .sk-overline,
.sadam-page .sk-story--note .sk-copy{
  position:relative;
  z-index:2;
}

.sadam-page .sk-story--note .sk-overline--note{
  margin-left:46px;
  color:#75684f;
  font-family:"Courier Prime","Courier New",Courier,monospace;
  font-size:11px;
  font-weight:700;
  letter-spacing:.15em;
}

.sadam-page .sk-story--note h2{
  margin-left:46px;
  color:#263229;
  text-shadow:none;
}

/* Typewritten letter feel like the supplied reference. */
.sadam-page .sk-story--note .sk-copy{
  max-width:770px;
  margin-top:16px;
  padding-left:46px;
  gap:11px;
  font-family:"Courier Prime","Courier New",Courier,monospace;
}

.sadam-page .sk-story--note .sk-copy p{
  margin:0;
  color:#2b312a;
  font-family:"Courier Prime","Courier New",Courier,monospace;
  font-size:16px;
  font-weight:400;
  line-height:2.02;
  letter-spacing:.012em;
  text-shadow:none;
}

/* Temporary signature until the real one is supplied. */
.sadam-page .sk-story--note .sk-copy::after{
  content:"Sadam Koumi*";
  display:block;
  margin:24px 4px 0 auto;
  width:max-content;
  max-width:100%;
  color:#455ca8;
  font-family:"Brush Script MT","Segoe Script","Lucida Handwriting",cursive;
  font-size:clamp(36px,3vw,48px);
  line-height:.95;
  letter-spacing:.01em;
  transform:rotate(-4deg);
  opacity:.9;
}

@media(max-width:699px){
  .sadam-page .sk-content-grid{
    margin-top:0;
    padding:30px 0 0;
  }
  .sadam-page .sk-story--note{
    padding:28px 20px 32px;
    box-shadow:8px 10px 0 rgba(5,20,13,.10),0 16px 32px rgba(3,15,9,.16);
  }
  .sadam-page .sk-story--note::after{
    left:35px;
  }
  .sadam-page .sk-story--note .sk-overline--note,
  .sadam-page .sk-story--note h2{
    margin-left:29px;
  }
  .sadam-page .sk-story--note .sk-copy{
    padding-left:29px;
  }
  .sadam-page .sk-story--note .sk-copy p{
    font-size:14px;
    line-height:1.95;
  }
  .sadam-page .sk-story--note .sk-copy::after{
    font-size:32px;
  }
}