/* Hagia Sophia — site-specific refinements layered over shared system */

:root[data-site="hagia-sophia"] {
  --facts-cols: 4;
  --steps-cols: 4;
  --trust-cols: 4;
}

/* Hero tone: luminous stone + subtle gold glow */
.hs-hero {
  position: relative;
  background: var(--hero-tint);
  isolation: isolate;
  overflow: hidden;
}
.hs-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(60% 50% at 15% 20%, oklch(from var(--color-accent) 90% 0.06 h / 0.28) 0%, transparent 60%),
    radial-gradient(50% 40% at 95% 90%, oklch(from var(--color-accent) 85% 0.05 h / 0.2) 0%, transparent 65%);
  pointer-events: none;
  z-index: 0;
}

/* Hero heading: Fraunces feels right with a touch of optical size */
.hs-h1 {
  font-family: var(--font-display);
  font-variation-settings: "opsz" 120;
  font-weight: 360;
  letter-spacing: -0.024em;
  font-size: var(--step-5);
  line-height: 1.02;
  color: var(--color-ink);
  text-wrap: balance;
}
.hs-h1 em {
  font-style: italic;
  font-weight: 360;
  color: var(--color-accent-ink);
}

/* Editorial "ornament" rule — thin gold, single dot */
.ornament {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--color-accent);
  margin-block: var(--s-4);
}
.ornament::before,
.ornament::after {
  content: "";
  height: 1px;
  width: 40px;
  background: currentColor;
  opacity: 0.55;
}
.ornament__dot {
  width: 5px; height: 5px;
  border-radius: 50%;
  background: currentColor;
}

/* A soft surface used for editorial sections */
.surface-paper {
  background: var(--color-bg);
  border: 1px solid var(--color-line);
  border-radius: var(--r-4);
}

/* Gold accent dot header marker */
.mark-dot {
  display: inline-block;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--color-accent);
  margin-right: 10px;
  translate: 0 -3px;
}

/* ===================================================================
   FOOTER CONTRAST FIX (light theme)
   shared/components.css'in .site-footer'ı --color-bg-deep kullanıyor
   ki bu Hagia (light) için 93% L (light). Default light text ile invisible
   oluyordu. Hagia için footer'ı dark warm brown'a override ediyoruz.
   =================================================================== */
[data-site="hagia-sophia"] .site-footer {
  background: oklch(22% 0.014 55);
  color: oklch(93% 0.008 78 / 0.92);
}
[data-site="hagia-sophia"] .site-footer .brand__name,
[data-site="hagia-sophia"] .site-footer .brand__meta {
  color: inherit;
}
[data-site="hagia-sophia"] .site-footer .footer-col h4 {
  color: oklch(93% 0.008 78 / 0.65);
}
[data-site="hagia-sophia"] .site-footer .footer-col a {
  color: oklch(93% 0.008 78 / 0.85);
}
[data-site="hagia-sophia"] .site-footer .site-footer__brand p,
[data-site="hagia-sophia"] .site-footer p {
  color: oklch(93% 0.008 78 / 0.72) !important;
}
[data-site="hagia-sophia"] .site-footer .footer-col a:hover {
  color: oklch(93% 0.008 78);
}
[data-site="hagia-sophia"] .site-footer__meta,
[data-site="hagia-sophia"] .site-footer .site-footer__meta {
  margin-top: var(--s-9);
  padding-top: var(--s-5);
  border-top: 1px solid oklch(93% 0.008 78 / 0.16);
  display: flex;
  justify-content: space-between;
  gap: var(--s-4);
  flex-wrap: wrap;
  font-size: var(--step-xs);
  color: oklch(93% 0.008 78 / 0.6);
}

/* ===================================================================
   BRAND LOGO — delivered identity
   Free-standing gold Hagia Sophia dome (no circle badge) + deep
   byzantine-green wordmark with italic "Sophia" + caps subline.
   Mark inherits currentColor → gold via --color-accent.
   =================================================================== */
[data-site="hagia-sophia"] .brand__mark {
  width: 42px;
  height: 40px;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: var(--color-accent);            /* gold dome */
}
[data-site="hagia-sophia"] .brand__mark .brand__logo {
  width: 100%;
  height: 100%;
}
[data-site="hagia-sophia"] .brand__name {
  color: var(--color-secondary);         /* deep byzantine green */
  font-family: var(--font-display);
  font-weight: 460;
  letter-spacing: -0.004em;
}
[data-site="hagia-sophia"] .brand__name em {
  font-style: italic;
  font-weight: 440;
  color: inherit;
}
[data-site="hagia-sophia"] .brand__meta {
  color: oklch(40% 0.05 160 / 0.82);     /* softened byzantine green */
}
/* Footer is dark — keep the gold dome; wordmark inherits cream */
[data-site="hagia-sophia"] .site-footer .brand__mark {
  color: var(--color-accent);
  border: 0;
  background: transparent;
}