/* PPS Luggage Carousel — matches the PPS Hero Window palette */
.plc{
  --navy:#141b4d; --accent:#d9821c; --accent-soft:#f0a94a; --paper:#fbfaf7; --muted:#5f6178;
  --flap-t:#232c69; --flap-b:#1b235a;
  --hdr:var(--plc-hdr,0px);
  position:relative; width:100%; box-sizing:border-box; height:var(--plc-h,100vh); padding-top:var(--plc-pt,0px); overflow:hidden;
  background:radial-gradient(120% 90% at 80% 20%,#f3efe8 0%,#e6dfd3 45%,#d4cabb 100%);
  font-family:'Archivo',sans-serif; color:var(--navy);
}
.plc *{box-sizing:border-box}
.plc__track{position:relative; height:100%}
.plc__stage{--by:76%; position:relative; height:100%; overflow:hidden; touch-action:none}
html.plc-locked,html.plc-locked body{overflow:hidden; height:100%; overscroll-behavior:none}
.plc__stage::before{content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(60% 55% at 50% 48%,rgba(80,60,30,.12),rgba(0,0,0,0) 70%)}

/* Sign + tabs */
.plc__head{position:absolute; top:clamp(20px,4vh,40px); left:50%; transform:translateX(-50%); z-index:300; display:flex; flex-direction:column; align-items:center; gap:18px; width:max-content; max-width:calc(100% - 32px)}
.plc__sign{display:flex; align-items:center; gap:clamp(10px,1.5vw,18px); padding:clamp(10px,1.2vw,14px) clamp(12px,1.6vw,20px); background:var(--navy); border-radius:10px; box-shadow:0 14px 28px -14px rgba(20,27,77,.6)}
.plc__sep{width:1px; align-self:stretch; background:rgba(251,250,247,.18)}
.plc__lbl{font:500 11px/1 'IBM Plex Mono',monospace; letter-spacing:.14em; text-transform:uppercase; color:#a3a7c9}
.plc__f{display:flex; gap:3px}
.plc__c{--s:clamp(14px,1.9vw,22px); position:relative; flex:none; width:var(--s); height:calc(var(--s)*1.45); perspective:calc(var(--s)*8); font:500 calc(var(--s)*.95)/1 'IBM Plex Mono',monospace; color:var(--paper)}
.plc__f--accent .plc__c{color:var(--accent-soft)}
.plc__h{position:absolute; left:0; right:0; height:50%; overflow:hidden; backface-visibility:hidden}
.plc__h>span{position:absolute; left:0; right:0; height:200%; display:flex; align-items:center; justify-content:center}
.plc__h.t,.plc__h.ft{top:0; background:var(--flap-t); border-radius:3px 3px 0 0; transform-origin:50% 100%}
.plc__h.b,.plc__h.fb{bottom:0; background:var(--flap-b); border-radius:0 0 3px 3px; transform-origin:50% 0}
.plc__h.t>span,.plc__h.ft>span{top:0}
.plc__h.b>span,.plc__h.fb>span{bottom:0}
.plc__h.ft,.plc__h.fb{z-index:2}
.plc__h.fb{transform:rotateX(90deg)}
.plc__c::after{content:""; position:absolute; left:0; right:0; top:50%; height:1px; margin-top:-.5px; background:rgba(8,11,36,.7); z-index:3}

.plc__tabs{display:flex; gap:8px; flex-wrap:wrap; justify-content:center}
.plc button.plc__tab{-webkit-appearance:none; appearance:none; display:flex; align-items:center; gap:8px; margin:0; padding:10px 16px!important; border:1.5px solid var(--navy)!important; border-radius:999px!important; background:transparent!important; color:var(--navy)!important; box-shadow:none!important; cursor:pointer; font:600 13px/1 'Inter',sans-serif!important; letter-spacing:.04em!important; text-transform:uppercase!important; transition:background .2s,color .2s}
.plc button.plc__tab span{color:#8a6a3a}
.plc button.plc__tab:hover{background:rgba(20,27,77,.07)!important}
.plc button.plc__tab.is-active{background:var(--navy)!important; color:var(--paper)!important}
.plc button.plc__tab.is-active span{color:var(--accent-soft)}
.plc button.plc__tab:focus-visible{outline:2px solid var(--accent); outline-offset:3px}

/* Belt */
.plc__surface{position:absolute; left:0; right:0; top:calc(var(--by) - 10px); height:28px; z-index:2; background-image:repeating-linear-gradient(90deg,#2b3150 0 46px,#1c2140 46px 48px)}
.plc__lip{position:absolute; left:0; right:0; top:calc(var(--by) + 18px); height:9px; z-index:60; background:linear-gradient(#e0dace,#a69f92)}
.plc__skirt{position:absolute; left:0; right:0; top:calc(var(--by) + 27px); bottom:0; z-index:60; background:var(--navy)}
.plc__wall{position:absolute; right:0; width:150px; top:calc(var(--by) - 290px); height:300px; z-index:70; background:var(--navy); border-radius:14px 0 0 0; padding:18px 0 0 18px}
.plc__wall span{display:block; width:100%; height:100%; border-radius:8px 0 0 0; background:repeating-linear-gradient(90deg,#0c1033 0 13px,#1a2150 13px 15px)}

/* Bags */
.plc a.plc__bag{position:absolute; left:0; bottom:calc(100% - var(--by) - 4px); width:var(--w,184px); height:var(--h,272px); z-index:10; display:block; color:var(--navy); text-decoration:none; box-shadow:none; will-change:transform; transform:translate3d(-400px,0,0)}
.plc a.plc__bag.is-out{display:none}
.plc a.plc__bag:hover,.plc a.plc__bag:focus-visible{z-index:400!important; outline:none}
.plc__bag-in{position:absolute; inset:0; display:block; transition:transform .25s ease}
.plc__bag:hover .plc__bag-in,.plc__bag:focus-visible .plc__bag-in{transform:translateY(-12px)}
.plc__handle{position:absolute; left:31%; right:31%; top:6px; height:26px; border:4px solid #3b4058; border-bottom:0; border-radius:4px 4px 0 0}
.plc__handle::before{content:""; position:absolute; left:-9px; right:-9px; top:-8px; height:11px; border-radius:6px; background:linear-gradient(#2a3050,#12172f); box-shadow:inset 0 1px 0 rgba(255,255,255,.15)}
.plc__shell{position:absolute; left:0; right:0; top:30px; bottom:14px; padding:0; border-radius:24px 24px 20px 20px; background:linear-gradient(135deg,#26317a 0%,#141b4d 55%,#0d1238 100%); box-shadow:inset 0 2px 0 rgba(255,255,255,.14),inset 0 -3px 0 rgba(0,0,0,.3),0 18px 20px -12px rgba(40,30,15,.55)}
.plc__shell::before{content:""; position:absolute; inset:6px; border:1.5px dashed rgba(251,250,247,.45); border-radius:18px 18px 14px 14px; pointer-events:none; z-index:2}
.plc__photo{position:relative; display:block; width:100%; height:100%; overflow:hidden; border-radius:24px 24px 20px 20px; background:#8a8fae; transform:translateZ(0); -webkit-mask-image:-webkit-radial-gradient(white,black)}
.plc__photo::after{content:""; position:absolute; inset:0; z-index:1; pointer-events:none; background:linear-gradient(115deg,rgba(255,255,255,.26) 0%,rgba(255,255,255,0) 36%),linear-gradient(0deg,rgba(0,0,0,.18) 0%,rgba(0,0,0,0) 30%)}
.plc__photo img,.plc__photo .plc__img{position:absolute; inset:0; width:100%!important; height:100%!important; max-width:none; object-fit:cover; margin:0}
.plc__corner{position:absolute; z-index:3; width:26px; height:26px; border:0 solid #0a0e2c}
.plc__corner{display:none}
.plc__shell::after{content:""; position:absolute; inset:0; border:5px solid #0a0e2c; border-radius:24px 24px 20px 20px; pointer-events:none; z-index:3}
.plc__corner--tl{left:0; top:0; border-left-width:4px; border-top-width:4px; border-radius:24px 0 0 0}
.plc__corner--tr{right:0; top:0; border-right-width:4px; border-top-width:4px; border-radius:0 24px 0 0}
.plc__corner--bl{left:0; bottom:0; border-left-width:4px; border-bottom-width:4px; border-radius:0 0 0 20px}
.plc__corner--br{right:0; bottom:0; border-right-width:4px; border-bottom-width:4px; border-radius:0 0 20px 0}
.plc__wheel{position:absolute; bottom:0; width:16px; height:12px; border-radius:50%; background:radial-gradient(circle at 50% 40%,#3b4058 0 30%,#12172f 32%)}
.plc__wheel::before{content:""; position:absolute; left:-3px; right:-3px; bottom:8px; height:8px; border-radius:4px 4px 2px 2px; background:#1d2238}
.plc__wheel--l{left:9%} .plc__wheel--r{right:9%}
.plc__tag{position:absolute; z-index:5; top:-5px; left:calc(64% - 32px); width:64px; transform-origin:50% 0; transform:rotate(9deg); display:flex; flex-direction:column; align-items:center; transition:transform .45s cubic-bezier(.3,1.6,.5,1)}
.plc__bag:hover .plc__tag{transform:rotate(3deg)}
.plc__string{width:8px; height:30px; margin-bottom:-8px; border:2px solid #2a2f45; border-radius:6px; position:relative; z-index:2}
.plc__label{position:relative; display:flex; flex-direction:column; align-items:center; gap:5px; width:100%; padding:12px 5px 5px; background:linear-gradient(#fdfcf9,#f1ede4); border-radius:3px 3px 6px 6px; clip-path:polygon(18% 0,82% 0,100% 12%,100% 100%,0 100%,0 12%); box-shadow:inset 0 0 0 1px rgba(20,27,77,.12); filter:drop-shadow(0 6px 6px rgba(40,30,15,.35)); font:600 8.5px/1.2 'Inter',sans-serif; letter-spacing:.03em; text-transform:uppercase; text-align:center; color:var(--navy); overflow-wrap:normal; word-break:normal; hyphens:manual}
.plc__label::before{content:""; position:absolute; top:4px; left:50%; width:7px; height:7px; margin-left:-3.5px; border-radius:50%; background:#d9d2c4; box-shadow:0 0 0 2px #b9ad96,inset 0 1px 2px rgba(0,0,0,.35)}
.plc__label::after{content:""; display:block; width:100%; height:8px; background:repeating-linear-gradient(90deg,var(--navy) 0 1px,transparent 1px 3px,var(--navy) 3px 5px,transparent 5px 6px,var(--navy) 6px 7px,transparent 7px 10px); opacity:.8}
.plc__label b{display:block; width:100%; padding-top:4px; border-top:2px solid var(--accent); font-weight:600}
.plc__card{position:absolute; left:50%; bottom:100%; width:230px; padding:14px 16px; display:flex; flex-direction:column; gap:6px; background:var(--paper); border-radius:12px; box-shadow:0 18px 30px -14px rgba(40,30,15,.5); opacity:0; pointer-events:none; transform:translate(-50%,0); transition:opacity .2s ease,transform .25s ease}
.plc__bag:hover .plc__card,.plc__bag:focus-visible .plc__card{opacity:1; transform:translate(-50%,-26px)}
.plc__card{font-family:'Inter',sans-serif; gap:4px}
.plc__card-client{font:600 11px/1.2 'Inter',sans-serif!important; letter-spacing:.08em; text-transform:uppercase; color:var(--accent)!important}
.plc__card b{font:600 17px/1.2 'Inter',sans-serif; text-wrap:pretty; margin-bottom:2px}
.plc__card span{display:block; font:600 13px/1.35 'Inter',sans-serif; color:var(--muted)}
.plc__card em{margin-top:6px; font:600 13px/1 'Inter',sans-serif; font-style:normal; color:var(--accent)}

.plc__hint{position:absolute; left:50%; top:calc(var(--by) + 67px); transform:translate(-50%,-50%); z-index:300; display:flex; align-items:center; gap:10px; padding:8px 16px 8px 14px; border-radius:999px; background:rgba(251,250,247,.06); box-shadow:inset 0 0 0 1px rgba(251,250,247,.14); color:var(--paper); font:600 12px/1 'Inter',sans-serif; letter-spacing:.04em; white-space:nowrap}
.plc__hint .plc__lbl{font:600 11px/1 'Inter',sans-serif; letter-spacing:.08em}
.plc__hint .plc__c{--s:15px}
.plc__hsep{width:1px; height:16px; background:rgba(251,250,247,.22)}
.plc__prog{position:relative; width:80px; height:2px; background:rgba(251,250,247,.3)}
.plc__prog i{position:absolute; left:0; top:0; bottom:0; width:0; background:var(--accent-soft)}

/* Phones: stacked bags, no belt */
@media (max-width:767px){
  .plc{height:auto!important; padding-top:0!important; overflow:visible}
  .plc__track{height:auto}
  .plc__stage{position:static; height:auto; overflow:visible; padding:24px 16px 56px; touch-action:auto}
  .plc__head{position:static; transform:none; width:auto; max-width:none; margin:0 auto 32px; gap:16px}
  .plc__sign{flex-direction:column; gap:8px; padding:12px 14px}
  .plc__sep{display:none}
  .plc__c{--s:17px}
  .plc__f{gap:2px}
  .plc__dest .plc__c{color:var(--accent-soft)}
  .plc__tabs{gap:6px}
  .plc button.plc__tab{min-height:44px; padding:0 13px!important; font-size:12px!important}
  .plc__surface,.plc__lip,.plc__skirt,.plc__wall,.plc__hint{display:none}
  .plc__bags{display:flex; flex-direction:column; align-items:center; gap:44px}
  .plc a.plc__bag{position:relative; left:auto; bottom:auto; width:100%; max-width:320px; height:auto; transform:none!important; display:flex; flex-direction:column; align-items:center; gap:16px}
  .plc__bag-in{position:relative; inset:auto; width:212px; height:314px; flex:none}
  .plc__bag:hover .plc__bag-in{transform:none}
  .plc__card,.plc__bag:hover .plc__card{position:static; width:auto; padding:0; opacity:1; transform:none; background:none; box-shadow:none; align-items:center; text-align:center; pointer-events:auto}
  .plc__card-client{font:600 11px/1.2 'Inter',sans-serif!important; letter-spacing:.08em; text-transform:uppercase; color:var(--accent)!important}
.plc__card b{font-size:19px}
  .plc__card em{font-size:14px}
}
@media (prefers-reduced-motion:reduce){.plc__bag-in,.plc__card,.plc__tag{transition:none}}
