/* Press desk glass treatment. Scoped so the film and client strip are untouched. */
.aps-press-glass [data-m-stage]{
  background:#DCE5DF;
}
.aps-press-glass [data-m-track]{align-items:stretch;position:relative}
.aps-press-glass .aps-press-card{
  position:relative;isolation:isolate;box-sizing:border-box;
  height:clamp(390px,62vh,670px)!important;
  border-radius:30px;
  border:1px solid rgba(255,255,255,.88)!important;
  background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,255,255,.34) 58%,rgba(233,244,238,.50))!important;
  -webkit-backdrop-filter:blur(10px) saturate(115%);
  backdrop-filter:blur(10px) saturate(115%);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.95),inset 0 -1px 1px rgba(255,255,255,.5),0 14px 34px -20px rgba(17,60,49,.25)!important;
  transition:transform .25s ease,border-color .25s ease!important;
}
.aps-press-card::before{
  content:"";position:absolute;inset:7px;border-radius:23px;
  border:1px solid rgba(255,255,255,.26);pointer-events:none;z-index:-1;
}
.aps-press-card>div:first-child>span:first-child{
  border-radius:20px;box-shadow:inset 0 1px rgba(255,255,255,.28);
}
.aps-press-card>div:last-child>div:first-child{color:#F6B51E!important}
.aps-press-glass .aps-press-card--all{
  background:linear-gradient(140deg,rgba(58,115,103,.89),rgba(18,78,73,.87) 55%,rgba(12,56,51,.94))!important;
  border-color:rgba(255,255,255,.58)!important;
  color:#fff!important;
  box-shadow:inset 0 1px 1px rgba(255,255,255,.6),inset 0 -1px 1px rgba(5,36,30,.2),0 14px 34px -20px rgba(17,60,49,.3)!important;
}
@media(hover:hover) and (pointer:fine){
  .aps-press-glass .aps-press-card:hover{transform:translateY(-4px);border-color:#fff!important}
}
.aps-press-glass .aps-press-card:focus-visible{outline:3px solid #8E2C2E!important;outline-offset:5px}
@media(max-width:900px){
  .aps-press-glass .aps-press-card{height:clamp(360px,52svh,510px)!important;min-height:0!important;padding:26px!important;border-radius:24px;-webkit-backdrop-filter:none;backdrop-filter:none}
  .aps-press-card::before{inset:5px;border-radius:19px}
  .aps-press-card>div:last-child>div:nth-child(2){font-size:32px!important}
  .aps-press-glass .aps-press-card--all{font-size:36px!important}
}
@media(prefers-reduced-transparency:reduce){
  .aps-press-glass .aps-press-card{background:#f4f7f3!important;-webkit-backdrop-filter:none;backdrop-filter:none}
  .aps-press-glass .aps-press-card--all{background:#124E49!important}
}
@media(prefers-reduced-motion:reduce){.aps-press-glass .aps-press-card{transition:none!important;transform:none!important}}

/* Matching pearl glass for the capability cards. */
.aps-capabilities-glass{background:linear-gradient(rgba(220,229,223,.24),rgba(220,229,223,.12)),url("./capabilities-dam.png") center / cover no-repeat!important}
.aps-capabilities-glass [data-m-caps]{gap:24px!important}
.aps-capabilities-glass .aps-capability-card{
  isolation:isolate;box-sizing:border-box;min-width:0;border-radius:30px;
  border:1px solid rgba(255,255,255,.88);
  background:linear-gradient(145deg,rgba(255,255,255,.78),rgba(255,255,255,.34) 58%,rgba(233,244,238,.50))!important;
  -webkit-backdrop-filter:blur(8px) saturate(110%);backdrop-filter:blur(8px) saturate(110%);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.95),inset 0 -1px 1px rgba(255,255,255,.5),0 14px 34px -20px rgba(17,60,49,.25);
  transition:transform .25s ease!important;cursor:default!important;
}
.aps-capability-card::after{content:"";position:absolute;inset:7px;border-radius:23px;border:1px solid rgba(255,255,255,.26);pointer-events:none}
.aps-capability-card image-slot:not([data-filled]){opacity:0}
.aps-capability-shade,.aps-capability-stripe{display:none}
.aps-capability-copy{padding:30px 28px!important}
.aps-capability-copy>div:first-child{color:#8E2C2E!important}
.aps-capability-copy>div:nth-child(2){color:#0C2B28!important;text-wrap:balance}
.aps-capability-copy p{color:#425C54!important}
/* Maintain legibility if project photography is added later. */
.aps-capability-card:has(image-slot[data-filled]) .aps-capability-shade{display:block}
.aps-capability-card:has(image-slot[data-filled]) .aps-capability-copy>div:nth-child(2),
.aps-capability-card:has(image-slot[data-filled]) .aps-capability-copy p{color:#fff!important}
.aps-capability-card:has(image-slot[data-filled]) .aps-capability-copy>div:first-child{color:#F6B51E!important}
@media(hover:hover) and (pointer:fine){.aps-capability-card:hover{transform:translateY(-4px)}}
@media(max-width:900px){
  .aps-capabilities-glass .aps-capability-card{border-radius:24px}
  .aps-capability-card::after{inset:5px;border-radius:19px}
  .aps-capability-copy{padding:28px 26px!important}
}
@media(prefers-reduced-transparency:reduce){.aps-capabilities-glass .aps-capability-card{background:#f4f7f3!important}}
@media(prefers-reduced-motion:reduce){.aps-capabilities-glass .aps-capability-card{transition:none!important;transform:none!important}}

/* Shared rows align the labels, two-line titles and descriptions across cards.
   The description row grows with the longest paragraph instead of clipping it. */
.aps-capabilities-glass [data-m-caps]{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-rows:minmax(100px,1fr) auto auto auto;column-gap:24px;row-gap:12px;
  height:auto!important;min-height:520px;
}
.aps-capabilities-glass .aps-capability-card{
  display:grid;grid-template-rows:subgrid;grid-row:span 4;padding:28px;
}
.aps-capability-copy{display:contents}
.aps-capability-copy>div:first-child{grid-row:2;font-size:16px!important;line-height:22px}
.aps-capability-copy>div:nth-child(2){grid-row:3;font-size:clamp(30px,3vw,40px)!important;line-height:1.08!important;margin:0!important;text-wrap:initial}
.aps-capability-copy>div:nth-child(2)>span{display:block}
.aps-capability-copy p{font-size:17px!important;font-weight:500;color:#304D44!important;grid-row:4;align-self:start;margin:0!important;max-width:none!important;line-height:1.6!important;text-wrap:pretty;overflow-wrap:normal;hyphens:none}
.aps-capabilities-glass h2{text-wrap:balance}
@media(max-width:900px){
  .aps-capabilities-glass [data-m-caps]{display:flex!important;min-height:0;gap:24px!important}
  .aps-capabilities-glass .aps-capability-card{display:flex;flex-direction:column;justify-content:flex-end;height:auto!important;min-height:380px;padding:28px 26px;gap:12px}
  .aps-capability-copy>div:nth-child(2){font-size:34px!important}
}

/* Match desktop pinned scrolling on touch devices using the desktop viewport. */
@media (pointer:coarse) and (min-width:901px){
  .aps-press-glass{height:320svh!important}
  .aps-press-glass [data-m-stage]{height:100svh!important}
  .aps-press-glass .aps-press-card{height:560px!important}
}

/* A landscape phone has much less vertical room than the desktop viewport width suggests. */
@media (pointer:coarse) and (min-width:901px) and (orientation:landscape){
  .aps-press-glass [data-m-stage]{justify-content:flex-start!important;padding-top:150px;box-sizing:border-box}
  .aps-press-glass [data-m-pdrow]{top:102px!important}
  .aps-press-glass .aps-press-card{height:calc(100svh - 174px)!important;min-height:220px;padding:20px 28px!important}
  .aps-press-card>div:last-child>div:nth-child(2){font-size:30px!important;line-height:1.08!important;margin-bottom:14px!important}
  .aps-press-card>div:first-child>span:last-child{font-size:40px!important}
  .aps-press-glass .aps-press-card--all{font-size:34px!important}
}

/* One soft reflection accompanies the staggered entrance. */
.aps-capability-card.aps-capability-entered::before{
  content:"";position:absolute;inset:-30% -70%;pointer-events:none;z-index:0;
  background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.22) 50%,transparent 58%);
  transform:translateX(70%);opacity:0;
  animation:aps-capability-reflection 1100ms var(--entrance-delay,0ms) ease-out both;
}
@keyframes aps-capability-reflection{
  0%{transform:translateX(-55%);opacity:0}
  25%{opacity:1}
  100%{transform:translateX(55%);opacity:0}
}
@media(prefers-reduced-motion:reduce){
  .aps-capability-card.aps-capability-entered::before{animation:none;display:none}
}

/* Lift toward the viewer, then follow the pointer with a restrained tilt. */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .aps-capabilities-glass .aps-capability-card{
    transform:perspective(1100px) translateZ(0) rotateX(0) rotateY(0);
    transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s ease,border-color .32s ease!important;
  }
  .aps-capabilities-glass .aps-capability-card.aps-card-depth{
    z-index:3;
    transform:perspective(1100px) translateY(-22px) translateZ(115px) rotateX(var(--card-rx,0deg)) rotateY(var(--card-ry,0deg));
    border-color:#fff;
    box-shadow:inset 0 1px 2px #fff,inset 0 -1px 1px rgba(255,255,255,.5),0 46px 70px -18px rgba(5,35,30,.48);
  }
  .aps-capability-card.aps-card-depth::after{
    background:radial-gradient(ellipse at var(--card-light-x,50%) var(--card-light-y,30%),rgba(255,255,255,.24),transparent 65%);
  }
}

/* The track owns horizontal scrolling; individual cards own hover depth. */
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .aps-press-glass .aps-press-card{
    transform:perspective(1100px) translateZ(0) rotateX(0) rotateY(0);
    transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s ease,border-color .32s ease!important;
  }
  .aps-press-glass .aps-press-card.aps-card-depth{
    z-index:3;
    transform:perspective(1100px) translateY(-22px) translateZ(115px) rotateX(var(--card-rx,0deg)) rotateY(var(--card-ry,0deg));
    border-color:#fff!important;
    box-shadow:inset 0 1px 2px #fff,inset 0 -1px 1px rgba(255,255,255,.5),0 46px 70px -18px rgba(5,35,30,.48)!important;
  }
  .aps-press-card.aps-card-depth::before{
    background:radial-gradient(ellipse at var(--card-light-x,50%) var(--card-light-y,30%),rgba(255,255,255,.24),transparent 65%);
  }
}

/* The project rail moves over a uniform background. Keep its glass gradients,
   rims and depth, without re-sampling that background for every moving layer. */
@media screen and (max-width:1100px), screen and (any-pointer:coarse){
  .aps-press-glass .aps-press-card,
  .aps-press-glass .aps-press-card .aps-glass-label{
    -webkit-backdrop-filter:none!important;backdrop-filter:none!important;
  }
}