.photo-collection{padding-top:calc(var(--hdr,72px) + 40px);padding-bottom:36px}.photo-collection h1{font-size:clamp(26px,4vw,48px);margin:12px 0}.photo-collection .lead{max-width:780px}.photo-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin:28px 0}.photo-pick,.photo-slot{position:relative;min-width:0;padding:0;border:1px solid #303548;border-radius:16px;background:#0b0d16;color:#e7e9ff;overflow:hidden;text-align:left;font:inherit}.photo-pick:not(:disabled),button.photo-slot{cursor:pointer}.photo-pick:disabled{opacity:1}.photo-pick img,.photo-slot img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}.photo-pick span,.photo-slot span{display:block;padding:10px;font-size:12px}.photo-pick i{display:none;position:absolute;right:10px;top:10px;border-radius:50%;background:var(--lime,#c8ff35);color:#080a10;padding:5px 9px;font-style:normal}.photo-pick[aria-pressed=true]{border-color:var(--lime,#c8ff35);box-shadow:0 0 16px #c8ff3533}.photo-pick[aria-pressed=true] i{display:block}.photo-binder{padding-top:25px;padding-bottom:45px}.photo-binder-head{display:flex;align-items:center;justify-content:space-between;gap:15px}.photo-empty img{filter:grayscale(1) brightness(.12)}.photo-empty{color:#72798b}.photo-notice{border-left:3px solid var(--pink,#ff48b0);padding:12px 18px;background:#15121f}.photo-dialog{background:#0d101c;color:#e7e9ff;border:1px solid #343b52;border-radius:22px;padding:30px;max-width:min(94vw,720px);max-height:92vh;overflow:auto}.photo-dialog::backdrop{background:#02040cd9;backdrop-filter:blur(9px)}.photo-dialog h2{padding-right:20px;font-size:23px}.photo-dismiss{cursor:pointer}.photo-dialog>button.photo-dismiss:first-child{position:absolute;top:12px;right:15px;background:none;border:0;color:#fff;font-size:28px}.photo-order-preview,.photo-reveal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:22px 0}.photo-order-preview img,.photo-reveal-grid img{width:100%;border-radius:12px}.photo-reveal-card{position:relative;overflow:hidden}.photo-reveal-card img{animation:photo-render 1.3s ease both;animation-delay:var(--delay)}.photo-reveal-card:after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:#c8ff35;box-shadow:0 0 20px #c8ff35;animation:photo-scan 1.3s ease both;animation-delay:var(--delay)}.photo-viewer{text-align:center;width:640px}.photo-stage{width:min(290px,65vw);aspect-ratio:4/5;display:block;padding:0;margin:20px auto;border:0;background:none;perspective:1000px;cursor:pointer}.photo-tilt{position:relative;display:block;width:100%;height:100%;transform-style:preserve-3d;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .1s ease}.photo-stage.flipped .photo-tilt{transform:rotateX(var(--rx,0deg)) rotateY(calc(var(--ry,0deg) + 180deg))}.photo-face{position:absolute;inset:0;backface-visibility:hidden;border-radius:18px;overflow:hidden;background:#06070c;box-shadow:0 12px 35px #0008}.photo-face img{display:block;width:100%;height:100%;object-fit:cover}.photo-back{transform:rotateY(180deg)}.photo-sheen{position:absolute;inset:0;background:linear-gradient(115deg,transparent 20%,#ffa1f540,#7fffff45,#e8ffab40,transparent 80%);background-size:260% 260%;background-position:var(--sx,50%) var(--sy,50%);mix-blend-mode:screen;pointer-events:none;opacity:.35}.photo-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.photo-actions .btn{font-size:12px;padding:10px 15px}.photo-actions select{background:#151a29;color:white;border:1px solid #40465a;border-radius:12px;padding:10px}.photo-viewer input{width:100%;padding:10px;color:#fff;background:#141a28;border:1px solid #424b65}.photo-promo{padding:32px 0;border-top:1px solid #303548;border-bottom:1px solid #303548;background:radial-gradient(ellipse at 20% 50%,#272342,#080a12 65%)}.photo-promo>.wrap{display:grid;grid-template-columns:290px 1fr;align-items:center;gap:38px}.photo-promo h2{font-size:clamp(22px,3vw,34px);margin:10px 0}.photo-promo p{max-width:760px}.photo-fan{height:235px;position:relative}.photo-fan img{position:absolute;left:calc(35px + var(--i)*45px);top:10px;width:150px;height:auto;border-radius:13px;transform:rotate(calc((var(--i) - 1)*13deg));box-shadow:0 8px 25px #0009;animation:photo-float 5s ease-in-out infinite;animation-delay:calc(var(--i)*-.8s)}.photo-verify{display:grid;grid-template-columns:minmax(200px,380px) 1fr;gap:55px;padding:calc(var(--hdr,72px) + 40px) 20px 60px}.photo-verify>img{width:100%;height:auto;border-radius:18px}.photo-verify dl{display:grid;grid-template-columns:100px 1fr;gap:14px}.photo-verify dd{margin:0;overflow-wrap:anywhere}.photo-verify dt{color:#9ca6bd}@keyframes photo-render{from{clip-path:inset(100% 0 0)}to{clip-path:inset(0 0 0)}}@keyframes photo-scan{from{bottom:0;opacity:1}to{bottom:100%;opacity:0}}@keyframes photo-float{0%,100%{transform:rotate(calc((var(--i) - 1)*13deg))}50%{translate:0 -7px;transform:rotate(calc((var(--i) - 1)*13deg + 3deg))}}@media(max-width:900px){.photo-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.photo-promo>.wrap{grid-template-columns:240px 1fr;gap:20px}}@media(max-width:600px){.photo-collection{padding-top:calc(var(--hdr,64px) + 30px)}.photo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0}.photo-binder-head{display:block}.photo-dialog{padding:22px}.photo-order-preview,.photo-reveal-grid{grid-template-columns:repeat(3,1fr)}.photo-promo>.wrap{grid-template-columns:1fr;gap:10px}.photo-fan{height:205px;width:260px;margin:auto}.photo-fan img{width:130px}.photo-promo{padding:25px 0}.photo-verify{grid-template-columns:1fr;gap:25px}.photo-verify>img{max-width:300px;margin:auto}}@media(prefers-reduced-motion:reduce){.photo-fan img,.photo-reveal-card img,.photo-reveal-card:after{animation:none}.photo-tilt{transition:none;transform:none!important}.photo-stage.flipped .photo-tilt{transform:rotateY(180deg)!important}.photo-sheen{display:none}}

/* sample slider + 0 THB pack (Jeff 14 Oct 2026) */
.pc-samples { margin: 28px 0 8px; }
.pc-samples-h { font-size: 18px; margin: 0 0 12px; }
.pc-slider { display: flex; gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px 2px 14px; scrollbar-width: thin; }
.pc-slide { flex: 0 0 auto; width: min(300px, 72vw); margin: 0; scroll-snap-align: start; }
.pc-slide.tall { width: min(210px, 52vw); }
.pc-slide img { width: 100%; height: auto; display: block; border-radius: 16px; box-shadow: 0 18px 50px -20px rgba(91, 127, 214, .6); }
.pc-slide figcaption { font-size: 13px; color: var(--muted); margin-top: 8px; }
.pc-pack { display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin: 18px 0 26px; padding: 18px 22px; border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, .14); background: linear-gradient(135deg, rgba(91, 127, 214, .16), rgba(166, 77, 255, .12) 50%, rgba(255, 61, 138, .12)); }
.pc-pack-info { flex: 1 1 260px; display: flex; flex-direction: column; gap: 4px; }
.pc-pack-info b { font-family: var(--display); letter-spacing: .08em; font-size: 16px; }
.pc-pack-info span { color: var(--muted); font-size: 14px; }
.pc-pack-price { display: flex; flex-direction: column; align-items: center; }
.pc-pack-price strong { font-family: var(--display); font-size: 34px; line-height: 1; }
.pc-pack-price em { font-style: normal; font-size: 12px; color: #C6FF3D; margin-top: 4px; }
.pc-pack-cta { white-space: nowrap; }
/* interactive 3D sample card */
.pc3d { display: flex; flex-direction: column; align-items: center; margin: 6px 0 24px; }
.pc3d-stage { width: min(320px, 76vw); aspect-ratio: 4 / 5; perspective: 1200px; cursor: grab; touch-action: pan-y; outline: none; --sheen: 50%; }
.pc3d-stage:active { cursor: grabbing; }
.pc3d-card { position: relative; width: 100%; height: 100%; transform-style: preserve-3d; transition: none; }
.pc3d-face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; border-radius: 18px; overflow: hidden;
  box-shadow: 0 30px 70px -28px rgba(91, 127, 214, .8), 0 0 0 1px rgba(255, 255, 255, .08); }
