/* Statik içerik sayfaları (tools/static-pages/generate.mjs). Platform yazı tipi; yazı tipi indirilmez. Karakter görselleri kırpılmaz ve opak kutuya konmaz. */
:root{--bg:#F6F7FA;--surface:#fff;--text:#182331;--muted:#4A5568;--hair:#DFE3EA;--ink:#182331;--ink-fg:#fff;--focus:#2F6FEB;--fam:#7353D6;--tint:#EDE8FF;color-scheme:light dark}
@media (prefers-color-scheme:dark){:root{--bg:#0B111C;--surface:#121B2A;--text:#EEF2F8;--muted:#B5C0D0;--hair:#2A3648;--ink:#EEF2F8;--ink-fg:#0B111C;--focus:#8FB6FF}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:17px/1.65 -apple-system,BlinkMacSystemFont,system-ui,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
a{color:inherit}
a:focus-visible,summary:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:6px}
img{max-width:100%;height:auto}
h1,h2,h3,h4{line-height:1.2;text-wrap:balance;letter-spacing:-.01em}
p,li,dd{text-wrap:pretty}
.sp-wrap{width:min(1120px,100% - 32px);margin-inline:auto}
.sp-skip{position:absolute;left:12px;top:-60px;z-index:9;padding:10px 16px;border-radius:999px;background:var(--ink);color:var(--ink-fg);text-decoration:none;font-weight:600}
.sp-skip:focus{top:12px}
main:focus{outline:none}

.sp-top{position:sticky;top:0;z-index:5;background:color-mix(in srgb,var(--bg) 86%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--hair)}
.sp-top-in{display:flex;align-items:center;gap:12px 20px;flex-wrap:wrap;min-height:64px;padding-block:8px}
.sp-brand{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:19px;text-decoration:none;margin-right:auto}
.sp-nav{display:flex;align-items:center;gap:4px 18px;flex-wrap:wrap;font-size:15px;font-weight:600}
.sp-nav a{text-decoration:none;padding:8px 2px}
.sp-nav a:hover{text-decoration:underline;text-underline-offset:4px}
.sp-cta-sm{padding:8px 16px!important;border-radius:999px;background:var(--ink);color:var(--ink-fg)}
.sp-cta-sm:hover{text-decoration:none!important;opacity:.9}
.sp-langs{display:flex;align-items:center;gap:6px;margin:0;font-size:14px;font-weight:600;line-height:1}
.sp-langs a{text-decoration:none;padding:6px 4px;color:var(--muted)}
.sp-langs a[aria-current]{color:var(--text);text-decoration:underline;text-underline-offset:4px}

.sp-kicker{margin:0 0 8px;font-size:14px;font-weight:650;color:var(--muted)}
.sp-lead{font-size:clamp(18px,2.2vw,21px);line-height:1.55;color:var(--text);max-width:62ch}
.sp-note{font-size:15px;color:var(--muted);max-width:70ch}
.sp-code{font-size:.42em;font-weight:650;letter-spacing:.04em;color:var(--muted);vertical-align:middle;white-space:nowrap}
.sp-actions{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0 0}
.sp-btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border-radius:999px;border:1px solid var(--hair);background:var(--surface);font-weight:600;font-size:16px;text-decoration:none}
.sp-btn.primary{background:var(--ink);border-color:var(--ink);color:var(--ink-fg)}
.sp-btn:active{transform:scale(.98)}

.sp-hero{padding:clamp(48px,9vw,112px) 0 clamp(32px,5vw,56px)}
.sp-hero h1{margin:0 0 16px;font-size:clamp(38px,6.4vw,72px);letter-spacing:-.025em;max-width:16ch}
.sp-hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:24px;align-items:center}
.sp-hero-art{display:grid;grid-template-columns:repeat(4,1fr);align-items:end;gap:2%;padding:24px 4% 0;border-radius:40px;background:radial-gradient(110% 80% at 50% 100%,#EDE8FF,transparent 72%)}
@media (prefers-color-scheme:dark){.sp-hero-art{background:radial-gradient(110% 80% at 50% 100%,#2A2350,transparent 72%)}}
.sp-hero-art img{width:100%;max-height:300px;object-fit:contain}
.sp-hero-art img:nth-child(even){transform:translateY(-14px)}
.sp-all>h2,.sp-more>h2,.sp-sci>h2{font-size:clamp(26px,3.4vw,36px);margin:48px 0 8px}
.sp-family{margin:28px 0 8px}
.sp-family h3{font-size:22px;margin:0 0 14px}
.sp-family h3 span{font-weight:500;color:var(--muted)}
.sp-cards{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:14px}
.sp-card a{display:grid;grid-template-columns:84px 1fr;gap:14px;align-items:center;height:100%;padding:14px 16px 14px 10px;border-radius:22px;background:linear-gradient(135deg,color-mix(in srgb,var(--tint) 70%,var(--surface)),var(--surface) 62%);border:1px solid var(--hair);text-decoration:none;transition:border-color .2s,transform .2s}
.sp-card a:hover{border-color:var(--fam)}
.sp-card a:active{transform:scale(.99)}
.sp-card img{width:84px;height:140px;object-fit:contain}
.sp-card-txt{display:grid;gap:2px;font-size:15px;line-height:1.45;color:var(--muted)}
.sp-card-txt strong{font-size:17px;color:var(--text)}
.sp-card-txt .sp-code{font-size:12px}
@media (prefers-color-scheme:dark){.sp-card a{background:linear-gradient(135deg,color-mix(in srgb,var(--fam) 22%,var(--surface)),var(--surface) 62%)}}
.sp-sci{padding-bottom:24px}
.sp-sci p{max-width:68ch}

.sp-crumbs ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:20px 0 0;padding:0;font-size:14px;color:var(--muted)}
.sp-crumbs li+li::before{content:"›";margin-right:6px}
.sp-crumbs a{text-decoration:none}
.sp-crumbs a:hover{text-decoration:underline}
.sp-arch-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:32px;align-items:center;padding:clamp(24px,5vw,56px) 0 24px}
.sp-arch-hero h1{margin:0 0 14px;font-size:clamp(36px,5.6vw,64px);letter-spacing:-.025em}
.sp-arch-hero .sp-kicker{color:var(--fam)}
@media (prefers-color-scheme:dark){.sp-arch-hero .sp-kicker{color:color-mix(in srgb,var(--fam) 55%,#fff)}}
.sp-strengths{margin:0;font-weight:600}
.sp-arch-art{position:relative;display:flex;justify-content:center;align-items:flex-end;gap:4%;padding:24px 8px 0;border-radius:40px;background:radial-gradient(120% 90% at 50% 100%,color-mix(in srgb,var(--tint) 85%,transparent),transparent 70%)}
@media (prefers-color-scheme:dark){.sp-arch-art{background:radial-gradient(120% 90% at 50% 100%,color-mix(in srgb,var(--fam) 30%,transparent),transparent 70%)}}
.sp-arch-art img{width:46%;max-height:420px;object-fit:contain}
.sp-toc{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.sp-toc a{font-size:15px;font-weight:600;padding:6px 14px;border-radius:999px;border:1px solid var(--hair);text-decoration:none}
.sp-toc a:hover{border-color:var(--fam)}

.sp-variants{display:grid;gap:24px;padding-bottom:16px}
.sp-variant{scroll-margin-top:84px;padding:clamp(22px,4vw,44px);border-radius:32px;background:var(--surface);border:1px solid var(--hair);border-top:6px solid var(--fam)}
.sp-variant>h2{margin:0 0 8px;font-size:clamp(28px,3.6vw,40px)}
.sp-variant>.sp-kicker{color:var(--fam)}
@media (prefers-color-scheme:dark){.sp-variant>.sp-kicker{color:color-mix(in srgb,var(--fam) 55%,#fff)}}
.sp-variant h3{margin:36px 0 10px;padding-top:24px;border-top:1px solid var(--hair);font-size:clamp(21px,2.4vw,25px)}
.sp-variant h4{margin:20px 0 6px;font-size:17px}
.sp-variant p,.sp-variant ul,.sp-variant ol,.sp-variant dl{max-width:72ch}
.sp-variant ul,.sp-variant ol{padding-left:1.2em;margin:6px 0}
.sp-variant li{margin:4px 0}
.sp-variant dl{display:grid;grid-template-columns:minmax(120px,190px) 1fr;gap:6px 18px;margin:8px 0 0}
.sp-variant dt{font-weight:650;color:var(--muted);font-size:15px;padding-top:2px}
.sp-variant dd{margin:0}
.sp-days{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:20px}
.sp-days>div{padding:18px 20px;border-radius:22px;background:color-mix(in srgb,var(--tint) 55%,var(--surface))}
@media (prefers-color-scheme:dark){.sp-days>div{background:color-mix(in srgb,var(--fam) 16%,var(--surface))}}
.sp-days h4{margin-top:0}
.sp-days p{margin:0}
.sp-moments li{margin:8px 0}

.sp-prose{max-width:780px;padding:clamp(32px,6vw,72px) 0 24px}
.sp-prose h1{font-size:clamp(32px,5vw,52px);margin:0 0 14px}
.sp-prose h2{font-size:clamp(22px,2.8vw,28px);margin:40px 0 10px}
.sp-prose h3{font-size:20px;margin:28px 0 8px}
.sp-prose .card{padding:16px 20px;border-radius:20px;background:var(--surface);border:1px solid var(--hair);margin:12px 0}
.sp-prose table{border-collapse:collapse;width:100%;font-size:15px;display:block;overflow-x:auto}
.sp-prose th,.sp-prose td{border-bottom:1px solid var(--hair);padding:8px 10px;text-align:left;vertical-align:top}
.sp-more{padding:8px 0 32px}

.sp-foot{margin-top:48px;padding:32px 0 48px;border-top:1px solid var(--hair);font-size:15px;color:var(--muted)}
.sp-limit{max-width:72ch;margin:0 0 14px}
.sp-foot-links{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0 0 12px;font-weight:600}
.sp-foot-links a{color:var(--text)}
.sp-copy{margin:0}

@media (max-width:760px){
  body{font-size:16.5px}
  .sp-hero{grid-template-columns:1fr;padding-top:32px}
  .sp-hero-art{order:-1;max-width:420px}
  .sp-arch-hero{grid-template-columns:1fr;gap:12px}
  .sp-arch-art{order:-1;max-width:420px;margin-inline:auto;width:100%}
  .sp-arch-art img{max-height:300px}
  .sp-days{grid-template-columns:1fr}
  .sp-variant dl{grid-template-columns:1fr;gap:2px}
  .sp-variant dd{margin-bottom:10px}
  .sp-nav{order:3;width:100%;justify-content:flex-start}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
@media print{.sp-top,.sp-actions,.sp-toc,.sp-skip{display:none}.sp-variant{border:0;padding:0}}