/* =========================================================
   Ibrahim Zidan Subpages — Mint Light
   Who Is Ibrahim + Ibrahim Story
   ========================================================= */

:root{
  --iz-bg:#f3fcf9;
  --iz-surface:#ffffff;
  --iz-soft:#edf9f5;
  --iz-soft-2:#e3f5ef;

  --iz-text:#173f3a;
  --iz-heading:#073f39;
  --iz-muted:#5d7c76;

  --iz-primary:#087f71;
  --iz-primary-dark:#05675e;
  --iz-primary-light:#28ad97;

  --iz-line:rgba(8,127,113,.17);
  --iz-line-strong:rgba(8,127,113,.31);

  --iz-shadow:
    0 18px 46px rgba(18,83,73,.10),
    0 4px 14px rgba(18,83,73,.05);
}

html{
  color-scheme:light !important;
}

body{
  background:
    radial-gradient(
      circle at 8% 8%,
      rgba(62,197,171,.14),
      transparent 27%
    ),
    radial-gradient(
      circle at 92% 12%,
      rgba(121,224,203,.13),
      transparent 29%
    ),
    linear-gradient(
      180deg,
      #f9fffd 0%,
      #edf9f5 52%,
      #f8fffc 100%
    ) !important;

  color:var(--iz-text) !important;
}

body,
body p,
body li,
body span,
body label{
  color:var(--iz-text);
}

body a{
  color:var(--iz-primary-dark);
}

body header,
body .topBar,
body .siteHeader{
  background:rgba(255,255,255,.92) !important;
  border-bottom:1px solid var(--iz-line) !important;
  box-shadow:0 8px 28px rgba(18,83,73,.07) !important;
  backdrop-filter:blur(16px) saturate(145%);
  -webkit-backdrop-filter:blur(16px) saturate(145%);
}

body .crumb,
body .crumb a,
body .breadcrumb,
body .breadcrumb a{
  color:var(--iz-muted) !important;
}

body main{
  color:var(--iz-text) !important;
}

body .hero,
body .heroContent,
body .heroCard,
body .profileCard,
body .portraitCard,
body .introCard,
body .panel,
body .sectionCard,
body article,
body .contentCard,
body .storyCard,
body .timelineCard,
body .valueCard,
body .factCard,
body .quoteCard,
body .card{
  background:
    linear-gradient(
      145deg,
      rgba(255,255,255,.99),
      rgba(247,255,252,.97)
    ) !important;

  border-color:var(--iz-line) !important;
  box-shadow:var(--iz-shadow) !important;
  color:var(--iz-text) !important;
}

body h1,
body h2,
body h3,
body h4,
body strong{
  color:var(--iz-heading) !important;
}

body .muted,
body .lead,
body .subtitle,
body .heroText,
body .description,
body small{
  color:var(--iz-muted) !important;
}

body .eyebrow,
body .badge,
body .tag,
body .label,
body .sectionKicker,
body .chip{
  background:rgba(8,127,113,.09) !important;
  border-color:rgba(8,127,113,.22) !important;
  color:var(--iz-primary-dark) !important;
}

body .btn,
body .miniBtn,
body button,
body a.button{
  background:#ffffff !important;
  color:var(--iz-primary-dark) !important;
  border-color:var(--iz-line-strong) !important;
  box-shadow:0 6px 17px rgba(18,83,73,.06) !important;
}

body .btn.primary,
body .primary.btn,
body button.primary,
body a.primary{
  background:
    linear-gradient(
      135deg,
      var(--iz-primary-dark),
      var(--iz-primary-light)
    ) !important;

  color:#ffffff !important;
  border-color:transparent !important;
  box-shadow:0 12px 28px rgba(8,127,113,.22) !important;
}

body .btn:hover,
body button:hover,
body .miniBtn:hover{
  transform:translateY(-2px);
  border-color:var(--iz-primary) !important;
}

body img{
  border-color:var(--iz-line) !important;
}

body footer,
body .siteFooter{
  background:
    linear-gradient(
      180deg,
      rgba(230,247,242,.90),
      rgba(215,241,234,.98)
    ) !important;

  border-top:1px solid var(--iz-line) !important;
  color:var(--iz-muted) !important;
}

body :focus-visible{
  outline:3px solid rgba(8,127,113,.25) !important;
  outline-offset:3px;
}

@media (max-width:620px){
  body .hero,
  body .heroContent,
  body .panel,
  body .card{
    box-shadow:0 10px 28px rgba(18,83,73,.08) !important;
  }
}

@media (prefers-reduced-motion:reduce){
  *,
  *::before,
  *::after{
    animation:none !important;
    transition:none !important;
  }
}