/* ======================================================================
   CASE STUDY FONTS (portfolio-type.css)
   ======================================================================

   Loaded by: case-studies/rizq/rizq.html, case-studies/apnaschool/apnaschool.html

   Sets Inter as the only font on these case studies.
   To change the font, edit --font-main in :root below.
   ====================================================================== */

@font-face {
  font-family: "Inter";
  src: url("../assets/inter-variable.woff2") format("woff2");
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --font-main: Inter, Arial, sans-serif; /* whole case study */
  --sans: var(--font-main);
  --wide: var(--font-main);
  --mono: var(--font-main);
}

body,
button,
input,
textarea,
select {
  font-family: var(--font-main);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--font-main) !important;
}

/* --- "Back to portfolio" button --- */
.portfolio-back {
  position: absolute;
  top: 20px;
  left: var(--gutter, 24px);
  z-index: 150;
  padding: 11px 16px;
  border-radius: 99px;
  background: #fafafa;
  color: #1f2022;
  font: 500 12px/1.3 var(--font-main);
  text-decoration: none;
  box-shadow: 0 1px 8px #0002;
}

.portfolio-back:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
}

body:has(.portfolio-back) .hero-kick {
  margin-top: 54px;
}

/* --- Background grain texture (same as main site) --- */
body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 999;
  pointer-events: none;
  background: url("../assets/noise.svg") repeat;
  background-size: 180px 180px;
  opacity: 0.25;
}