/* HIDEWHALE: a real brief, matched to the corresponding project screens. */
.custom-development { display:grid; grid-template-columns:minmax(0,.76fr) minmax(0,1.24fr); align-items:center; gap:48px clamp(36px,5vw,84px); padding-block:clamp(90px,8vw,140px); background:var(--ink); color:var(--paper); overflow:hidden; }
.custom-development__copy { min-width:0; }
.custom-development__copy .section-code { margin-bottom:32px; color:var(--on-dark-muted); font-size:10px; letter-spacing:.08em; }
.custom-development h2 { font-size:clamp(76px,8.1vw,124px); line-height:.91; letter-spacing:-.065em; }
.custom-development h2 em { display:inline-block; color:var(--sage); font-style:italic; }
.custom-development__description { max-width:36ch; margin-top:28px; color:var(--on-dark-muted); font-size:14px; line-height:1.8; }
.custom-development .custom-development__contact { --btn-bg:var(--paper); --btn-text:var(--ink); --btn-fill-bg:var(--ink); --btn-fill-text:var(--paper); --btn-arrow:var(--paper); margin-top:26px; }
.custom-development__visual { min-width:0; margin:0; }
.idea-story__head { display:flex; align-items:center; justify-content:space-between; gap:16px; padding-bottom:20px; color:var(--on-dark-muted); font:9px/1.6 var(--mono); }
.idea-story__head > span:first-child { color:var(--paper); font:600 13px/1.5 var(--sans); letter-spacing:.1em; }
.idea-canvas { --split:100%; position:relative; }
.idea-canvas__surface { position:relative; aspect-ratio:1.6; overflow:hidden; border:1px solid rgb(213 217 201 / 23%); border-radius:6px; background:var(--paper); isolation:isolate; box-shadow:0 12px 36px rgb(0 0 0 / 12%); }
.idea-canvas__result { position:absolute; inset:0; }
.idea-canvas__result img { display:block; width:100%; height:100%; object-fit:contain; object-position:center; background:#f5f7f5; }
.idea-canvas__result img[hidden] { display:none; }
.idea-canvas__messages { position:absolute; inset:0; display:none; overflow:hidden; clip-path:inset(0 0 0 var(--split)); color:#edf3f7; background:#0f1923; background-image:radial-gradient(rgb(142 166 185 / 9%) .7px,transparent .8px); background-size:24px 24px; }
.idea-canvas__brief-label { position:absolute; z-index:8; top:0; left:0; width:100%; padding:13px 18px; background:#0f1923; color:#8b9fad; font:8px/1.5 var(--mono); letter-spacing:.03em; text-align:right; pointer-events:none; }
.idea-canvas__cloud { position:absolute; inset:42px 0 0; }
.client-message { --message-bg:#1b2b39; position:absolute; left:0; top:0; width:190px; margin:0; padding:11px 14px 9px; border:0; border-radius:17px 17px 17px 5px; background:var(--message-bg); color:#edf3f7; box-shadow:0 2px 7px rgb(0 0 0 / 12%); font:400 13px/1.45 var(--sans); text-wrap:pretty; transform:translate3d(var(--note-shift-x,0px),var(--note-shift-y,0px),0) rotate(calc(var(--note-angle,0deg) + var(--note-tilt,0deg))); opacity:.78; transition:none; }
.client-message::before { content:''; position:absolute; left:-6px; bottom:0; width:13px; height:18px; background:var(--message-bg); clip-path:path('M13 0C13 9 9 14 0 16C4 18 10 18 13 16Z'); pointer-events:none; }
.client-message__author { display:block; margin-bottom:3px; color:#ff649a; font:600 1em/1.4 var(--sans); }
.client-message__text { margin:0; color:inherit; font:inherit; }
.client-message__meta { display:flex; align-items:center; justify-content:flex-end; gap:4px; margin-top:4px; color:#91a9b9; font:400 9px/1.2 var(--sans); font-variant-numeric:tabular-nums; white-space:nowrap; }
.client-message__read { display:block; width:17px; height:12px; color:#66b9e8; flex:none; }
.client-message.is-current { --message-bg:#203747; opacity:1; box-shadow:0 5px 17px rgb(0 0 0 / 22%); }
.client-message[hidden] { display:none; }
.idea-canvas__divider { position:absolute; z-index:12; inset:0; pointer-events:none; display:none; }
.idea-canvas__divider::before { content:''; position:absolute; top:0; bottom:0; left:var(--split); width:1px; background:var(--paper); box-shadow:0 0 0 1px rgb(23 26 23 / 14%); }
.idea-canvas__divider > button { position:absolute; top:50%; left:clamp(26px,var(--split),calc(100% - 26px)); display:grid; place-items:center; width:48px; height:48px; padding:0; appearance:none; border:1px solid rgb(78 96 56 / 22%); border-radius:50%; background:var(--paper); color:var(--olive-deep); transform:translate(-50%,-50%); box-shadow:0 3px 14px rgb(23 26 23 / 18%),inset 0 0 0 3px rgb(255 255 255 / 45%); pointer-events:auto; cursor:ew-resize; touch-action:none; user-select:none; transition:background-color 160ms,border-color 160ms,box-shadow 160ms; }
.idea-canvas__divider > button:hover { border-color:var(--olive-deep); box-shadow:0 4px 18px rgb(23 26 23 / 24%),inset 0 0 0 3px rgb(255 255 255 / 45%); }
.idea-canvas__divider svg { width:23px; height:23px; }
.idea-canvas.is-interactive .idea-canvas__messages,.idea-canvas.is-interactive .idea-canvas__divider { display:block; }
.idea-canvas.is-dragging .idea-canvas__divider > button { background:var(--sage); }
.idea-scrubber { padding-block:14px 2px; }
.idea-scrubber[hidden] { display:none; }
.idea-scrubber__labels { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:26px; }
.idea-scrubber__labels > button { display:inline-flex; align-items:center; gap:8px; appearance:none; border:0; background:transparent; color:var(--on-dark-muted); padding:5px 0; font:500 10px/1.5 var(--sans); cursor:pointer; transition:color 160ms; }
.idea-scrubber__labels > button::before { content:''; width:4px; height:4px; border:1px solid var(--sage); border-radius:50%; }
.idea-scrubber__labels > button:last-child { flex-direction:row-reverse; }
.idea-scrubber__labels > button:last-child::before { background:var(--sage); }
.idea-scrubber__labels > button:hover { color:#e1edc8; }
.idea-scrubber .idea-scrubber__hint { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.idea-canvas__range { display:block; width:100%; height:40px; margin:2px 0 0; padding:0; cursor:ew-resize; touch-action:pan-y; appearance:none; -webkit-appearance:none; background:transparent; }
.idea-canvas__range::-webkit-slider-runnable-track { height:2px; border-radius:2px; background:linear-gradient(to right,var(--sage) var(--split),#414a39 var(--split)); }
.idea-canvas__range::-moz-range-track { height:2px; border:0; background:#414a39; }
.idea-canvas__range::-moz-range-progress { height:2px; background:var(--sage); }
.idea-canvas__range::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; box-sizing:border-box; width:18px; height:18px; margin-top:-8px; border:3px solid var(--ink); border-radius:50%; background:var(--paper); box-shadow:0 0 0 1px rgb(213 217 201 / 55%); }
.idea-canvas__range::-moz-range-thumb { box-sizing:border-box; width:18px; height:18px; border:3px solid var(--ink); border-radius:50%; background:var(--paper); box-shadow:0 0 0 1px rgb(213 217 201 / 55%); }
.idea-canvas__range:focus-visible { outline:1px solid var(--sage); outline-offset:4px; }
.idea-scrubber__labels > button:focus-visible { outline:1px solid var(--sage); outline-offset:4px; }
@media(min-width:901px) and (max-width:1150px) { .custom-development { grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:40px 32px; }.custom-development h2 { font-size:8.4vw; }.idea-story__head { font-size:8px; } }
@media(max-width:900px) { .custom-development { grid-template-columns:1fr; gap:42px; padding-block:90px; }.custom-development h2 { font-size:clamp(72px,12vw,106px); }.custom-development__description { max-width:48ch; } }
@media(max-width:520px) { .custom-development { gap:36px; padding-block:74px 64px; }.custom-development h2 { font-size:clamp(66px,17.5vw,88px); }.custom-development__description { margin-top:24px; font-size:13px; }.custom-development__copy .section-code { margin-bottom:26px; }.idea-story__head { gap:8px; padding-bottom:14px; font-size:7px; }.idea-story__head > span:first-child { font-size:11px; }.idea-canvas__surface { aspect-ratio:1.02; }.idea-canvas__result img { object-fit:contain; }.idea-canvas__brief-label { padding:10px; font-size:7px; }.idea-canvas__cloud { inset:32px 0 0; }.client-message { padding:9px 11px 11px; border-radius:15px 15px 15px 4px; }.idea-canvas__divider > button { width:44px; height:44px; }.idea-canvas__divider svg { width:21px; height:21px; }.idea-scrubber__labels { flex-wrap:wrap; gap:4px; } }
@media(prefers-reduced-motion:no-preference) {
  .idea-canvas.is-present .client-message { animation:idea-note-arrive 480ms var(--ease) both; animation-delay:var(--note-delay,0ms); }
  .idea-canvas.is-present:not(.has-interacted) .idea-canvas__divider svg { animation:idea-drag-cue 1800ms ease-in-out 3; animation-play-state:paused; }
  .idea-canvas.is-present.is-in-view:not(.has-interacted) .idea-canvas__divider svg { animation-play-state:running; }
}
@keyframes idea-note-arrive { from { translate:0 9px; opacity:0; } }
@keyframes idea-drag-cue { 0%,20%,80%,100% { translate:0 0; } 45% { translate:4px 0; } 60% { translate:-3px 0; } }
@media(prefers-reduced-motion:reduce) { .client-message { transition:none; } }
