/* Tirage de tarot gratuit */
.tarot{max-width:980px;margin:0 auto 34px;padding:22px 18px 26px;border:1px solid var(--ligne);border-radius:20px;background:radial-gradient(600px 300px at 50% 0,rgba(138,106,216,.18),transparent 70%),var(--nuit2);scroll-margin-top:84px}
.t-nojs{margin:0;color:var(--texte2)}
.t-form{display:grid;gap:18px}
.t-choix{border:0;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:10px}
.t-choix legend{font:600 .78rem/1.4 var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--or);margin:0 0 10px;padding:0}
.t-choix label{position:relative;display:block;cursor:pointer}
.t-choix input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.t-choix label>span{display:flex;flex-direction:column;gap:2px;min-height:58px;justify-content:center;padding:10px 14px;border:1px solid var(--ligne2);border-radius:12px;background:var(--panneau);transition:border-color .15s,background .15s}
.t-choix small{color:var(--texte2);font-size:.82rem}
.t-choix input:checked+span{border-color:var(--or);background:var(--or-fond);box-shadow:inset 0 0 0 1px var(--or)}
.t-choix input:focus-visible+span{outline:2px solid var(--or-clair);outline-offset:2px}
.t-dom{grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr))}
.t-dom label>span{min-height:48px}
.t-champ label{display:block;font-weight:600;margin:0 0 6px}
.t-champ label span{font-weight:400;color:var(--texte2);font-size:.88rem}
.t-champ input{width:100%;min-height:48px;padding:10px 14px;border-radius:12px;border:1px solid var(--ligne2);background:var(--nuit);color:var(--texte);font:inherit}
.t-champ input:focus{outline:2px solid var(--or-clair);outline-offset:1px;border-color:var(--or)}
.t-btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:12px 26px;border:0;border-radius:14px;background:linear-gradient(180deg,var(--or-clair),var(--or));color:#1a1200;font:700 1.02rem var(--sans);cursor:pointer;box-shadow:0 10px 26px -12px rgba(227,176,75,.7)}
.t-btn:hover{filter:brightness(1.06)}
.t-go{justify-self:center;min-width:min(100%,300px)}
.t-lien{background:none;border:0;color:var(--or-clair);text-decoration:underline;font:inherit;cursor:pointer;min-height:44px;padding:8px 10px}