.pc3d-face img { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; user-select: none; }
.pc3d-back { transform: rotateY(180deg); }
.pc3d-sheen { position: absolute; inset: 0; pointer-events: none; mix-blend-mode: screen; opacity: .55;
  background: linear-gradient(115deg, transparent calc(var(--sheen) - 22%), rgba(255, 214, 242, .55) calc(var(--sheen) - 8%), rgba(214, 255, 246, .6) var(--sheen), rgba(214, 228, 255, .55) calc(var(--sheen) + 8%), transparent calc(var(--sheen) + 22%)); }
.pc3d-hint { font-size: 13px; color: var(--muted); margin-top: 14px; }
@media (prefers-reduced-motion: reduce) { .pc3d-sheen { display: none; } }
/* home promo v2: 3D card | text | sample set */
.photo-promo3>.wrap{grid-template-columns:minmax(220px,300px) minmax(0,1fr) minmax(260px,400px);gap:36px}
.photo-promo3 .pc3d{margin:0}.photo-promo3 .pc3d-stage{width:min(240px,62vw)}
.pp-price{display:flex;align-items:baseline;gap:10px;margin:6px 0 16px}.pp-price strong{font-family:var(--display);font-size:32px;color:#fff}.pp-price span{color:var(--muted);font-size:14px}
.pp-set{display:flex;gap:12px;align-items:flex-end}
.pp-set figure{margin:0;flex:1 1 0;min-width:0}.pp-set figure:last-child{flex:.72 1 0}
.pp-set img{width:100%;height:auto;display:block;border-radius:12px;box-shadow:0 14px 34px -16px #000c;animation:pp-bob 6s ease-in-out infinite;animation-delay:calc(var(--i)*-1.3s)}@keyframes pp-bob{50%{translate:0 -6px}}
.pp-set figcaption{font-size:11px;color:var(--muted);margin-top:6px;text-align:center}
@media(max-width:1000px){.photo-promo3>.wrap{grid-template-columns:240px 1fr}.pp-set{grid-column:1/-1}}
@media(max-width:600px){.photo-promo3>.wrap{grid-template-columns:1fr;text-align:center}.photo-promo3 .pc3d{align-items:center}.pp-price{justify-content:center}}

/* Member card upgrade levels */
.photo-upgrade,.photo-upgrade-summary{color:#fff}.photo-slot .photo-upgrade-summary{font-size:11px;padding:4px 10px 8px}.photo-level-bar{display:flex!important;gap:5px;padding:3px 10px!important}.photo-level-bar i{height:3px;flex:1;background:#ffffff26}.photo-level-bar i.active{background:#fff}.photo-levels{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.photo-levels button{font:inherit;font-size:10px;border:1px solid #ffffff45;border-radius:9px;background:#000;color:#fff;padding:10px 4px;cursor:pointer}.photo-levels button[aria-pressed=true]{background:#fff;color:#000}.photo-levels button:disabled{opacity:.35;cursor:default}.photo-upgrade p{font-size:12px;margin:10px 0}.photo-level-up{letter-spacing:.15em;font-weight:700}.photo-upgrading .photo-front img{animation:photo-render 1.5s ease both}.photo-upgrading .photo-front:after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;background:#fff;box-shadow:0 0 24px #fff;animation:photo-scan 1.5s ease both;pointer-events:none}@media(prefers-reduced-motion:reduce){.photo-upgrading .photo-front img,.photo-upgrading .photo-front:after{animation:none}}
