/* Serdar Alptekin Ecosystem v2 — editorial/public surface */
:root{
  --sa-font:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI Variable","Segoe UI",Roboto,sans-serif;
  --sa-reading:72ch;
  --sa-page:clamp(16px,4vw,48px);
  --sa-card:clamp(18px,2.4vw,28px);
  --sa-touch:44px;
  --sa-radius-card:22px;
}
html{font-family:var(--sa-font);font-size:clamp(16px,1.05vw,18px);}
body{line-height:1.62;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;}
.shell{container-type:inline-size;container-name:site-shell;width:min(calc(100% - (var(--sa-page) * 2)),1240px);max-width:1240px;}
.hero-main,.hero-side,.card,.page-hero,.article-header,.article-body{border-radius:var(--sa-radius-card);}
.hero-main,.hero-side,.card,.page-hero{padding:var(--sa-card);}
.lead,.page-hero p,.article-body p,.article-body li,.section-head p,.card p{max-width:var(--sa-reading);}
.btn,.nav a,.nav button,button,input,select,textarea{min-height:var(--sa-touch);}
.article-body{font-size:1rem;}.article-body p,.article-body li{line-height:1.82;}
.grid,.feature-grid,.content-classes,.product-capture-grid{container-type:inline-size;}
.ecosystem-pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px}.ecosystem-pillar{padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}.ecosystem-pillar strong,.ecosystem-pillar span{display:block}.ecosystem-pillar span{margin-top:5px;color:var(--muted);font-size:.82rem;line-height:1.5}
.live-product{display:grid;gap:5px;padding:15px;border:1px solid color-mix(in srgb,var(--accent) 24%,var(--line));border-radius:16px;background:linear-gradient(145deg,var(--soft),var(--surface))}.live-product-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.live-product>strong{font-size:1.35rem}.live-product>span,.live-product>small{color:var(--muted)}.live-dot{color:#16a34a}.live-product[data-state="offline"] .live-dot{color:#d97706}.live-changelog{display:grid;gap:12px}.live-change{display:grid;grid-template-columns:minmax(160px,.45fr) minmax(0,1fr);gap:16px;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}.live-change small{display:block;margin-top:4px;color:var(--muted)}.live-change ul{margin:0;padding-left:18px;color:var(--muted);line-height:1.55}
.writing-tools{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;margin:18px 0}.writing-search{width:100%;padding:11px 13px;border:1px solid var(--line);border-radius:13px;background:var(--surface);color:var(--text);font:inherit}.writing-filters{display:flex;gap:7px;flex-wrap:wrap}.writing-filters button{padding:8px 11px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--muted);font:inherit;font-weight:750;cursor:pointer}.writing-filters button[aria-pressed="true"]{border-color:color-mix(in srgb,var(--accent) 36%,var(--line));background:var(--soft);color:var(--accent)}[data-writing-card][hidden]{display:none!important}
.professional-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.professional-fact{padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}.professional-fact strong,.professional-fact span{display:block}.professional-fact span{margin-top:5px;color:var(--muted);font-size:.82rem;line-height:1.5}
@container site-shell (max-width:900px){.hero{grid-template-columns:1fr}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.section-head{align-items:flex-start;flex-direction:column}.writing-tools{grid-template-columns:1fr}.professional-facts{grid-template-columns:1fr 1fr}}
@container site-shell (max-width:660px){.grid,.grid.two,.feature-grid,.project-facts,.content-classes,.product-capture-grid,.contact-form,.ecosystem-pillars,.professional-facts{grid-template-columns:1fr}.hero h1,.page-hero h1{max-width:16ch;line-height:1}.top{border-radius:16px}.live-change{grid-template-columns:1fr}.writing-filters{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}}
@media (pointer:coarse){a.btn,button,input,select,textarea{min-height:44px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}