.sample-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.sample-card{perspective:1400px;min-width:0}.sample-turn{position:relative;aspect-ratio:1.54;transform-style:preserve-3d;transition:transform .65s cubic-bezier(.2,.7,.2,1)}.sample-card.is-flipped .sample-turn{transform:rotateY(180deg)}.sample-front,.sample-back{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border:1px solid #bdd0c6;border-radius:12px;overflow:hidden;background:#062d31}.sample-front{display:flex;flex-direction:column}.sample-front>img{width:100%;height:auto;flex:1;min-height:0;object-fit:cover;object-position:top}.sample-label{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 22px;color:white}.sample-label small{font-size:12px;color:#c2d4cd}.sample-label h3{font-size:22px;margin:5px 0 0;color:white}.sample-play{border:1px solid #b49b66;background:transparent;color:#f5d598;border-radius:4px;padding:11px;font:600 14px inherit;cursor:pointer;min-height:44px}.sample-back{transform:rotateY(180deg);display:flex;flex-direction:column}.sample-browser{padding:8px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#d5e7de;font-size:12px;min-height:40px}.sample-browser>span:first-child{color:#c3a065;letter-spacing:4px}.sample-close{background:transparent;border:0;color:white;font:24px/1 Arial;cursor:pointer;min-width:36px;min-height:30px}.sample-back video{display:block;width:100%;min-height:0;flex:1;background:#062d31;object-fit:contain}.sample-links{padding:13px 18px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:13px;color:#cadbd4}.sample-links a{color:#f3d092;font-weight:700;text-decoration:underline;min-height:32px;display:flex;align-items:center}.sample-disclosure{font-size:14px;color:#536c62;max-width:850px;margin-top:28px}.sample-card.is-flipped .sample-front{visibility:hidden;transition:visibility 0s .3s}.sample-card:not(.is-flipped) .sample-back{visibility:hidden;transition:visibility 0s .3s}.sample-label button:focus-visible,.sample-back button:focus-visible,.sample-back a:focus-visible{outline:3px solid white;outline-offset:2px}@media(max-width:700px){.sample-grid{grid-template-columns:1fr;gap:22px}.sample-turn{aspect-ratio:1.35}.sample-label{padding:13px 15px}.sample-label h3{font-size:19px}.sample-play{font-size:13px}.sample-links{padding:10px 12px}}@media(prefers-reduced-motion:reduce){.sample-turn{transition:none}.sample-card.is-flipped .sample-front,.sample-card:not(.is-flipped) .sample-back{transition:none}}
