.mystery-page{min-height:100vh;background:#e9d7a8;color:#4b3d2f}.mystery-page .background{opacity:.08}
.mystery-header{max-width:1320px;margin:auto;padding:28px 40px 0;display:grid;grid-template-columns:1fr auto 1fr;align-items:start;gap:20px;position:relative;z-index:2}.mystery-back{justify-self:start;padding:9px 16px;border-radius:999px;background:rgba(255,249,235,.78);box-shadow:0 7px 18px rgba(75,55,30,.08);color:#654a32;font-weight:500}.mystery-brand{text-align:center}.mystery-kicker{font-size:11px;letter-spacing:4px;text-transform:uppercase;color:#806b4f}.mystery-brand h1{font-family:'Cormorant Garamond',serif;font-size:54px;line-height:.95;letter-spacing:1px;color:#3e3328;margin:7px 0 10px}.mystery-brand p{font-size:13px;color:#776650;letter-spacing:.7px;margin:0}.mystery-lang{justify-self:end;display:flex;gap:9px;align-items:center;color:#806b4f;margin-top:7px}.mystery-lang button,.case-language button{border:0;background:none;font:600 14px Poppins,sans-serif;color:#806b4f;cursor:pointer;padding:4px}.mystery-lang button.active,.case-language button.active{color:#8f5e2f;text-decoration:underline;text-underline-offset:5px}
.mystery-main{max-width:1320px;margin:auto;padding:30px 40px 90px}
.mystery-intro{text-align:center;font-family:'Cormorant Garamond',serif;font-size:20px;font-style:italic;color:#6f5b43;margin:6px 0 6px}
.mystery-board{position:relative;min-height:760px;margin-top:4px;overflow:hidden}
.paper-card{position:absolute;width:300px;min-height:285px;padding:15px 18px 20px;background:#f5e8c5;border:1px solid rgba(93,66,34,.23);box-shadow:0 14px 24px rgba(76,55,29,.14);cursor:pointer;transform-origin:center;transition:transform .28s ease,box-shadow .28s ease}
.paper-card:before{content:"";position:absolute;inset:7px;border:1px solid rgba(104,77,45,.10);pointer-events:none;z-index:5}
.paper-card:hover{transform:translateY(-8px) rotate(0deg) scale(1.02);box-shadow:0 22px 34px rgba(76,55,29,.20)}
.paper-kicker{font:600 8px Poppins,sans-serif;letter-spacing:1.5px;color:#8a7357;margin:10px 2px 6px}
.paper-card h2{font-family:'Cormorant Garamond',serif;font-size:23px;line-height:.95;letter-spacing:.35px;color:#3f352b;margin:0 0 8px}
.paper-card p{font:400 10px/1.35 Poppins,sans-serif;color:#74614c;margin:0;max-width:235px}
.paper-action{display:inline-block;margin-top:9px;font:600 9px Poppins,sans-serif;color:#8d5f35}
.card-visual{position:relative;height:112px;margin:0 1px 1px;overflow:hidden;border:1px solid rgba(93,66,34,.16);box-shadow:inset 0 0 0 5px rgba(255,250,238,.18)}
.card-visual-photo{background:#d5c7ad}
.card-visual-photo img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.78) sepia(.12) contrast(.95);object-position:center 48%}
.card-d .card-visual-photo img{object-position:center 58%}
.card-c .card-visual-photo img{object-position:center 68%}
.photo-mark{position:absolute;right:7px;bottom:6px;padding:2px 5px;background:rgba(247,240,224,.82);font:600 6px Poppins,sans-serif;letter-spacing:1px;color:#695640}
.visual-document{background:linear-gradient(165deg,#d8ccb2,#eee4ce 60%,#c9baa0);padding:10px 12px}
.visual-document:before{content:"";position:absolute;left:11px;top:10px;width:52px;height:56px;border:1px solid rgba(83,65,44,.28);background:rgba(255,250,238,.34);transform:rotate(-5deg)}
.visual-stamp{position:absolute;left:17px;top:17px;border:1px solid rgba(137,79,51,.48);padding:3px 5px;font:600 7px Poppins,sans-serif;letter-spacing:1px;color:#895538;transform:rotate(-8deg)}
.visual-lines{position:absolute;right:14px;top:19px;width:105px;height:36px;background:repeating-linear-gradient(to bottom,rgba(92,72,49,.22) 0 1px,transparent 1px 8px);transform:rotate(2deg)}
.visual-number{position:absolute;right:13px;bottom:8px;font:700 25px 'Cormorant Garamond',serif;color:rgba(76,57,39,.38)}
.visual-photo{background:radial-gradient(circle at 33% 42%,rgba(73,61,47,.5) 0 9%,transparent 10%),linear-gradient(145deg,#c8bda4,#eee5cf 62%,#b9aa8e)}
.visual-circle{position:absolute;width:42px;height:42px;border:3px solid rgba(66,56,44,.34);border-radius:50%;left:28px;top:18px;box-shadow:22px 10px 0 -15px rgba(66,56,44,.32)}
.visual-caption{position:absolute;right:12px;bottom:10px;font:600 7px/1.2 Poppins,sans-serif;letter-spacing:1px;color:rgba(67,54,39,.58)}
.visual-object{background:linear-gradient(135deg,#d6c9ad,#eee4ce)}
.object-shape{position:absolute;left:50%;top:14px;width:40px;height:49px;border-radius:45% 45% 35% 35%;background:rgba(72,61,47,.45);transform:translateX(-50%) rotate(-7deg);box-shadow:10px 7px 0 -5px rgba(72,61,47,.16)}
.object-shadow{position:absolute;left:50%;bottom:10px;width:76px;height:8px;background:rgba(72,61,47,.14);border-radius:50%;transform:translateX(-50%)}
.visual-evidence{background:#e2d6bc}
.evidence-pin{position:absolute;left:19px;top:15px;width:10px;height:10px;border-radius:50%;background:rgba(133,82,55,.62);box-shadow:0 0 0 3px rgba(255,250,238,.55)}
.evidence-line{position:absolute;left:34px;height:1px;background:rgba(83,65,44,.28);transform-origin:left center}
.line-1{top:20px;width:128px;transform:rotate(4deg)}
.line-2{top:39px;width:100px;transform:rotate(-3deg)}
.line-3{top:58px;width:138px;transform:rotate(2deg)}
.card-a{left:6%;top:48px;transform:rotate(-4.5deg);background:#f1e2bd}
.card-b{left:36%;top:10px;transform:rotate(3.5deg);background:#eadfc1}
.card-c{right:7%;top:72px;transform:rotate(-2.8deg);background:#e6d4b4}
.card-d{left:20%;top:400px;transform:rotate(2.8deg);background:#efd3bd}
.card-e{right:23%;top:455px;transform:rotate(-4deg);background:#e9e1c7;cursor:default}
.ghost-card{opacity:.94}
.ghost-card:hover{transform:rotate(var(--r,0deg))}
.card-e:after{content:"COMING SOON";position:absolute;right:18px;bottom:14px;font:600 9px Poppins,sans-serif;letter-spacing:1.5px;color:#a38b6e}
.case-modal{position:fixed;inset:0;z-index:10000;display:none}.case-modal.open{display:block}.case-modal-backdrop{position:absolute;inset:0;background:rgba(42,30,19,.58);backdrop-filter:blur(5px)}.case-panel{position:relative;width:min(1000px,92vw);max-height:90vh;overflow:auto;overflow-x:hidden;margin:5vh auto;background:#f7efe2;border-radius:20px;box-shadow:0 30px 90px rgba(0,0,0,.3);display:grid;grid-template-columns:42% 58%;border:1px solid rgba(255,255,255,.5)}.case-close{position:absolute;right:14px;top:10px;width:38px;height:38px;border:0;border-radius:50%;background:rgba(255,250,242,.9);font-size:27px;color:#5d4937;cursor:pointer;z-index:2}.case-image-wrap{padding:24px;display:flex;align-items:center;justify-content:center;background:#e5d6bf}.case-image-wrap img{width:100%;max-height:70vh;object-fit:contain;box-shadow:0 15px 30px rgba(0,0,0,.16)}.case-content{padding:40px 36px}.case-content h2{font-family:'Cormorant Garamond',serif;font-size:48px;line-height:1.02;color:#4b3d2f;margin:10px 0 20px}.case-text{font-size:16px;line-height:1.8;color:#55473a;white-space:pre-line}.audio-box{margin-top:26px;padding:17px 18px;border-radius:16px;background:rgba(255,255,255,.55);border:1px solid rgba(117,82,40,.12)}.audio-top{display:flex;justify-content:space-between;gap:15px;margin-bottom:10px;color:#594733}.audio-note{font-size:11px;color:#9a826b}.audio-box audio{width:100%}.case-language{display:flex;justify-content:center;gap:18px;margin-top:18px}
.case-photos{display:none}
.case-panel.is-dossier{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);width:min(1100px,94vw);direction:ltr}
.case-panel.is-dossier .case-image-wrap{display:none}
.case-panel.is-dossier .case-photos{display:flex;flex-direction:column;gap:12px;padding:44px 22px 22px 16px;background:#e6d7bc;min-width:0}
.case-panel.is-dossier .case-content{order:1;padding:32px 30px 34px 34px;min-width:0}
.case-panel.is-dossier .case-photos{order:2}
.case-panel.is-dossier .case-content h2{font-size:40px;margin:8px 0 16px}
.case-panel.is-dossier .case-text{font-size:15px;line-height:1.72}
.case-photos figure{margin:0}
.case-photo-main{padding:6px;background:#efe4cc;border:1px solid rgba(93,66,34,.16);box-shadow:0 10px 22px rgba(63,47,28,.12)}
.case-photo-main img{display:block;width:100%;max-height:32vh;object-fit:cover;object-position:center 48%;background:#d7c9ae}
.case-panel[data-case="3"] .case-photo-main img{object-fit:contain;object-position:center;background:#d7c9ae}
.case-photo-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;min-width:0}
.case-photo-row figure{padding:5px;background:#efe4cc;border:1px solid rgba(93,66,34,.14);box-shadow:0 8px 16px rgba(63,47,28,.1)}
.case-photo-row img{display:block;width:100%;height:108px;object-fit:cover;background:#d7c9ae}
.case-photo-row figure:last-child img{object-fit:contain;background:#1c1814}
.case-panel[data-case="3"] .case-photo-row figure:last-child img{object-fit:contain;background:#e8dcc4}
.case-panel[data-case="4"] .case-photo-main img{object-fit:contain;object-position:center 70%;background:#d7c9ae}
.case-panel[data-case="4"] .case-photo-row figure:last-child img{object-fit:cover;object-position:center 70%;background:#d7c9ae}
.case-photo-credit{margin:2px 2px 0;font:500 10px/1.45 Poppins,sans-serif;letter-spacing:.04em;color:#7a6854}
html[dir="rtl"] .case-panel.is-dossier .case-content,
html[dir="rtl"] .case-panel.is-dossier .case-photo-credit{direction:rtl}
@media(max-width:850px){
  .mystery-header{grid-template-columns:1fr auto;padding:20px}
  .mystery-brand{grid-column:1/-1;grid-row:1}
  .mystery-back{grid-column:1;grid-row:2}
  .mystery-lang{grid-column:2;grid-row:2}
  .mystery-brand h1{font-size:42px}
  .mystery-main{padding:20px 16px 60px}
  .mystery-board{min-height:1060px;margin-top:10px}
  .paper-card{width:245px;min-height:255px;padding:13px 15px 18px}
  .paper-card h2{font-size:21px}
  .paper-card p{font-size:9px}
  .card-visual{height:92px}
  .card-a{left:3%;top:35px}
  .card-b{right:3%;left:auto;top:250px}
  .card-c{left:8%;right:auto;top:465px}
  .card-d{right:3%;left:auto;top:680px}
  .card-e{left:12%;right:auto;top:895px}
  .case-panel{grid-template-columns:1fr;width:94vw;margin:3vh auto;max-height:94vh}
  .case-image-wrap{padding:16px}
  .case-image-wrap img{max-height:42vh}
  .case-content{padding:25px 22px 30px}
  .case-content h2{font-size:39px}
  .case-text{font-size:15px}
  .audio-top{flex-direction:column;gap:2px}
  .case-panel.is-dossier{grid-template-columns:1fr;width:94vw}
  .case-panel.is-dossier .case-photos{order:1;padding:40px 16px 10px}
  .case-panel.is-dossier .case-content{order:2;padding:18px 22px 28px}
  .case-panel.is-dossier .case-content h2{font-size:34px}
  .case-photo-main img{max-height:32vh}
  .case-photo-row img{height:96px}
}