/* tête du tirage */
.t-tete{text-align:center;scroll-margin-top:90px}
.t-tete .sur{margin-bottom:4px}
.t-q{font:italic 1.15rem/1.4 var(--serif);color:#fff;margin:4px auto 6px;max-width:40ch;overflow-wrap:anywhere}
.t-consigne{min-height:1.6em;margin:6px 0 14px;color:var(--texte2)}

/* emplacements */
.t-slots{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin:6px 0 22px}
.t-slot{width:clamp(84px,24vw,150px);text-align:center}
.t-lib{margin:8px 0 0;font-size:.76rem;line-height:1.3;color:var(--texte2);letter-spacing:.02em}
.t-carte{position:relative;aspect-ratio:7/12;perspective:900px}
.t-vide{position:absolute;inset:0;border:1.5px dashed var(--ligne);border-radius:10px;background:rgba(255,255,255,.02)}
.t-in{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.3,.7,.2,1)}
.t-f{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:10px;box-shadow:0 14px 28px -14px #000}
.t-f svg,.t-dos svg,.t-mini svg{display:block;width:100%;height:100%}
.t-f-face{transform:rotateY(180deg)}
.t-retourne .t-in{transform:rotateY(180deg)}
.t-pose{animation:t-pose .45s ease-out}
@keyframes t-pose{from{transform:translateY(24px) scale(.9);opacity:0}to{transform:none;opacity:1}}

/* croix : gauche, droite, haut, bas, centre */
.t-croix{display:grid;grid-template-columns:repeat(3,clamp(66px,19vw,118px));grid-template-areas:". c3 ." "c1 c5 c2" ". c4 .";gap:10px 12px;justify-content:center}
.t-croix .t-slot{width:auto}
.t-croix .t-slot[data-i="0"]{grid-area:c1}.t-croix .t-slot[data-i="1"]{grid-area:c2}.t-croix .t-slot[data-i="2"]{grid-area:c3}.t-croix .t-slot[data-i="3"]{grid-area:c4}.t-croix .t-slot[data-i="4"]{grid-area:c5}
.t-croix .t-slot[data-i="4"] .t-vide{border-style:dotted;border-color:var(--violet)}

/* jeu étalé : cartes qui se chevauchent */
.t-jeu{--pas:15px;--w:44px;display:grid;grid-template-columns:repeat(auto-fill,var(--pas));grid-auto-rows:62px;padding:8px calc(var(--w) - var(--pas)) 30px 0;margin:0 auto;max-width:900px;justify-content:center}
.t-jeu22{--pas:30px;--w:58px;grid-auto-rows:84px}
.t-dos{width:var(--w);aspect-ratio:7/12;padding:0;border:0;background:none;border-radius:6px;cursor:pointer;transition:transform .18s ease,opacity .3s;position:relative}
.t-dos:hover,.t-dos:focus-visible{transform:translateY(-10px);z-index:2}
.t-dos:focus-visible{outline:2px solid var(--or-clair);outline-offset:2px}
.t-dos.t-pris{opacity:0;transform:translateY(-30px) scale(.8);pointer-events:none}
.t-melange .t-dos{animation:t-mel .8s ease both}
.t-melange .t-dos:nth-child(3n){animation-delay:.08s}.t-melange .t-dos:nth-child(3n+1){animation-delay:.16s}
@keyframes t-mel{0%{transform:translateX(0)}30%{transform:translateX(-14px) rotate(-4deg)}60%{transform:translateX(12px) rotate(3deg)}100%{transform:none}}
@media (min-width:700px){.t-jeu{--pas:20px;--w:58px;grid-auto-rows:78px}.t-jeu22{--pas:38px;--w:74px;grid-auto-rows:104px}}

/* lecture */
.t-lecture{margin:6px 0 10px;scroll-margin-top:90px}
.t-lecture:focus{outline:none}
.t-lecture>h2{text-align:center}
.t-lecture>h2::after{margin-left:auto;margin-right:auto}
.t-item{display:grid;grid-template-columns:clamp(52px,15vw,96px) 1fr;gap:16px;align-items:start;padding:16px;margin:0 0 12px;border:1px solid var(--ligne2);border-radius:16px;background:var(--panneau)}
.t-mini{aspect-ratio:7/12;border-radius:8px;overflow:hidden;box-shadow:0 10px 22px -12px #000}
.t-tx{min-width:0}
.t-tx h3{margin:2px 0 4px;font-size:1.2rem}
.t-tx p{margin:0 0 8px}
.t-pos{font:600 .74rem/1.4 var(--sans)!important;letter-spacing:.12em;text-transform:uppercase;color:var(--or)}
.t-mots{color:var(--texte2);font-size:.88rem}
.t-conseil{color:var(--or-clair)}
.t-note{font-size:.86rem;color:var(--texte2)}
.t-rep{text-align:center;margin:0 0 16px;padding:18px;border-radius:16px;border:1px solid var(--ligne)}
.t-rep-m{font:700 2.2rem/1 var(--titre);margin:0 0 8px;color:var(--or-clair)}
.t-rep-oui{background:rgba(95,212,154,.08);border-color:rgba(95,212,154,.4)}.t-rep-oui .t-rep-m{color:var(--vert)}
.t-rep-non{background:rgba(255,143,143,.07);border-color:rgba(255,143,143,.35)}.t-rep-non .t-rep-m{color:var(--rouge)}
.t-resume{padding:16px 18px;border-left:3px solid var(--or);background:var(--or-fond);border-radius:0 14px 14px 0;margin:4px 0 12px}
.t-resume h3{margin:0 0 6px}
.t-resume p{margin:0}
.t-av{font-size:.84rem;color:var(--discret);margin:10px 0 0}
.t-outils{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;align-items:center;margin:14px 0 0}
.t-cta{margin:22px 0 0;padding:20px 16px;border:1px solid var(--ligne);border-radius:18px;background:var(--panneau);text-align:center}
.t-cta h2{margin-top:0}
.t-cta h2::after{margin-left:auto;margin-right:auto}
.t-cta .fp{margin:0 auto 14px}
.t-cta .appel-lignes{text-align:left}
.t-cta .alerte-w{margin:14px 0 0}

/* sens des arcanes (contenu de la page) */
.t-arcanes{margin:0 0 24px}
.t-arcanes dt{font:600 1.08rem var(--serif);color:#fff;margin:20px 0 6px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.t-arcanes dt span{font:700 .8rem var(--titre);color:var(--or);min-width:3.4em}
.t-arcanes dt small{font:400 .86rem var(--sans);color:var(--texte2)}
.t-arcanes dd{margin:0;padding:0 0 14px;border-bottom:1px solid var(--ligne2)}
.t-arcanes dd p{margin:0 0 6px}
.t-yn{font-size:.9rem;color:var(--texte2)}

@media (prefers-reduced-motion:reduce){.t-in,.t-dos{transition:none}.t-pose,.t-melange .t-dos{animation:none}}
/* mobile : réglages compacts pour tirer sans défiler */
@media (max-width:640px){
  .tarot{padding:16px 12px 20px;border-radius:16px}
  .t-form{gap:14px}
  .t-choix{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .t-dom{grid-template-columns:repeat(3,minmax(0,1fr))}
  .t-choix legend{margin-bottom:8px}
  .t-choix label>span{min-height:52px;padding:8px 10px;font-size:.92rem;line-height:1.25}
  .t-choix small{font-size:.74rem}
  .t-dom label>span{min-height:46px;text-align:center;align-items:center}
  .t-champ input{min-height:46px}
}
