:where(.sdmp-page) .text-link { width:fit-content }
/* A single, readable design example at a time. All demonstrations are illustrative. */
:where(.sdmp-page) .product-scene { height:100%; animation:sdmp-pd-scene-in .3s ease }
/* Seven disciplines, seven explicit scopes. Illustration frames remain equal. */
/* Handoff and process illustrations follow their layout tracks, without floating connectors. */
@keyframes sdmp-pd-scene-in {
from { opacity:.3; transform:translateY(var(--size-4)) }
to { opacity:1; transform:none }
}
/* Keep compact illustrative content inside its fixed scene frame. */
:where(.sdmp-page) .sdmp-measure-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--size-28) }
@media(max-width:650px) {
:where(.sdmp-page) .sdmp-measure-grid { grid-template-columns:1fr }
}
/* Stronger separation within the existing Avielon palette. */
:where(.sdmp-page) #platformlar { background:var(--color-surface-accent) }
:where(.sdmp-page) #yaklasim h3 { color:var(--color-primary) }
:where(.sdmp-page) .product-hero-grid { grid-template-columns:1fr 1.08fr; gap:var(--size-48) }
:where(.sdmp-page) .sdmp-dashboard { background:var(--color-surface); color:var(--color-primary); border-radius:var(--size-9); overflow:hidden }
:where(.sdmp-page) .sdmp-toolbar { display:flex; justify-content:space-between; align-items:center; padding:var(--size-17) var(--size-19); border-bottom:var(--size-1) var(--border-style) var(--color-border); font-size:var(--size-12); gap:var(--size-10) }
:where(.sdmp-page) .sdmp-toolbar small { font:var(--font-weight-medium) var(--size-9) var(--font-family-mono); letter-spacing:var(--letter-spacing-04em) }
:where(.sdmp-page) .sdmp-dashboard-content { padding:var(--size-22) }
:where(.sdmp-page) .sdmp-dashboard h3 { font:var(--font-weight-display) var(--size-29)/var(--line-height-1-2) var(--font-family-display); margin:0 0 var(--size-10) }
:where(.sdmp-page) .sdmp-dashboard p { font-size:var(--size-12); color:var(--color-text-muted); line-height:var(--line-height-1-7) }
:where(.sdmp-page) .sdmp-filters { display:flex; flex-wrap:wrap; gap:var(--size-8); margin:var(--size-21) 0 var(--size-18) }
:where(.sdmp-page) .sdmp-filters button { border:var(--size-1) var(--border-style) var(--color-border-strong); border-radius:var(--size-5); background:var(--color-surface); color:var(--color-primary); padding:var(--size-8) var(--size-12); font:var(--font-weight-medium) var(--size-11)/var(--line-height-1-5) var(--font-family-body) }
:where(.sdmp-page) .sdmp-filters button[aria-pressed=true] { background:var(--color-primary); border-color:var(--color-primary); color:var(--color-white) }
:where(.sdmp-page) .sdmp-list-head { display:grid; grid-template-columns:1.5fr 1fr; gap:var(--size-13); align-items:center }
:where(.sdmp-page) .sdmp-request { display:grid; grid-template-columns:1.5fr 1fr; gap:var(--size-13); align-items:center }
:where(.sdmp-page) .sdmp-list-head { padding:0 var(--size-12) var(--size-9); font-size:var(--size-10); color:var(--color-text-muted) }
:where(.sdmp-page) .sdmp-request { padding:var(--size-15) var(--size-12); background:var(--color-background); border-radius:var(--size-5); margin-bottom:var(--size-9); min-height:var(--size-69) }
:where(.sdmp-page) .sdmp-request strong { font-size:var(--size-12); display:block }
:where(.sdmp-page) .sdmp-request small { font-size:var(--size-10); display:block; margin-top:var(--size-4); color:var(--color-text-muted) }
:where(.sdmp-page) .sdmp-badge { background:var(--color-surface-accent); color:var(--color-primary); padding:var(--size-6) var(--size-9); border-radius:var(--size-4); font:var(--font-weight-medium) var(--size-10)/var(--line-height-1-4) var(--font-family-body); justify-self:start }
:where(.sdmp-page) .sdmp-badge.sdmp-done { background:var(--color-primary); color:var(--color-white) }
:where(.sdmp-page) .sdmp-requests { min-height:var(--size-303) }
:where(.sdmp-page) .sdmp-dashboard-bottom { border-top:var(--size-1) var(--border-style) var(--color-border); padding-top:var(--size-12); font-size:var(--size-11); display:flex; justify-content:space-between; gap:var(--size-15) }
:where(.sdmp-page) .sdmp-dashboard-bottom strong { font-weight:var(--font-weight-medium) }
:where(.sdmp-page) .sdmp-hero-note { color:var(--color-background); font-size:var(--size-12); line-height:var(--line-height-1-75); margin-top:var(--size-18) }
:where(.sdmp-page) .sdmp-outcomes { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--size-24) }
:where(.sdmp-page) .sdmp-outcomes article { background:var(--color-surface-secondary); padding:var(--size-30); border-radius:var(--size-9) }
:where(.sdmp-page) .sdmp-outcomes h3 { font:var(--font-weight-bold) var(--size-21)/var(--line-height-1-4) var(--font-family-body); margin:var(--size-20) 0 var(--size-14) }
:where(.sdmp-page) .sdmp-outcomes p { font-size:var(--size-15); color:var(--color-text) }
:where(.sdmp-page) .sdmp-features { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--size-24) }
:where(.sdmp-page) .sdmp-features article { background:var(--color-surface); border-radius:var(--size-9); padding:var(--size-29); display:flex; flex-direction:column }
:where(.sdmp-page) .sdmp-features h3 { font:var(--font-weight-bold) var(--size-20)/var(--line-height-1-4) var(--font-family-body); margin:var(--size-20) 0 var(--size-13) }
:where(.sdmp-page) .sdmp-features p { font-size:var(--size-14); color:var(--color-text); margin-bottom:var(--size-22) }
:where(.sdmp-page) .sdmp-output { margin-top:auto; background:var(--color-surface-secondary); color:var(--color-primary); padding:var(--size-15); border-radius:var(--size-5); font-size:var(--size-12); line-height:var(--line-height-1-7) }
:where(.sdmp-page) .sdmp-output b { font:var(--font-weight-medium) var(--size-10) var(--font-family-mono); display:block; margin-bottom:var(--size-7) }
:where(.sdmp-page) .product-board { background:var(--color-primary); border-radius:var(--size-12); padding:var(--size-30); color:var(--color-white) }
:where(.sdmp-page) .product-board h3 { font:var(--font-weight-display) var(--size-29)/var(--line-height-1-25) var(--font-family-display); color:var(--color-white); margin:0 0 var(--size-22) }
:where(.sdmp-page) .product-board .product-note { color:var(--color-background) }
:where(.sdmp-page) .product-board .product-connector { color:var(--color-highlight); font-size:var(--size-25); height:var(--size-30) }
:where(.sdmp-page) .product-step { display:flex; align-items:flex-start; gap:var(--size-16); background:var(--color-surface-secondary); padding:var(--size-20); border-radius:var(--size-6); color:var(--color-primary) }
:where(.sdmp-page) .product-step .product-icon { background:var(--color-surface); border-color:var(--color-white) }
:where(.sdmp-page) .product-step strong { display:block; font-size:var(--size-15); line-height:var(--line-height-1-6) }
:where(.sdmp-page) .product-step p { font-size:var(--size-13); color:var(--color-text); margin-top:var(--size-4) }
:where(.sdmp-page) .sdmp-role-tabs { display:flex; gap:var(--size-8); flex-wrap:wrap; margin-bottom:var(--size-20) }
:where(.sdmp-page) .sdmp-role-tabs button { border:var(--size-1) var(--border-style) var(--color-border); background:transparent; color:var(--color-white); border-radius:var(--size-5); padding:var(--size-9) var(--size-13); font-size:var(--size-12) }
:where(.sdmp-page) .sdmp-role-tabs button[aria-selected=true] { background:var(--color-highlight); color:var(--color-primary); border-color:var(--color-highlight) }
:where(.sdmp-page) .sdmp-role-tabs button:focus-visible { outline-color:var(--color-white) }
:where(.sdmp-page) .sdmp-role-panel { background:var(--color-surface); border-radius:var(--size-7); color:var(--color-primary); padding:var(--size-25); min-height:var(--size-295) }
:where(.sdmp-page) .sdmp-role-panel h4 { font:var(--font-weight-bold) var(--size-20)/var(--line-height-1-4) var(--font-family-body); margin-bottom:var(--size-10) }
:where(.sdmp-page) .sdmp-role-panel>p { font-size:var(--size-13); color:var(--color-text) }
:where(.sdmp-page) .sdmp-permissions { display:grid; gap:var(--size-10); margin-top:var(--size-23) }
:where(.sdmp-page) .sdmp-permissions>div { display:flex; align-items:center; gap:var(--size-12); background:var(--color-surface-secondary); padding:var(--size-12) var(--size-14); font-size:var(--size-13); border-radius:var(--size-4) }
:where(.sdmp-page) .sdmp-permissions svg { width:var(--size-20); height:var(--size-20) }
:where(.sdmp-page) .sdmp-role-note { font-size:var(--size-12); line-height:var(--line-height-relaxed); margin-top:var(--size-20); color:var(--color-background) }
:where(.sdmp-page) .sdmp-report { background:var(--color-surface); padding:var(--size-26); border-radius:var(--size-8); color:var(--color-primary) }
:where(.sdmp-page) .sdmp-report h3 { color:var(--color-primary); margin-bottom:var(--size-8) }
:where(.sdmp-page) .sdmp-report>p { font-size:var(--size-12); color:var(--color-text-muted) }
:where(.sdmp-page) .sdmp-bars { display:grid; gap:var(--size-18); margin-top:var(--size-25) }
:where(.sdmp-page) .sdmp-bar-row>div:first-child { display:flex; justify-content:space-between; font-size:var(--size-12); margin-bottom:var(--size-8) }
:where(.sdmp-page) .sdmp-track { height:var(--size-13); background:var(--color-surface-secondary); border-radius:var(--size-4); overflow:hidden }
:where(.sdmp-page) .sdmp-track>span { display:block; height:100%; background:var(--color-accent) }
:where(.sdmp-page) .sdmp-bar-row:last-child .sdmp-track>span { background:var(--color-primary) }
:where(.sdmp-page) .sdmp-report-foot { margin-top:var(--size-25); padding:var(--size-17); background:var(--color-surface-secondary); font-size:var(--size-13); border-radius:var(--size-5) }
:where(.sdmp-page) .sdmp-report-foot b { display:block; margin-bottom:var(--size-7) }
:where(.sdmp-page) .sdmp-mini-states { display:grid; grid-template-columns:1fr 1fr; gap:var(--size-15); margin-top:var(--size-22) }
:where(.sdmp-page) .sdmp-mini-states>div { padding:var(--size-19); background:var(--color-surface-secondary); border-radius:var(--size-6); color:var(--color-primary); font-size:var(--size-13) }
:where(.sdmp-page) .sdmp-mini-states strong { display:block; margin-bottom:var(--size-5) }
:where(.sdmp-page) .product-scope-note { margin-top:var(--size-25); font-size:var(--size-13); color:var(--color-text-muted) }
:where(.sdmp-page) .product-related { display:grid; grid-template-columns:1fr 1fr; gap:var(--size-25) }
:where(.sdmp-page) .product-related article { background:var(--color-surface); padding:var(--size-30); border-radius:var(--size-9) }
:where(.sdmp-page) .product-related h3 { font:var(--font-weight-display) var(--size-29)/var(--line-height-1-2) var(--font-family-display); margin-bottom:var(--size-15) }
:where(.sdmp-page) .product-related p { font-size:var(--size-15); margin-bottom:var(--size-24) }
:where(.sdmp-page) .product-board .product-icon svg { stroke-width:1.6 }
@media(max-width:1100px) {
:where(.sdmp-page) .product-hero-grid { gap:var(--size-30) }
:where(.sdmp-page) .sdmp-features { grid-template-columns:1fr 1fr }
:where(.sdmp-page) .sdmp-dashboard-content { padding:var(--size-18) }
:where(.sdmp-page) .sdmp-request { padding:var(--size-13) var(--size-10) }
:where(.sdmp-page) .product-board { padding:var(--size-25) }
}
@media(max-width:950px) {
:where(.sdmp-page) .product-hero-grid { grid-template-columns:1fr }
:where(.sdmp-page) .sdmp-outcomes { grid-template-columns:1fr }
:where(.sdmp-page) .product-hero-grid>.product-board { max-width:var(--size-650) }
}
@media(max-width:650px) {
:where(.sdmp-page) .sdmp-features { grid-template-columns:1fr }
:where(.sdmp-page) .sdmp-outcomes article { padding:var(--size-25) }
:where(.sdmp-page) .sdmp-features article { padding:var(--size-25) }
:where(.sdmp-page) .product-related article { padding:var(--size-25) }
:where(.sdmp-page) .sdmp-dashboard h3 { font-size:var(--size-26) }
:where(.sdmp-page) .sdmp-toolbar { padding:var(--size-15) }
:where(.sdmp-page) .sdmp-toolbar small { font-size:var(--size-8) }
:where(.sdmp-page) .sdmp-dashboard-content { padding:var(--size-17) }
:where(.sdmp-page) .sdmp-filters button { font-size:var(--size-10); padding:var(--size-8) var(--size-10) }
:where(.sdmp-page) .sdmp-list-head { grid-template-columns:1.2fr 1fr; gap:var(--size-8) }
:where(.sdmp-page) .sdmp-request { grid-template-columns:1.2fr 1fr; gap:var(--size-8) }
:where(.sdmp-page) .sdmp-request strong { font-size:var(--size-11) }
:where(.sdmp-page) .sdmp-badge { font-size:var(--size-9); padding:var(--size-6) var(--size-8) }
:where(.sdmp-page) .sdmp-requests { min-height:var(--size-303) }
:where(.sdmp-page) .sdmp-dashboard-bottom { font-size:var(--size-10) }
:where(.sdmp-page) .product-board { padding:var(--size-23) }
:where(.sdmp-page) .product-step { padding:var(--size-17); gap:var(--size-13) }
:where(.sdmp-page) .product-step strong { font-size:var(--size-14) }
:where(.sdmp-page) .product-step p { font-size:var(--size-13) }
:where(.sdmp-page) .sdmp-role-panel { padding:var(--size-20) }
:where(.sdmp-page) .sdmp-role-tabs button { font-size:var(--size-11) }
:where(.sdmp-page) .sdmp-report { padding:var(--size-22) }
:where(.sdmp-page) .sdmp-report h3 { font-size:var(--size-25) }
:where(.sdmp-page) .sdmp-mini-states { grid-template-columns:1fr }
:where(.sdmp-page) .product-related h3 { font-size:var(--size-27) }
}
:where(.sdmp-page) #ilk-kullanim .sdmp-onboarding-board { background:var(--color-surface); color:var(--color-heading) }
:where(.sdmp-page) #ilk-kullanim .sdmp-onboarding-board h3 { color:var(--color-heading) }
:where(.sdmp-page) #ilk-kullanim .sdmp-onboarding-board .product-connector { color:var(--color-heading) }
:where(.sdmp-page) #ilk-kullanim .sdmp-onboarding-board .product-note { color:var(--color-text) }
:where(.sdmp-page) #ilk-kullanim .sdmp-onboarding-board .product-step { background:var(--color-surface-accent); color:var(--color-heading) }
:where(.sdmp-page) #ilk-kullanim .sdmp-onboarding-board .product-step p { color:var(--color-text) }
:where(.sdmp-page) #ilk-kullanim .sdmp-onboarding-board .product-icon { background:var(--color-surface); border-color:var(--color-white); color:var(--color-heading) }
:where(.sdmp-page) .feature-grid { border: none; overflow: visible; }
:where(.sdmp-page) .sdmp-measure-1 { width: 60% }
:where(.sdmp-page) .sdmp-measure-2 { width: 100% }
:where(.sdmp-page) .sdmp-measure-3 { width: 80% }
