/* The moving scene has no moving text; original card copy returns at full docking. */
.folder-identity{position:absolute;z-index:4;inset:auto 9% 16%;display:flex;align-items:center;justify-content:space-between;gap:12px;pointer-events:none;color:#f3f1ec;text-shadow:0 1px 4px #0008}
:is(.studio-work.sw-work-featured,.work-preview-grid) .sw-folder-front .folder-identity img{position:static;display:block;width:72px;height:25px;max-width:26%;object-fit:contain;object-position:left center;aspect-ratio:auto;transform:none;border:0;border-radius:0;box-shadow:none;filter:brightness(0) invert(1);opacity:.86}
.folder-identity>span{font:400 clamp(8px,.85vw,12px)/1.2 ui-monospace,monospace;letter-spacing:.025em;white-space:nowrap}
/* Keep the HelloHub lighting inside its own rounded UI, away from the copy. */
.product-hellohub .product-visual-stage::before{display:none}
.product-hellohub .product-hello-panel{box-shadow:inset 0 1px 0 #ffffff80,0 8px 18px -14px #0008}
#hubapps-rail .hr-visual:has(.product-hello-stage){isolation:isolate}
.footer-index-heading .footer-about{max-width:49ch;margin:20px 0 0;font-size:14px;line-height:1.65}
.footer-index-heading:has(.footer-bitmap){align-items:center}
/* Each partner keeps its supplied artwork. The once-rendered color plate has no white background. */
.partner-art canvas{display:none;width:100%;height:100%}
.partner-badge .partner-art[data-color-ready]{filter:grayscale(1);mix-blend-mode:normal}
.partner-art[data-color-ready] img{display:none!important}
.partner-art[data-color-ready] canvas{display:block}
.partner-badge:is(:hover,:focus-visible) .partner-art[data-color-ready]{filter:none;mix-blend-mode:normal;opacity:1}
.client-logos{filter:none}
.client-logos img,.client-logos .client-logo-muted{filter:grayscale(1);transition:filter 200ms ease,opacity 200ms ease}
.client-logos img:is(:hover,:focus-visible){filter:none;opacity:1}
.client-logos img[alt="D-Smart"]:is(:hover,:focus-visible){filter:brightness(0) saturate(100%) invert(47%) sepia(93%) saturate(2530%) hue-rotate(346deg) brightness(101%) contrast(102%)}
/* Editorial drawings and the agent share the existing optical renderer. */
[data-art-glass]{position:relative;isolation:isolate;overflow:hidden;border-radius:20px;background:#10151b;border:1px solid #ffffff20}
.optical-art{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
[data-art-glass]>.liquid-glass-pane{z-index:1;pointer-events:none}
.insight-card{padding:14px 14px 26px;overflow:hidden;background:#ffffff03}
.editorial-visual{aspect-ratio:4/3;width:100%;margin-bottom:26px;border-radius:13px}
.insight-card>:not(.editorial-visual){margin-left:12px;margin-right:12px}
.insight-card .insight-number{font:400 11px/1.2 ui-monospace,monospace;letter-spacing:.12em;margin-bottom:18px;color:#a7a7a4}
.insight-card h3{font-size:clamp(23px,2vw,29px)}
.insight-card:hover .editorial-visual{border-color:#e7d4b44d}
.hubui-awareness{padding-top:18px;background:radial-gradient(ellipse at 80% 0,#ff62580d,transparent 55%),#ffffff03}
.agent-portrait{height:235px;margin:0 -14px 30px;border-color:#ff62582e;background:#191316}
.agent-caption{position:absolute;bottom:16px;left:20px;z-index:3;font:400 10px/1.3 ui-monospace,monospace;letter-spacing:.13em;color:#e6b8af}
.hubui-awareness .hubui-eyebrow,.hubui-principles span{color:#de827b}
.hubui-tabs button[aria-selected="true"]{border-color:#ff625875;background:#ff62580a;color:#f0d9d5}
.hubui-example-icon{border-color:#ff62584d;color:#f0b0a9;background:#ff625808}
.hubui-agent-view{position:relative;border-left:1px solid #ff62582b;padding-left:24px}
.hubui-agent-view .hubui-view-label:before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;background:#ff6258;margin-right:9px;box-shadow:0 0 10px #ff62584d}
@media(max-width:760px){.folder-identity{gap:5px;inset-inline:8%}.folder-identity>span{font-size:7px}:is(.studio-work.sw-work-featured,.work-preview-grid) .sw-folder-front .folder-identity img{width:40px;height:18px}.footer-index-heading .footer-about{margin-top:15px;font-size:13px}.agent-portrait{height:215px}.hubui-agent-view{padding-left:14px}.editorial-visual{aspect-ratio:4/3}.insight-card h3{font-size:27px}}
@media(prefers-reduced-motion:reduce){.client-logos img,.partner-art{transition:none}}
.hubui-workbench{align-items:start}
.agent-portrait{height:185px;margin-bottom:24px}
.client-logos img[alt="TÜBİTAK BİLGEM"]:is(:hover,:focus-visible){filter:brightness(0) saturate(100%) invert(22%) sepia(93%) saturate(5432%) hue-rotate(347deg) brightness(89%) contrast(113%)}

.folder-identity>.folder-code{display:flex;flex-direction:column;align-items:flex-end;gap:4px;line-height:1;letter-spacing:.08em}
.folder-code-main{display:flex;align-items:baseline;gap:7px;font-weight:400;color:#d9dde2}
.folder-code-main b{font:inherit;font-size:1.12em;font-weight:500;color:#fff;font-variant-numeric:tabular-nums}
.folder-code-detail{font-size:.7em;letter-spacing:.16em;color:#b3bac3}
@media(max-width:760px){.folder-identity>.folder-code{gap:3px}.folder-code-main{gap:4px}}

/* Round 3 (2026-09-13) · copy deck v4.
   Service scope line: sits under the expanded body in small type, same inset. */
.studio-work .sw-service > p:has(+ .sw-service-scope) { padding-bottom: 14px; }
.studio-work .sw-service > .sw-service-scope { max-width: 64ch; padding: 0 22px 28px 46px; color: #9397a3; font-size: 13px; line-height: 1.65; letter-spacing: .005em; }
.studio-work .sw-service-scope-label { color: #c9cbd3; }
@media (max-width: 760px) {
  .studio-work .sw-service > .sw-service-scope { padding: 0 0 24px 34px; font-size: 12.5px; }
}

/* hubApps intro: the family name at wordmark scale, the existing sentence as its second line,
   and less empty space around both. */
.products-intro { padding-top: 72px; padding-bottom: 60px; }
.products-intro-top { margin-bottom: 30px; }
.products-intro h2 .h2-brand { display: block; margin: 0 0 .1em -.04em; color: #f0efeb; font: 500 clamp(60px, 8.4vw, 138px)/.9 'Helvetica Neue', Helvetica, sans-serif; letter-spacing: -.055em; }
.products-intro h2 .h2-line { display: block; color: #eeede8; font-size: clamp(32px, 4.3vw, 70px); line-height: 1.08; letter-spacing: -.03em; }
.products-intro h2 .h2-line span { color: #999da6; }
.products-intro-bottom { margin-top: 30px; }
@media (max-width: 760px) {
  .products-intro { padding: 56px 24px 40px; }
  .products-intro-top { margin-bottom: 22px; }
  .products-intro h2 .h2-brand { font-size: clamp(52px, 15vw, 92px); }
  .products-intro h2 .h2-line { font-size: clamp(28px, 7.4vw, 44px); }
}

/* Selected work rail (2026-09-13): eight folders from globalmeta.net/calismalar, each sheet a white
   logo on black. Four visible on desktop, the rest a horizontal scroll with snap. */
.collection-actions { display: flex; align-items: center; gap: 22px; }
.work-preview-grid.work-rail { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - 60px) / 4); gap: 20px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scrollbar-width: none; padding: 16px 0 6px; }
.work-preview-grid.work-rail::-webkit-scrollbar { display: none; }
.work-preview-grid.work-rail:focus-visible { outline: 2px solid #c6d2df; outline-offset: 6px; border-radius: 6px; }
.work-preview-grid.work-rail > .work-preview { scroll-snap-align: start; min-width: 0; }
.work-preview-grid.work-rail .sw-case-image > img { object-position: center; background: #000; }
.work-preview-grid.work-rail .folder-identity--code { justify-content: flex-end; }
@media (max-width: 1000px) { .work-preview-grid.work-rail { grid-auto-columns: calc((100% - 40px) / 3); } }
@media (max-width: 760px) {
  .collection-actions { width: 100%; justify-content: space-between; }
  .work-preview-grid.work-rail { grid-auto-columns: 72%; gap: 16px; }
}
@media (prefers-reduced-motion: reduce) { .work-preview-grid.work-rail { scroll-behavior: auto; } }

/* Work page (2026-09-13): every case links to its own page, and the full index sits under the featured cases. */
.sw-case-page-link { margin-top: 18px; margin-left: 28px; }
.sw-more-copy .sw-case-page-link { margin-left: 0; }
.work-index { border-top: 1px solid #ffffff17; }
.work-index-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 34px 20px; }
.work-index-grid .sw-case-image > img { object-position: center; background: #000; }
.work-index-grid .folder-identity--code { justify-content: flex-end; }
@media (max-width: 1100px) { .work-index-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 760px) { .work-index-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 16px; } .sw-case-page-link { margin-left: 0; } }

/* Work page (2026-09-13, r2): the remaining works follow Teknosanet's row. Consecutive rows sit closer. */
.studio-work .sw-more-work + .sw-more-work { margin-top: 0; padding-top: 34px; }
.studio-work .sw-more-work .sw-more-image { position: relative; aspect-ratio: 1; background: #000; }
.studio-work .sw-more-work .sw-more-image img { aspect-ratio: 1; object-fit: cover; }
.studio-work .sw-more-work .folder-identity--code { justify-content: flex-end; }
.studio-work .sw-more-work .sw-case-page-link { margin: 0; }
@media (max-width: 760px) { .studio-work .sw-more-work + .sw-more-work { padding-top: 28px; } }

/* Subpage header on phones (2026-09-13): six items did not fit the row, so the search button
   ran past the right edge. Tighter gaps and a flush language switch keep all of them inside. */
@media (max-width: 760px) {
  .studio-subpage .page-header nav { gap: 10px; }
  .studio-subpage .page-header nav > .nav-lang { display: inline-flex; align-items: center; min-height: 40px; padding-inline: 2px; }
  .studio-subpage .page-header .page-contact { padding: 0 10px; }
}

/* Homepage menu on phones: the panel hung from the menu button's right edge, but the search
   button sits outside the pill to its right, so a 354 px panel started 43 px off the left edge.
   Align its right edge with the search button instead (60 px = search button + its gap). */
@media (max-width: 760px) {
  .floating-nav .mobile-menu .mobile-menu-panel { right: -60px; }
}

/* Subpage header on the narrowest phones (320-359 px): still 14-36 px too wide, so the
   side padding and gaps shrink once more; type sizes stay. */
@media (max-width: 359px) {
  .studio-subpage .page-header { padding-inline: 14px; }
  .studio-subpage .page-header nav { gap: 6px; }
  .studio-subpage .page-header .page-contact { padding: 0 8px; }
  .studio-subpage .page-header nav > .nav-lang { padding-inline: 0; }
}