/* D proposal — detailed, animated service-scope stories. */
.design-d .services .section-heading { margin-bottom: clamp(62px,7vw,105px); }
.design-d .d-scope-stories { display: grid; gap: clamp(105px,12vw,180px); }
.design-d .d-scope-story { display: grid; grid-template-columns: minmax(360px,.82fr) minmax(570px,1.18fr); gap: clamp(52px,7vw,100px); align-items: center; }
.design-d .d-scope-story.is-reverse .d-scope-copy { order: 2; }
.design-d .d-scope-story.is-reverse .d-scope-visual { order: 1; }
.design-d .d-scope-copy { min-width: 0; }
.design-d .d-scope-kicker { display: flex; align-items: center; gap: 13px; color: #e76b27; }
.design-d .d-scope-kicker span { width: 41px; height: 41px; display: grid; place-items: center; color: #fff; background: #102d51; border-radius: 50%; font: 700 13px/1 Arial,sans-serif; }
.design-d .d-scope-kicker b { font-size: 11px; letter-spacing: .16em; }
.design-d .d-scope-copy h3 { margin: 21px 0 15px; color: #102d51; font-size: clamp(32px,3.1vw,45px); letter-spacing: -.035em; }
.design-d .d-scope-lead { margin: 0 0 22px; color: #102d51 !important; font-size: clamp(20px,2vw,27px) !important; font-weight: 700; line-height: 1.65; }
.design-d .d-scope-copy > p:not(.d-scope-lead) { margin: 0; color: #5b6c7d; font-size: 15px; line-height: 2; }
.design-d .d-scope-details { margin: 31px 0 0; border-top: 1px solid #d8e0e8; }
.design-d .d-scope-details > div { padding: 17px 0; display: grid; grid-template-columns: 145px 1fr; gap: 18px; border-bottom: 1px solid #d8e0e8; }
.design-d .d-scope-details dt { color: #102d51; font-size: 14px; font-weight: 750; }
.design-d .d-scope-details dd { margin: 0; color: #5b6c7d; font-size: 13px; line-height: 1.8; }
.design-d .d-scope-details dd small { display: inline-block; margin-left: 6px; padding: 1px 6px; color: #bc531b; background: #fff0e7; border-radius: 2px; font-size: 9px; font-weight: 700; }

.design-d .d-scope-visual { position: relative; min-width: 0; min-height: 555px; margin: 0; perspective: 1200px; }
.design-d .d-scope-visual::before { content:""; position:absolute; inset:6% -3% 11% 5%; border-radius:50%; background:radial-gradient(circle,#d8e5f2 0,#eff4f8 61%,transparent 72%); }
.design-d .d-scope-screen { position: absolute; inset: 38px 12px 51px; overflow: hidden; background: #f7f9fb; border: 1px solid #becbd7; border-radius: 13px; box-shadow: 0 38px 60px #183b6028,0 9px 18px #183b6014; transform: rotateX(2deg) rotateY(-5deg); transform-origin: center; animation: d-scope-camera 9s cubic-bezier(.4,0,.2,1) infinite; }
.design-d .d-scope-story.is-reverse .d-scope-screen { transform: rotateX(2deg) rotateY(5deg); animation-name: d-scope-camera-reverse; }
.design-d .d-scope-browserbar { height: 52px; padding: 0 18px; display: flex; align-items: center; gap: 7px; color: #6e8193; background: #fff; border-bottom: 1px solid #dce4eb; }
.design-d .d-scope-browserbar i { width: 8px; height: 8px; border-radius: 50%; background: #d2dae2; }
.design-d .d-scope-browserbar i:first-child { background: #e76b27; }
.design-d .d-scope-browserbar span { margin-left: 11px; font-size: 9px; letter-spacing: .14em; }
.design-d .d-scope-visual figcaption { position: absolute; inset: auto 10px 14px; color: #748697; text-align: center; font-size: 9px; }
.design-d .d-focus-lens { position: absolute; z-index: 7; width: 108px; height: 108px; display: grid; place-items: center; border: 3px solid #e76b27; border-radius: 50%; box-shadow: 0 0 0 7px #ffffffbf,0 14px 25px #17395e2b,inset 0 0 0 1px #ffffff; backdrop-filter: brightness(1.08) saturate(1.15); pointer-events: none; }
.design-d .d-focus-lens::after { content:""; position:absolute; width:42px; height:6px; right:-34px; bottom:4px; background:#e76b27; border-radius:4px; rotate:45deg; transform-origin:left center; }
.design-d .d-focus-lens span { padding:4px 7px; color:#fff; background:#e76b27; border-radius:2px; font-size:8px; letter-spacing:.12em; }

/* PLAN visual */
.design-d .d-plan-toolbar { margin: 22px; height: 55px; padding: 0 14px; display: grid; grid-template-columns: 28px 1fr auto; gap: 10px; align-items: center; background:#fff; border:1px solid #d5dee7; border-radius:7px; box-shadow:0 8px 18px #244a7010; }
.design-d .d-plan-toolbar .pro-icon { width:22px; height:22px; color:#315b83; }
.design-d .d-plan-toolbar span { color:#183451; font-size:13px; font-weight:700; }
.design-d .d-plan-toolbar b { padding:7px 12px; color:#fff; background:#1765d4; border-radius:3px; font-size:10px; }
.design-d .d-plan-grid { margin: 0 22px; display:grid; grid-template-columns:1.08fr .92fr; gap:15px; }
.design-d .d-plan-table,.design-d .d-intent-map { min-height:310px; padding:18px; background:#fff; border:1px solid #d8e0e8; border-radius:7px; }
.design-d .d-plan-table > small,.design-d .d-intent-map > small { color:#7c8c9b; font-size:8px; letter-spacing:.12em; }
.design-d .d-plan-table > div { padding:15px 5px; display:flex; justify-content:space-between; border-bottom:1px solid #e5ebf0; color:#536a7f; font-size:11px; }
.design-d .d-plan-table > div.is-selected { margin:4px -7px; padding-inline:12px; color:#102d51; background:#f2f8fe; border:1px solid #accce8; border-radius:4px; font-weight:700; }
.design-d .d-plan-table b { color:#e76b27; }
.design-d .d-intent-map strong { display:block; margin:29px 0 8px; color:#102d51; font-size:24px; }
.design-d .d-intent-map p { color:#5b6c7d; font-size:12px!important; line-height:1.75; }
.design-d .d-intent-map > div { margin-top:27px; display:flex; flex-wrap:wrap; gap:7px; }
.design-d .d-intent-map > div span { padding:6px 10px; color:#315b83; background:#edf4fa; border-radius:3px; font-size:9px; }
.design-d .d-scope-plan .d-focus-lens { top:183px; left:42%; animation:d-plan-lens 9s cubic-bezier(.4,0,.2,1) infinite; }
.design-d .d-scene-note { position:absolute; z-index:8; right:25px; bottom:20px; width:220px; padding:14px 16px; color:#fff; background:#102d51; border-radius:6px; box-shadow:0 18px 28px #183b602e; animation:d-note-rise 9s ease infinite; }
.design-d .d-scene-note b,.design-d .d-scene-note span { display:block; }
.design-d .d-scene-note b { font-size:12px; }.design-d .d-scene-note span { margin-top:3px; color:#cad6e1; font-size:9px; }

/* WRITE visual */
.design-d .d-editor-grid { height:calc(100% - 52px); padding:24px; display:grid; grid-template-columns:1.25fr .75fr; gap:16px; }
.design-d .d-document-page,.design-d .d-review-rail { padding:23px; background:#fff; border:1px solid #d8e0e8; border-radius:6px; }
.design-d .d-document-page > small,.design-d .d-review-rail > small { color:#7a8b9b; font-size:8px; letter-spacing:.12em; }
.design-d .d-document-page h4 { margin:18px 0; color:#102d51; font-size:23px; }
.design-d .d-document-page p { color:#52697e; font-size:12px!important; line-height:2; }
.design-d .d-document-page mark { padding:2px 3px; color:#102d51; background:#fff0cb; }
.design-d .d-document-page > span { display:block; height:7px; margin-top:14px; background:#e8edf2; border-radius:3px; }
.design-d .d-document-page > span.is-short { width:64%; }
.design-d .d-citation { margin-top:28px; padding:12px; color:#315b83; background:#f1f7fb; border-left:3px solid #315b83; font-size:10px; }
.design-d .d-citation b { display:inline-grid; width:18px; height:18px; margin-right:6px; place-items:center; color:#fff; background:#315b83; border-radius:50%; font-size:8px; }
.design-d .d-review-rail > div { margin-top:13px; padding:13px 10px; display:grid; grid-template-columns:22px 1fr; gap:6px; align-items:center; color:#587086; border:1px solid #e0e6ec; border-radius:4px; font-size:10px; }
.design-d .d-review-rail > div b { color:#4e789d; }.design-d .d-review-rail > div.is-active { color:#102d51; background:#fff4ed; border-color:#eaa77d; font-weight:700; }
.design-d .d-review-rail > div.is-active b { color:#e76b27; }
.design-d .d-scope-write .d-focus-lens { left:44%; bottom:73px; animation:d-write-lens 9s cubic-bezier(.4,0,.2,1) infinite; }
.design-d .d-review-comment { position:absolute; z-index:8; right:17px; top:118px; width:225px; padding:14px; display:grid; grid-template-columns:33px 1fr; gap:10px; color:#fff; background:#1765d4; border-radius:6px; box-shadow:0 18px 28px #183b602e; animation:d-comment-pop 9s ease infinite; }
.design-d .d-review-comment .pro-icon { width:28px; height:28px; }.design-d .d-review-comment b,.design-d .d-review-comment small { display:block; }.design-d .d-review-comment b { font-size:11px; }.design-d .d-review-comment small { margin-top:3px; color:#d9e8fb; font-size:8px; }

/* PUBLISH visual */
.design-d .d-publish-layout { height:calc(100% - 52px); padding:24px; display:grid; grid-template-columns:1.18fr .82fr; gap:16px; }
.design-d .d-site-preview,.design-d .d-publish-panel { padding:19px; background:#fff; border:1px solid #d8e0e8; border-radius:6px; }
.design-d .d-preview-head { display:flex; justify-content:space-between; color:#102d51; font-size:10px; }.design-d .d-preview-head span { color:#718497; }
.design-d .d-preview-image { position:relative; height:160px; margin:18px 0; overflow:hidden; background:#edf2f6; border-radius:5px; box-shadow:0 8px 20px #102d5114; }
.design-d .d-preview-image img { width:100%; height:100%; display:block; object-fit:cover; object-position:center 49%; transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.design-d .d-scope-publish:hover .d-preview-image img { transform:scale(1.035); }
.design-d .d-site-preview h4 { margin:0 0 15px; color:#102d51; font-size:18px; }
.design-d .d-site-preview > p { height:7px; margin:10px 0; background:#e7edf2; border-radius:3px; }.design-d .d-site-preview > p.is-short { width:66%; }
.design-d .d-publish-panel > small { color:#7a8b9b; font-size:8px; letter-spacing:.12em; }
.design-d .d-publish-panel > div { padding:17px 0; display:flex; justify-content:space-between; border-bottom:1px solid #e2e8ee; color:#586f84; font-size:10px; }.design-d .d-publish-panel > div b { color:#2b6a48; }
.design-d .d-publish-panel button { width:100%; margin-top:25px; padding:12px; color:#fff; background:#1765d4; border:0; border-radius:4px; font-weight:700; }
.design-d .d-scope-publish .d-focus-lens { left:24%; top:174px; animation:d-publish-lens 9s cubic-bezier(.4,0,.2,1) infinite; }
.design-d .d-publish-status { position:absolute; z-index:8; right:19px; bottom:24px; padding:14px 17px; display:flex; align-items:center; gap:10px; color:#102d51; background:#fff; border:1px solid #bdcbd7; border-radius:6px; box-shadow:0 18px 28px #183b6025; animation:d-status-slide 9s ease infinite; }
.design-d .d-publish-status span { width:25px; height:25px; display:grid; place-items:center; color:#fff; background:#e76b27; border-radius:50%; }.design-d .d-publish-status b { font-size:11px; }

@keyframes d-scope-camera { 0%,18%,100% { transform:rotateX(2deg) rotateY(-5deg) scale(1); } 42%,68% { transform:rotateX(1deg) rotateY(-2deg) scale(1.035) translate(-5px,-4px); } }
@keyframes d-scope-camera-reverse { 0%,18%,100% { transform:rotateX(2deg) rotateY(5deg) scale(1); } 42%,68% { transform:rotateX(1deg) rotateY(2deg) scale(1.035) translate(5px,-4px); } }
@keyframes d-plan-lens { 0%,18%,100% { translate:-25px 68px; scale:.78; opacity:.55; } 38%,64% { translate:80px 8px; scale:1; opacity:1; } 76% { translate:92px 34px; scale:.86; opacity:.75; } }
@keyframes d-write-lens { 0%,18%,100% { translate:-35px 18px; scale:.76; opacity:.55; } 38%,66% { translate:64px -14px; scale:1; opacity:1; } 78% { translate:96px -30px; scale:.86; opacity:.72; } }
@keyframes d-publish-lens { 0%,18%,100% { translate:-8px 55px; scale:.76; opacity:.55; } 38%,66% { translate:130px -20px; scale:1; opacity:1; } 78% { translate:168px 18px; scale:.86; opacity:.72; } }
@keyframes d-note-rise { 0%,28%,100% { translate:0 12px; opacity:.15; } 43%,78% { translate:0 0; opacity:1; } }
@keyframes d-comment-pop { 0%,25%,100% { translate:18px 0; opacity:.15; } 42%,77% { translate:0 0; opacity:1; } }
@keyframes d-status-slide { 0%,28%,100% { translate:0 14px; opacity:.15; } 44%,78% { translate:0 0; opacity:1; } }

html[data-motion-paused="true"] .design-d :is(.d-scope-screen,.d-focus-lens,.d-scene-note,.d-review-comment,.d-publish-status) { animation:none!important; }

@media(max-width:1100px) {
  .design-d .d-scope-story { grid-template-columns:minmax(310px,.85fr) minmax(470px,1.15fr); gap:45px; }
  .design-d .d-scope-visual { min-height:520px; }
  .design-d .d-scope-details > div { grid-template-columns:120px 1fr; }
  .design-d .d-scope-screen { inset-inline:0; }
}

@media(max-width:820px) {
  .design-d .d-scope-stories { gap:100px; }
  .design-d .d-scope-story { grid-template-columns:1fr; gap:44px; }
  .design-d .d-scope-story.is-reverse .d-scope-copy,.design-d .d-scope-story.is-reverse .d-scope-visual { order:initial; }
  .design-d .d-scope-visual { width:min(680px,100%); min-height:540px; margin-inline:auto; }
}

@media(max-width:560px) {
  .design-d .services .section-heading { margin-bottom:70px; }
  .design-d .d-scope-stories { gap:84px; }
  .design-d .d-scope-copy h3 { font-size:31px; }
  .design-d .d-scope-lead { font-size:20px!important; }
  .design-d .d-scope-copy > p:not(.d-scope-lead) { font-size:14px; }
  .design-d .d-scope-details > div { grid-template-columns:1fr; gap:5px; padding:15px 0; }
  .design-d .d-scope-visual { min-height:435px; }
  .design-d .d-scope-screen { inset:24px 0 44px; }
  .design-d .d-scope-browserbar { height:42px; }
  .design-d .d-plan-toolbar { margin:13px; height:47px; }
  .design-d .d-plan-grid { margin:0 13px; grid-template-columns:1fr; }
  .design-d .d-intent-map { display:none; }
  .design-d .d-plan-table { min-height:250px; padding:13px; }
  .design-d .d-plan-table > div { padding:12px 4px; }
  .design-d .d-focus-lens { width:78px; height:78px; }
  .design-d .d-focus-lens::after { width:31px; right:-26px; }
  .design-d .d-scope-plan .d-focus-lens { top:151px; left:45%; }
  .design-d .d-scene-note { right:9px; bottom:10px; width:188px; }
  .design-d .d-editor-grid,.design-d .d-publish-layout { height:calc(100% - 42px); padding:13px; grid-template-columns:1fr; }
  .design-d .d-review-rail,.design-d .d-publish-panel { display:none; }
  .design-d .d-document-page { padding:17px; }
  .design-d .d-document-page h4 { font-size:19px; }
  .design-d .d-scope-write .d-focus-lens { left:39%; bottom:73px; }
  .design-d .d-review-comment { right:8px; top:87px; width:192px; }
  .design-d .d-site-preview { padding:15px; }
  .design-d .d-preview-image { height:130px; }
  .design-d .d-scope-publish .d-focus-lens { left:22%; top:133px; }
  .design-d .d-publish-status { right:7px; bottom:11px; padding:11px; }
  .design-d .d-scope-visual figcaption { bottom:7px; }
}

@media(prefers-reduced-motion:reduce) {
  .design-d :is(.d-scope-screen,.d-focus-lens,.d-scene-note,.d-review-comment,.d-publish-status) { animation:none!important; }
}