/* =========================================================
   V92 — scrolling event marquee + responsive portfolio views
   ========================================================= */

/* Continuous events ticker: no clipped one-line strip on phones. */
body.theme-v38.page-events .event-marquee{
  overflow:hidden!important;
  padding:0!important;
  background:#26cfe0!important;
  color:#06131a!important;
  border-top:1px solid rgba(7,16,22,.10)!important;
  border-bottom:1px solid rgba(7,16,22,.10)!important;
  box-shadow:0 8px 20px rgba(7,16,22,.08)!important;
}
body.theme-v38.page-events .event-marquee-track{
  display:flex!important;
  width:max-content!important;
  min-width:max-content!important;
  align-items:center!important;
  animation:v92-event-marquee 26s linear infinite!important;
  will-change:transform;
}
body.theme-v38.page-events .event-marquee-track span{
  display:block!important;
  flex:0 0 auto!important;
  min-width:max-content!important;
  padding:15px 26px!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:950!important;
  letter-spacing:.12em!important;
  white-space:nowrap!important;
}
body.theme-v38.page-events .event-marquee:hover .event-marquee-track,
body.theme-v38.page-events .event-marquee:focus-within .event-marquee-track{animation-play-state:paused!important}
@keyframes v92-event-marquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}

/* Make room for the explicit Graphic Design desktop nav item. */
@media(min-width:1361px){
  body.theme-v38 .site-header .brand-v32{flex-basis:145px!important;width:145px!important;min-width:145px!important}
  body.theme-v38 .site-logo-v32{width:140px!important;max-width:140px!important}
  body.theme-v38 .desktop-nav{gap:clamp(7px,.65vw,11px)!important}
  body.theme-v38 .desktop-nav a{font-size:clamp(9.8px,.72vw,11.2px)!important}
  body.theme-v38 .nav-actions{gap:7px!important}
  body.theme-v38 .nav-actions>.btn{padding:0 16px!important}
}

/* Screenshot-led working website portfolio. */
.v92-project-showcase{align-items:center!important}
.v92-device-showcase{
  min-width:0;
  display:grid;
  grid-template-columns:minmax(0,1.55fr) minmax(150px,.72fr) minmax(115px,.5fr);
  gap:14px;
  align-items:end;
  padding:18px;
  border-radius:32px;
  background:linear-gradient(145deg,#eef4f6,#fff 45%,#f8eee6);
  border:1px solid rgba(7,16,22,.09);
  box-shadow:0 28px 70px rgba(7,16,22,.13);
}
.v92-device-shot{
  position:relative;
  display:block;
  min-width:0;
  overflow:hidden;
  border-radius:22px;
  background:#081b24;
  border:7px solid #0b171d;
  box-shadow:0 16px 35px rgba(7,16,22,.20);
  transform-origin:bottom center;
  transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease;
}
.v92-device-shot:hover,.v92-device-shot:focus-visible{
  transform:translateY(-7px) scale(1.015);
  box-shadow:0 24px 50px rgba(7,16,22,.28);
  border-color:#18a8bb;
  outline:none;
}
.v92-device-shot>span{
  position:absolute;
  top:10px;
  left:10px;
  z-index:2;
  padding:6px 9px;
  border-radius:999px;
  background:rgba(4,17,24,.88);
  color:#fff;
  font-size:9px;
  font-weight:950;
  letter-spacing:.13em;
}
.v92-device-shot img{display:block;width:100%;height:auto;object-fit:cover}
.v92-shot-desktop{border-radius:20px}
.v92-shot-tablet{border-radius:24px}
.v92-shot-mobile{border-radius:28px;border-width:6px}
.v92-demo-launch{
  grid-column:1/-1;
  display:grid;
  grid-template-columns:auto 1fr auto;
  gap:14px;
  align-items:center;
  padding:16px 18px;
  border-radius:18px;
  background:#071016;
  color:#fff!important;
  transition:transform .22s ease,background .22s ease;
}
.v92-demo-launch:hover,.v92-demo-launch:focus-visible{transform:translateY(-2px);background:#102630;outline:2px solid #24ccdd;outline-offset:3px}
.v92-demo-launch small{color:#7de5ee;font-size:9px;font-weight:950;letter-spacing:.13em}
.v92-demo-launch strong{font-size:13px;line-height:1.25}
.v92-demo-launch span{font-size:11px;color:#d5e2e7;white-space:nowrap}

@media(max-width:1050px){
  .v92-device-showcase{grid-template-columns:minmax(0,1.4fr) minmax(150px,.75fr)}
  .v92-shot-desktop{grid-column:1/-1}
  .v92-shot-tablet,.v92-shot-mobile{align-self:start}
  .v92-demo-launch{grid-template-columns:1fr auto}
  .v92-demo-launch small{grid-column:1/-1}
}
@media(max-width:700px){
  body.theme-v38.page-events .event-marquee-track span{padding:13px 18px!important;font-size:11px!important;letter-spacing:.10em!important}
  .v92-project-showcase{gap:28px!important}
  .v92-device-showcase{grid-template-columns:minmax(0,1.15fr) minmax(105px,.62fr);gap:10px;padding:12px;border-radius:24px}
  .v92-shot-desktop{grid-column:1/-1;border-width:5px;border-radius:16px}
  .v92-shot-tablet{border-width:5px;border-radius:18px}
  .v92-shot-mobile{border-width:4px;border-radius:21px}
  .v92-demo-launch{grid-template-columns:1fr;padding:14px;gap:6px}
  .v92-demo-launch small{grid-column:auto}
  .v92-demo-launch span{white-space:normal}
  .v88-project-actions .btn{width:100%!important;text-align:center!important}
}
@media(prefers-reduced-motion:reduce){
  body.theme-v38.page-events .event-marquee-track{animation:none!important}
  body.theme-v38.page-events .event-marquee-track span:nth-child(2){display:none!important}
  .v92-device-shot,.v92-demo-launch{transition:none!important}
}
