/* ==========================================================
   ONLINE TAROT - TAROTDECK DETAILPAGINA
   Afzonderlijke td-detail-namespace: geen impact op andere pagina's
   ========================================================== */
.td-detail-page { padding-bottom: 55px; }
.td-detail-breadcrumb { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin:25px 0 30px; color:#9da9bf; font-size:12px; }
.td-detail-breadcrumb a { color:#c7b681; text-decoration:none; }
.td-detail-breadcrumb a:hover { color:#ead49b; text-decoration:underline; }
.td-detail-breadcrumb [aria-current] { color:#d7dce7; }
.td-detail-hero { max-width:790px; margin:42px auto 45px; text-align:center; }
.td-detail-eyebrow { display:block; color:#c7ad71; font-size:11px; letter-spacing:2.2px; text-transform:uppercase; font-weight:600; line-height:1.7; }
.td-detail-hero h1 { margin:12px 0 16px; font-family:'Cormorant Garamond',serif; font-weight:500; font-size:clamp(38px,5.5vw,60px); line-height:1.1; color:#f0edf0; }
.td-detail-lead { max-width:730px; margin:0 auto; color:#bfc8d8; line-height:1.95; font-size:15px; }
.td-detail-ornament { display:flex; justify-content:center; align-items:center; gap:16px; margin-top:25px; color:#c4a76c; font-size:23px; }
.td-detail-ornament::before,.td-detail-ornament::after { content:""; width:70px; height:1px; background:linear-gradient(90deg,transparent,#8e7952); }
.td-detail-ornament::after { transform:rotate(180deg); }
.td-detail-layout { display:grid; grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr); align-items:start; gap:35px; margin:0 auto 48px; }
.td-detail-visual { padding:20px; background:linear-gradient(145deg,#111e35,#0b1326); border:1px solid #36465d; border-radius:13px; text-align:center; }
.td-detail-visual img { display:block; width:100%; max-width:410px; height:auto; max-height:550px; object-fit:contain; margin:0 auto; border-radius:7px; }
.td-detail-image-fallback { display:flex; min-height:390px; align-items:center; justify-content:center; flex-direction:column; gap:22px; padding:25px; background:radial-gradient(circle at 50% 35%,#24334e,#0a1224 75%); border:1px solid #6c5c40; border-radius:8px; }
.td-detail-image-fallback span { font-size:80px; color:#c3a970; }
.td-detail-image-fallback strong { font-family:'Cormorant Garamond',serif; font-size:32px; font-weight:500; color:#eee5cf; }
.td-detail-image-caption { margin:15px 0 0; color:#aeb8c9; font-size:12px; font-style:italic; }
.td-detail-content { display:grid; gap:22px; }
.td-detail-panel,.td-detail-note { padding:30px; background:linear-gradient(150deg,#121f37,#0b1427); border:1px solid #34445d; border-radius:12px; }
.td-detail-panel h2,.td-detail-note h2,.td-detail-next h2 { margin:7px 0 15px; font-family:'Cormorant Garamond',serif; font-weight:500; font-size:clamp(28px,3.5vw,36px); color:#e7e7ee; }
.td-detail-panel p,.td-detail-note p,.td-detail-next p { color:#bac4d4; font-size:14px; line-height:1.9; margin:0 0 15px; }
.td-detail-facts { margin:20px 0 0; }
.td-detail-facts div { display:grid; grid-template-columns:minmax(0,0.85fr) minmax(0,1.15fr); gap:12px; padding:13px 0; border-top:1px solid #33425a; }
.td-detail-facts dt { color:#a8b5c9; font-size:13px; }
.td-detail-facts dd { margin:0; color:#e7e3da; font-size:13px; font-weight:600; overflow-wrap:anywhere; }
.td-detail-note { border-color:#65573f; background:linear-gradient(140deg,#1b2334,#10192a); }
.td-detail-next { padding:34px 28px; text-align:center; border:1px solid #3b4a62; border-radius:13px; background:linear-gradient(130deg,#131f36,#0b1428); }
.td-detail-next p { max-width:630px; margin:0 auto 22px; }
.td-detail-actions { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:18px; }
.td-detail-button { display:inline-flex; align-items:center; justify-content:center; gap:13px; min-height:48px; padding:12px 22px; color:#101727!important; background:linear-gradient(135deg,#e4ca87,#b9954d); border:1px solid #e4ca87; border-radius:7px; text-decoration:none!important; font-weight:700; font-size:13px; transition:filter .2s ease,transform .2s ease; }
.td-detail-button:hover { filter:brightness(1.08); transform:translateY(-2px); }
.td-detail-textlink { color:#d8c28e; text-decoration:none; font-size:13px; }
.td-detail-textlink:hover { text-decoration:underline; }
@media(max-width:760px) { .td-detail-layout { grid-template-columns:1fr; gap:20px; } .td-detail-hero { margin:28px auto 30px; } .td-detail-visual img { max-height:450px; } .td-detail-panel,.td-detail-note { padding:23px; } }
@media(max-width:420px) { .td-detail-facts div { grid-template-columns:1fr; gap:4px; } .td-detail-breadcrumb { gap:6px; } .td-detail-next { padding:27px 17px; } .td-detail-actions { flex-direction:column; } }