/* Video captions share one alignment; dark labels belong only on light project cards. */
#video .video-item figcaption .case-type{display:block;color:#d6ab8f;opacity:1;line-height:1.4}
.video-preview{position:relative;isolation:isolate}
.video-actions{display:none;position:absolute;inset:auto 12px 12px;align-items:center;justify-content:space-between;gap:8px}
.video-preview.is-enhanced .video-actions{display:flex}
.video-actions button{appearance:none;background:#111e;color:#fff;border:1px solid #ffffff45;border-radius:99px;min-height:44px;padding:8px 13px;font-size:12px;line-height:1.2;box-shadow:0 2px 8px #0002}
.video-actions button:hover{background:#28201a}
.video-actions button:focus-visible{outline:2px solid #fff;outline-offset:3px}
.video-preview .when-playing,.video-preview .when-unmuted{display:none}
.video-preview.is-playing .when-playing,.video-preview.has-sound .when-unmuted{display:inline}
.video-preview.is-playing .when-paused,.video-preview.has-sound .when-muted{display:none}
.tools .tool-heading{color:#d6ab8f;margin-bottom:20px}
.tool-groups{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.tool-group h3{font-size:15px;line-height:1.4;letter-spacing:0;color:#faf9f6;margin-bottom:12px}
.tool-group ul{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.tool-group li{font-size:13px;line-height:1.3;padding:9px 12px;border:1px solid #513a2d;border-radius:7px;background:#211712;color:#e8cbb9}
.footer-socials .footer-instagram{display:block;width:22px;height:22px;flex:none;fill:var(--orange);color:var(--orange)}
.service-card-top>.circle-arrow{margin-left:auto}
.af-v2 .af-motion-controls{display:flex;justify-content:flex-end;margin:0}
.af-v2:not(.af-motion-ready) .af-motion-controls{display:none}
.af-v2 .af-motion-controls .af-motion-toggle{width:44px;height:44px;min-height:44px;max-width:none;padding:0;margin:0;border-radius:50%}
.af-v2.af-motion-ready .af-motion-controls .af-motion-toggle{display:grid;place-items:center}
.af-v2 .af-motion-controls .af-motion-toggle>span{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
@media(min-width:801px){
 #video-title br{display:none}
 #saya>.section-heading{max-width:none}
 #video-title,#saya-title{font-size:clamp(40px,5.3vw,86px);white-space:nowrap}
 .motion-ready .project-card>.case-copy,.motion-ready .project-card>.case-card-copy,.motion-ready #klinika>.case-card-copy,.motion-ready #aistopa>.case-card-copy{overflow:visible;overscroll-behavior:auto;max-height:none;min-height:min-content}
 .motion-ready #pred-po>.comparison-board{flex:1 1 0;min-height:0;grid-template-rows:minmax(0,1fr);align-items:stretch}
 .motion-ready #pred-po .comparison-panel{min-height:0;display:flex;flex-direction:column}
 .motion-ready #pred-po .comparison-panel>.image-button{flex:1 1 0;min-height:0;aspect-ratio:auto}
 .motion-ready #pred-po .comparison-panel img{object-fit:contain}
}
@media(max-width:800px){
 #video .video-item figcaption{display:grid;gap:8px;margin-top:17px;padding-inline:7px;text-align:center}
 #video .video-item figcaption .case-type{font-size:11px;margin:0}
 #video .video-item figcaption h3{display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1.15;min-height:2.3em;margin:0;text-wrap:balance}
 #video .video-item figcaption p{font-size:14px;line-height:1.45;margin:0;text-wrap:pretty}
 #o-mne h2{font-size:clamp(30px,8.1vw,43px);line-height:1.12;max-width:none;letter-spacing:-.045em}
 #o-mne h2 br:last-of-type{display:none}
 .tools{margin-top:30px;padding-top:24px}
 .tools .tool-heading{text-align:center;margin-bottom:22px}
 .tool-groups{grid-template-columns:1fr;gap:22px;text-align:center}
 .tool-group h3{font-size:14px;margin-bottom:10px}
 .tool-group ul{justify-content:center;gap:7px}
 .tool-group li{font-size:13px;padding:9px 12px}
}

/* The existing VERDICT screenshot stays intact inside a responsive laptop shell. */
#verdict .verdict-device-stage {
  gap: 6%;
  padding: 12px 0 16px 5%;
  box-sizing: border-box;
}

#verdict .verdict-device-stage .verdict-desktop-preview {
  position: relative;
  display: grid;
  flex: none;
  width: 65%;
  height: auto;
  max-height: none;
  aspect-ratio: 1.55;
  padding: clamp(4px, .55vw, 10px);
  margin: 0;
  border: 1px solid #9d9b98;
  border-radius: clamp(6px, .9vw, 14px) clamp(6px, .9vw, 14px) 3px 3px;
  background: #17181b;
  box-shadow: 0 1px 0 #e8e6e1 inset, 0 13px 22px -15px #37282065;
  overflow: visible;
  isolation: isolate;
  box-sizing: border-box;
}

/* Camera housing, kept within the bezel and away from the app image. */
#verdict .verdict-desktop-preview::before {
  content: "";
  position: absolute;
  z-index: 2;
  left: 46%;
  top: 1px;
  width: 8%;
  height: clamp(3px, .4vw, 7px);
  border-radius: 0 0 4px 4px;
  background: radial-gradient(circle at 50% 46%, #46505e 0 1px, transparent 1.4px), #17181b;
  pointer-events: none;
}

/* Aluminium lower case and the central opening lip. */
#verdict .verdict-desktop-preview::after {
  content: "";
  position: absolute;
  z-index: 3;
  left: -8%;
  top: calc(100% - 1px);
  width: 116%;
  height: clamp(5px, .85vw, 13px);
  border: 1px solid #a9a6a1;
  border-top-color: #eceae6;
  border-radius: 1px 1px 45% 45% / 1px 1px 80% 80%;
  background:
    linear-gradient(#9e9d9b, #c0bebb) center top / 17% 35% no-repeat,
    linear-gradient(90deg, #a4a3a1 0%, #e4e3e0 5%, #d2d0cd 48%, #e4e3e0 95%, #92918f 100%);
  box-shadow: 0 2px 2px #453b3117;
  pointer-events: none;
  box-sizing: border-box;
}

#verdict .verdict-device-stage .verdict-desktop-preview img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-width: none;
  max-height: none;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
  background: #eef0f3;
  border-radius: 2px;
  transform: none;
  transition: none;
}

#verdict .verdict-device-stage .verdict-phone { width: 29%; }

#verdict .verdict-desktop-preview .image-zoom {
  right: clamp(9px, 1vw, 17px);
  bottom: clamp(9px, 1vw, 17px);
}

@media (min-width: 801px) {
  .motion-ready #verdict .verdict-device-stage .verdict-desktop-preview { width: min(65cqw, 134cqh); }
  .motion-ready #verdict .verdict-device-stage .verdict-phone { width: min(29cqw, 42cqh); }
}

@media (max-width: 800px) {
  #verdict .verdict-device-stage { margin-block: 8px 20px; padding-block: 6px 10px; }
  #verdict .verdict-device-stage .verdict-desktop-preview { padding: 4px; border-radius: 7px 7px 2px 2px; }
  #verdict .verdict-desktop-preview .image-zoom { right: 7px; bottom: 7px; width: 26px; height: 26px; }
}

@media (prefers-reduced-motion: reduce) {
  .motion-ready #verdict .verdict-device-stage .verdict-desktop-preview { width: 65%; }
  .motion-ready #verdict .verdict-device-stage .verdict-phone { width: 29%; }
}

/* Desktop detail groups share the portfolio's editorial type and orange actions. */
@media(min-width:801px){
 #o-mne{row-gap:48px}
 #o-mne>.tools{grid-column:1/-1;margin:0;padding:30px 0 0;border-top:1px solid #443126;display:grid;grid-template-columns:minmax(155px,.75fr) 4fr;gap:36px;align-items:start}
 #o-mne .tool-heading{margin:6px 0 0;font-size:12px;line-height:1.5;color:#dc9a77}
 #o-mne .tool-groups{grid-template-columns:1fr;gap:0}
 #o-mne .tool-group{display:grid;grid-template-columns:160px minmax(0,1fr);align-items:center;gap:24px;padding:0 0 27px}
 #o-mne .tool-group+.tool-group{padding:27px 0 0;border-top:1px solid #302923}
 #o-mne .tool-group h3{font-size:14px;line-height:1.4;color:#ae9c8e;margin:0}
 #o-mne .tool-group ul{display:grid;grid-template-columns:1.2fr .85fr 1fr 1fr;gap:20px;align-items:baseline}
 #o-mne .tool-group li{padding:0;border:0;border-radius:0;background:none;color:#f3e8df;font-size:clamp(19px,1.65vw,26px);line-height:1.25;letter-spacing:-.035em;white-space:nowrap}
 #higgsfield .production-tools{display:flex;align-items:baseline;flex-wrap:wrap;gap:10px 17px;max-width:none;margin-top:27px;padding-top:22px;border-top:1px solid #3c2e24}
 #higgsfield .production-tools .production-separator{display:none}
 #higgsfield .production-tools>span:not(.production-separator){font-size:14px;line-height:1.4;letter-spacing:-.015em;color:#c7afa0;white-space:nowrap}
 #higgsfield .production-tools>span:first-child{font-size:24px;line-height:1.2;color:#f7e9df;letter-spacing:-.045em;margin-right:6px}
 #higgsfield .product-heading .text-link{display:inline-flex;justify-content:space-between;align-items:center;min-height:58px;min-width:300px;gap:30px;margin-top:24px;padding:16px 23px;border:1px solid #ff845c;border-radius:12px;background:linear-gradient(120deg,#f8642c,var(--orange));color:#fff;font-size:16px;line-height:1.3;transition:background .2s,transform .2s}
 #higgsfield .product-heading .text-link:hover{opacity:1;background:linear-gradient(120deg,#ff753e,#f9532b);transform:translateY(-2px)}
 #higgsfield .product-heading .text-link .ui-icon{width:25px;height:25px;flex:none}
 .work-shortcuts.wrap{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;padding:8px;margin-top:42px;background:#14110f;border:1px solid #453025;border-radius:18px;overflow:visible}
 .work-shortcuts a{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0;min-height:70px;padding:16px 22px;border:0;border-radius:11px;font-size:16px;line-height:1.3;letter-spacing:-.02em;color:#f0e3d8;transition:background-color .2s,color .2s}
 .work-shortcuts a+a:before{content:"";position:absolute;left:-1px;top:21px;bottom:21px;width:1px;background:#3b2c23;pointer-events:none}
 .work-shortcuts a>span[aria-hidden]{display:grid;place-items:center;flex:none;width:34px;height:34px;color:#ff8752;border-radius:50%;background:#ff6b3510}
 .work-shortcuts .ui-icon{width:18px;height:18px;transition:transform .2s}
 .work-shortcuts a:hover,.work-shortcuts a:focus-visible{color:#fff;background:#382116}
 .work-shortcuts a:hover .ui-icon{transform:translate(2px,-2px)}
 .work-shortcuts a:focus-visible{outline:2px solid #ff8752;outline-offset:2px}
}
@media(min-width:801px) and (max-width:1100px){
 #o-mne>.tools{grid-template-columns:1fr;gap:24px}
 #o-mne .tool-group{grid-template-columns:155px minmax(0,1fr);gap:20px}
 #o-mne .tool-group ul{gap:15px}
 #o-mne .tool-group li{font-size:21px}
 .work-shortcuts a{font-size:13px;padding:13px 12px;gap:8px;min-height:64px}
 .work-shortcuts a>span[aria-hidden]{width:26px;height:26px;background:none}
 .work-shortcuts .ui-icon{width:16px;height:16px}
}
@media(prefers-reduced-motion:reduce){
 #higgsfield .product-heading .text-link,.work-shortcuts .ui-icon{transition:none}
 #higgsfield .product-heading .text-link:hover,.work-shortcuts a:hover .ui-icon{transform:none}
}
