/* ================================================================
   nonodon-deck.css  (www.nonodon.com: service card deck beside the hero headline)
   REV 0.1  |  20261104  |  Nonodon LLC
   ================================================================ */
.hub-hero.split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:48px;align-items:center}
.hub-hero.split .hero-copy{display:flex;flex-direction:column;gap:22px;min-width:0}
.deck{display:flex;flex-direction:column;gap:16px;min-width:0}
.deck-stage{display:grid;padding:18px 18px 0 0}
.dcard{grid-area:1/1;display:flex;flex-direction:column;gap:14px;min-width:0;
  background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:14px;padding:28px;
  box-shadow:0 18px 40px -24px rgba(0,0,0,.35);position:relative;overflow:hidden;
  transition:transform .55s cubic-bezier(.2,.7,.2,1),opacity .45s ease;will-change:transform,opacity}
.dcard[data-pos="0"]{z-index:3;transform:none;opacity:1}
.dcard[data-pos="1"]{z-index:2;transform:translate(10px,-10px) scale(.975);opacity:.55;pointer-events:none}
.dcard[data-pos="2"]{z-index:1;transform:translate(18px,-18px) scale(.95);opacity:.28;pointer-events:none}
.dcard[data-pos="out"]{z-index:4;transform:translateX(-48px) rotate(-2deg);opacity:0;pointer-events:none}
.dcard[data-pos="hide"]{z-index:0;transform:translate(18px,-18px) scale(.95);opacity:0;pointer-events:none}
.dcard[data-pos="1"] *,.dcard[data-pos="2"] *,.dcard[data-pos="hide"] *{visibility:hidden}
.dcard-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.dcard-ico{width:52px;height:52px;border-radius:12px;display:grid;place-items:center;color:var(--accent);
  background:color-mix(in srgb,var(--accent) 12%,transparent);border:1px solid color-mix(in srgb,var(--accent) 35%,transparent)}
.dcard .eyebrow{margin:0}
.dcard h3{margin:0;font-size:clamp(22px,2.4vw,28px);line-height:1.15;letter-spacing:-.01em;text-wrap:balance}
.dcard p{margin:0;color:var(--muted);font-size:16px;line-height:1.6}
.dcard ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}
.dcard li{display:flex;gap:10px;align-items:baseline;font-size:15px;line-height:1.5}
.dcard li::before{content:"";flex:0 0 8px;height:8px;border-radius:2px;background:var(--accent);transform:translateY(-1px)}
.dcard .go{margin-top:6px;display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:14px;
  border-top:1px solid var(--line);font-family:var(--mono);font-size:14px;color:var(--accent-text);text-decoration:none}
.dcard .go:hover{color:var(--accent-hover)}
.dcard .go b{font-size:20px;font-weight:400}
.dcard .go-btn{align-self:flex-start;margin-top:6px}
.dcard-bar{position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--accent);transform-origin:left;transform:scaleX(0)}
.deck.run .dcard[data-pos="0"] .dcard-bar{animation:dbar var(--dur) linear forwards}
.deck.paused .dcard[data-pos="0"] .dcard-bar{animation-play-state:paused}
@keyframes dbar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.deck-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.deck-dots{display:flex;flex-wrap:wrap;gap:6px}
.deck-dots button{font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--muted);background:transparent;
  border:1px solid var(--line-strong);border-radius:999px;padding:5px 10px;cursor:pointer;min-height:32px}
.deck-dots button[aria-current="true"]{color:var(--on-accent);background:var(--accent);border-color:var(--accent)}
.deck-ctl{display:flex;gap:6px}
.deck-ctl button{width:36px;height:36px;display:grid;place-items:center;border-radius:999px;border:1px solid var(--line-strong);
  background:transparent;color:var(--ink);cursor:pointer}
.deck-ctl button:hover,.deck-dots button:hover{border-color:var(--accent)}
.deck button:focus-visible,.dcard a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
@media (max-width:959.98px){
  .hub-hero.split{grid-template-columns:minmax(0,1fr);gap:32px}
  .deck{max-width:620px}
}
@media (max-width:640px){
  .deck-stage{padding:12px 12px 0 0}
  .dcard{padding:22px}
  .dcard[data-pos="1"]{transform:translate(6px,-6px) scale(.98)}
  .dcard[data-pos="2"]{transform:translate(12px,-12px) scale(.96)}
}
@media (prefers-reduced-motion:reduce){
  .dcard{transition:opacity .2s linear}
  .dcard[data-pos="out"]{transform:none}
}