.service-tarot .service-hero-art {
    background:
        linear-gradient(90deg, rgba(5,5,16,.98), rgba(9,6,24,.8) 48%, rgba(22,9,43,.42)),
        url("../img/card-back.png") 78% 42% / min(35vw, 470px) auto no-repeat,
        radial-gradient(circle at 75% 40%, #3a1e5a, #090716 52%);
}
.tarot-room { position: relative; overflow: hidden; background: radial-gradient(circle at 50% 0, rgba(106,55,139,.27), transparent 33%), #080614; }
.tarot-room::before { content:""; position:absolute; inset:0; opacity:.2; pointer-events:none; background-image:radial-gradient(circle,#f0cf7a 0 1px,transparent 1.5px); background-size:71px 71px; }
.tarot-room > .container { position:relative; }
.tarot-heading { display:grid; grid-template-columns:1fr 330px; align-items:end; gap:55px; margin-bottom:34px; }
.tarot-heading h2,.reading-heading h2 { margin:12px 0; font-size:clamp(39px,5vw,62px); line-height:1.13; }
.tarot-heading h2 em,.reading-heading h2 em { display:block; color:var(--gold-light); font-family:var(--display); font-style:normal; }
.tarot-heading > div > p { max-width:740px; color:var(--muted); }
.tarot-privacy { display:flex; gap:13px; padding:17px; border:1px solid rgba(214,172,80,.2); border-radius:15px; background:rgba(214,172,80,.05); }
.tarot-privacy > span { color:#8bd6a9; }
.tarot-privacy p { display:flex; flex-direction:column; margin:0; font-size:12px; }
.tarot-privacy small { margin-top:3px; color:var(--muted); line-height:1.5; }
.tarot-setup { display:grid; grid-template-columns:1.1fr .9fr; gap:22px; padding:27px; border:1px solid rgba(214,172,80,.23); border-radius:24px; background:linear-gradient(145deg,rgba(31,21,54,.87),rgba(12,9,27,.96)); box-shadow:0 24px 80px rgba(0,0,0,.28); }
.spread-picker { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:0; padding:0; border:0; }
.spread-picker legend,.tarot-question > label { grid-column:1/-1; display:block; margin-bottom:11px; color:#d9d1e1; font-size:13px; }
.spread-option { position:relative; min-height:142px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; padding:15px; border:1px solid rgba(214,172,80,.13); border-radius:16px; background:rgba(255,255,255,.025); text-align:center; cursor:pointer; transition:.2s ease; }
.spread-option input { position:absolute; opacity:0; }
.spread-option:hover,.spread-option.selected { border-color:rgba(214,172,80,.56); background:rgba(214,172,80,.08); transform:translateY(-2px); }
.spread-count { width:43px; height:43px; display:grid; place-items:center; border:1px solid rgba(214,172,80,.45); border-radius:50%; color:var(--gold-light); font:700 22px var(--display); }
.spread-option strong,.spread-option small { display:block; }
.spread-option small { margin-top:4px; color:var(--muted); font-size:10px; line-height:1.45; }
.tarot-question { padding:2px 5px; }
.tarot-question label small { color:#7d7588; }
.tarot-question textarea { width:100%; min-height:105px; resize:vertical; padding:15px; border:1px solid rgba(214,172,80,.2); border-radius:13px; color:var(--cream); background:#100c22; outline:0; font:400 14px/1.6 var(--font); }
.tarot-question textarea:focus { border-color:var(--gold); box-shadow:0 0 0 3px rgba(214,172,80,.08); }
.tarot-question .btn { width:100%; margin-top:10px; border:0; }
.tarot-workspace { margin-top:28px; padding:25px; border:1px solid rgba(214,172,80,.2); border-radius:24px; background:rgba(10,7,23,.9); }
.tarot-workspace[hidden],.tarot-reading[hidden],.hand-camera[hidden],.hand-pointer[hidden] { display:none; }
.deck-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:23px; }
.deck-toolbar h3 { margin:5px 0; font-size:23px; }
.deck-toolbar h3 b { color:var(--gold-light); }
.deck-toolbar p { margin:0; color:var(--muted); font-size:11px; }
.deck-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.tarot-mode-button { padding:9px 13px; border:1px solid rgba(214,172,80,.2); border-radius:10px; color:#aaa2b5; background:rgba(255,255,255,.03); font:500 11px var(--font); cursor:pointer; }
.tarot-mode-button:hover,.tarot-mode-button.active { color:var(--gold-light); border-color:rgba(214,172,80,.5); background:rgba(214,172,80,.08); }
.hand-camera { display:grid; grid-template-columns:minmax(240px,.7fr) 1.3fr; align-items:center; gap:24px; margin-bottom:24px; padding:16px; border:1px solid rgba(113,185,150,.25); border-radius:18px; background:rgba(70,133,105,.06); }
.tracking-status-panel { min-height:96px; display:flex; align-items:center; gap:16px; padding:18px; border:1px solid rgba(139,214,169,.2); border-radius:14px; background:radial-gradient(circle at 14% 50%,rgba(118,225,164,.1),transparent 34%),rgba(3,12,12,.4); }
.tracking-status-panel video,.tracking-status-panel canvas { display:none !important; visibility:hidden !important; width:0 !important; height:0 !important; }
.tracking-status-panel > div { display:flex; flex-direction:column; gap:4px; }
.tracking-status-panel strong { color:#d5f4e1; font-size:13px; }
.tracking-pulse { flex:0 0 36px; width:36px; height:36px; border:1px solid #7de0a6; border-radius:50%; background:rgba(125,224,166,.12); box-shadow:0 0 0 0 rgba(125,224,166,.32); animation:tracking-pulse 1.8s ease-out infinite; }
.camera-status { color:#8fc4a6; font-size:10px; }
@keyframes tracking-pulse { 70%{box-shadow:0 0 0 14px rgba(125,224,166,0)} 100%{box-shadow:0 0 0 0 rgba(125,224,166,0)} }
.hand-guide strong { color:#ccebd8; }
.hand-guide p { color:var(--muted); font-size:11px; }
.hand-guide button { padding:7px 12px; border:1px solid rgba(255,255,255,.15); border-radius:8px; color:#bbb3c5; background:transparent; cursor:pointer; }
.hand-pointer { position:fixed; z-index:9999; left:0; top:0; width:30px; height:30px; border:2px solid #ffe092; border-radius:50%; background:rgba(214,172,80,.23); box-shadow:0 0 24px #e7bd55; pointer-events:none; transform:translate(-50%,-50%); }
.hand-pointer.pinching { transform:translate(-50%,-50%) scale(.62); background:rgba(125,236,171,.5); border-color:#a9ffd0; }
.tarot-deck { display:grid; grid-template-columns:repeat(13,minmax(42px,1fr)); gap:8px; perspective:1200px; }
.deck-card { position:relative; aspect-ratio:5/8; padding:0; border:1px solid rgba(214,172,80,.33); border-radius:7px; background:#0b1024 url("../img/card-back.png") center/cover no-repeat; box-shadow:0 7px 14px rgba(0,0,0,.25); cursor:pointer; transition:transform .18s ease,box-shadow .18s,border-color .18s; }
.deck-card:hover { z-index:2; transform:translateY(-8px) scale(1.04); border-color:#e3bd61; box-shadow:0 12px 24px rgba(0,0,0,.45),0 0 18px rgba(214,172,80,.18); }
.deck-card.selected { transform:translateY(-10px); border-color:#f4d98d; box-shadow:0 0 0 2px rgba(214,172,80,.24),0 0 28px rgba(214,172,80,.35); }
.deck-card.selected::after { content:attr(data-order); position:absolute; top:-8px; right:-8px; width:25px; height:25px; display:grid; place-items:center; border:2px solid #120c25; border-radius:50%; color:#1a102a; background:var(--gold-light); font:700 11px var(--font); }
.reveal-bar { position:sticky; z-index:5; bottom:12px; display:flex; align-items:center; justify-content:space-between; gap:20px; margin-top:23px; padding:15px 17px; border:1px solid rgba(214,172,80,.3); border-radius:15px; background:rgba(13,9,28,.93); box-shadow:0 16px 50px rgba(0,0,0,.43); backdrop-filter:blur(15px); }
.reveal-bar p { margin:0; color:#aaa2b5; font-size:12px; }
.reveal-bar .btn { border:0; }
.reveal-bar .btn:disabled { opacity:.35; cursor:not-allowed; }
.reveal-bar .btn.counting:disabled { opacity:1; color:#21152d; cursor:wait; animation:countdown-glow 1s ease-in-out infinite; }
@keyframes countdown-glow { 50%{box-shadow:0 0 28px rgba(240,207,122,.42);transform:translateY(-2px)} }
.tarot-reading { margin-top:40px; scroll-margin-top:100px; }
.reading-heading { max-width:760px; margin:0 auto 30px; text-align:center; }
.reading-heading > p { color:#a89fb4; }
.tarot-result-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:20px; }
.tarot-result-grid.celtic { position:relative; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); grid-template-rows:repeat(4,auto); align-items:start; }
.tarot-result-grid.celtic .reading-card:nth-child(1) { grid-column:3; grid-row:3; }
.tarot-result-grid.celtic .reading-card:nth-child(2) { grid-column:4; grid-row:3; }
.tarot-result-grid.celtic .reading-card:nth-child(3) { grid-column:3; grid-row:4; }
.tarot-result-grid.celtic .reading-card:nth-child(4) { grid-column:2; grid-row:3; }
.tarot-result-grid.celtic .reading-card:nth-child(5) { grid-column:3; grid-row:2; }
.tarot-result-grid.celtic .reading-card:nth-child(6) { grid-column:5; grid-row:3; }
.tarot-result-grid.celtic .reading-card:nth-child(7) { grid-column:6; grid-row:4; }
.tarot-result-grid.celtic .reading-card:nth-child(8) { grid-column:6; grid-row:3; }
.tarot-result-grid.celtic .reading-card:nth-child(9) { grid-column:6; grid-row:2; }
.tarot-result-grid.celtic .reading-card:nth-child(10) { grid-column:6; grid-row:1; }
.reading-card { min-width:0; padding:18px; border:1px solid rgba(214,172,80,.2); border-radius:18px; background:linear-gradient(155deg,rgba(38,25,61,.9),rgba(12,8,26,.97)); opacity:0; transform:translateY(16px); animation:reading-card-in .5s ease forwards; animation-delay:var(--delay); }
.reading-card-visual { position:relative; width:min(100%,230px); aspect-ratio:5/8; margin:0 auto 17px; perspective:1000px; }
.reading-card-inner { position:absolute; inset:0; transform-style:preserve-3d; animation:tarot-flip 1s cubic-bezier(.2,.8,.2,1) both; animation-delay:calc(var(--delay) + .12s); }
.reading-card-face { position:absolute; inset:0; overflow:hidden; border:1px solid rgba(238,203,120,.5); border-radius:12px; backface-visibility:hidden; background:#090818; box-shadow:0 18px 35px rgba(0,0,0,.38); }
.reading-card-back { background:#090818 url("../img/card-back.png") center/cover no-repeat; }
.reading-card-front { transform:rotateY(180deg); }
.reading-card-front img { width:100%; height:100%; object-fit:cover; }
.reading-card-front img.reversed { transform:rotate(180deg); }
.reading-card-position { display:block; color:var(--gold); font-size:10px; letter-spacing:.06em; }
.reading-card h3 { margin:7px 0 3px; color:var(--gold-light); font-size:19px; }
.reading-card .orientation { display:inline-block; margin-bottom:9px; padding:3px 8px; border-radius:100px; color:#bdb4c8; background:rgba(255,255,255,.05); font-size:9px; }
.reading-card p { margin:0; color:#bdb5c7; font-size:12px; line-height:1.65; }
.reading-actions { margin-top:25px; text-align:center; }
.reading-actions .btn-ghost { border-color:rgba(240,207,122,.58); color:#fff1c5; background:rgba(25,17,43,.92); box-shadow:0 8px 24px rgba(0,0,0,.24); }
.reading-actions .btn-ghost:hover,.reading-actions .btn-ghost:focus-visible { border-color:#f0cf7a; color:#171020; background:#f0cf7a; box-shadow:0 10px 30px rgba(214,172,80,.28); }
.tarot-reading-note { max-width:850px; margin:23px auto 0; padding:16px 20px; border-left:2px solid var(--gold); color:#81798c; background:rgba(214,172,80,.04); font-size:11px; line-height:1.7; }
@keyframes tarot-flip { from{transform:rotateY(0)} to{transform:rotateY(180deg)} }
@keyframes reading-card-in { to{opacity:1;transform:none} }
@media (max-width:1000px) {
    .tarot-heading { grid-template-columns:1fr; gap:20px; }
    .tarot-privacy { max-width:560px; }
    .tarot-setup { grid-template-columns:1fr; }
    .tarot-deck { grid-template-columns:repeat(10,1fr); }
    .tarot-result-grid.celtic { grid-template-columns:repeat(3,1fr); grid-template-rows:auto; }
    .tarot-result-grid.celtic .reading-card { grid-column:auto !important; grid-row:auto !important; }
}
@media (max-width:700px) {
    .tarot-setup,.tarot-workspace { padding:18px; }
    .spread-picker { grid-template-columns:1fr; }
    .spread-option { min-height:84px; flex-direction:row; text-align:left; justify-content:flex-start; }
    .deck-toolbar,.reveal-bar { align-items:flex-start; flex-direction:column; }
    .deck-actions { justify-content:flex-start; }
    .hand-camera { grid-template-columns:1fr; }
    .tarot-deck { grid-template-columns:repeat(6,1fr); gap:7px; }
    .reveal-bar .btn { width:100%; }
    .tarot-result-grid.celtic { grid-template-columns:1fr 1fr; }
}
@media (prefers-reduced-motion:reduce) {
    .deck-card,.spread-option,.reading-card,.reading-card-inner { animation:none; transition:none; opacity:1; transform:none; }
    .reading-card-front { transform:none; }
    .reading-card-back { display:none; }
}