/* Lenormand geschiedenis | OnlineTarot.nl | eigen componenten: lg- */
.lg-page{padding-bottom:52px;color:#c5cbd8}
.lg-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin:28px 0 0;font:12px 'Lora',serif;color:#919cb3}
.lg-breadcrumb a{color:#b8c3d7;text-decoration:none}.lg-breadcrumb a:hover{color:#e4ca87}
.lg-hero{max-width:800px;margin:42px auto 45px;text-align:center}
.lg-eyebrow,.lg-kicker{font:500 11px/1.7 'Lora',serif;letter-spacing:2px;text-transform:uppercase;color:#c3aa72}
.lg-hero h1{font:500 clamp(36px,5vw,54px)/1.12 'Cormorant Garamond',serif;color:#ececf0;margin:12px 0 18px}
.lg-lead{font:15px/1.95 'Lora',serif;color:#bfc6d5;margin:0 auto;max-width:740px}
.lg-hero-line{width:70px;height:1px;background:#c2a56e;margin:28px auto 0}
.lg-layout{display:grid;grid-template-columns:minmax(0,1fr) 275px;gap:27px;align-items:start}
.lg-article{min-width:0}.lg-section{padding:30px 32px;margin-bottom:18px;border:1px solid #29364e;border-radius:10px;background:#0c1528}
.lg-section h2,.lg-aside-card h2,.lg-bottom-cta h2{font:500 clamp(26px,3vw,34px)/1.2 'Cormorant Garamond',serif;color:#e8e8ed;margin:10px 0 16px}
.lg-section p,.lg-aside-card p,.lg-bottom-cta p{font:14px/1.95 'Lora',serif;color:#c2cad8;margin:0 0 15px}
.lg-section p:last-child{margin-bottom:0}.lg-section strong{color:#e6d3a8;font-weight:600}
.lg-note{display:flex;gap:13px;padding:18px;margin-top:20px;background:#111f36;border-left:2px solid #c9a96e;border-radius:5px}
.lg-note>span{color:#d3b878;font-size:22px}.lg-note p{margin:0}
.lg-timeline{padding:0;margin:24px 0 0;list-style:none}
.lg-timeline li{display:grid;grid-template-columns:90px minmax(0,1fr);gap:15px;position:relative;padding:0 0 24px}
.lg-timeline li:not(:last-child):before{content:'';position:absolute;top:22px;bottom:0;left:100px;width:1px;background:#34435b}
.lg-date{font:600 12px/1.8 'Lora',serif;color:#d9bf84}
.lg-timeline li>div{position:relative;padding-left:18px}
.lg-timeline li>div:before{content:'';position:absolute;left:-9px;top:8px;width:8px;height:8px;border:1px solid #c9a96e;border-radius:50%;background:#0c1528}
.lg-timeline h3{font:500 21px/1.2 'Cormorant Garamond',serif;color:#e5e7ee;margin:0 0 5px}
.lg-timeline p{margin:0}
.lg-faq details{border-top:1px solid #2b3a53;padding:15px 0}.lg-faq details:last-child{border-bottom:1px solid #2b3a53}
.lg-faq summary{cursor:pointer;color:#e3e5ed;font:500 14px/1.6 'Lora',serif}.lg-faq details p{margin:12px 0 0}
.lg-aside{display:grid;gap:18px;position:sticky;top:22px}
.lg-aside-card{padding:26px 23px;background:#101b30;border:1px solid #31415c;border-radius:10px}
.lg-aside-card h2{font-size:26px}.lg-aside-link{display:flex;justify-content:space-between;gap:8px;align-items:center;text-decoration:none;color:#e4ca87;font:600 12px/1.6 'Lora',serif;border-top:1px solid #354158;padding-top:15px;margin-top:19px}
.lg-aside-link:hover{color:#fff0c7}
.lg-bottom-cta{text-align:center;padding:38px 24px;margin-top:25px;background:#101b30;border:1px solid #34425c;border-radius:10px}
.lg-bottom-cta p{max-width:580px;margin:0 auto 22px}
.lg-button{display:inline-flex;align-items:center;gap:20px;padding:13px 22px;border-radius:7px;background:linear-gradient(135deg,#e4ca87,#b9954d);color:#101727;text-decoration:none;font:700 13px/1.5 'Lora',serif;transition:filter .2s ease,transform .2s ease}
.lg-button:hover{filter:brightness(1.08);transform:translateY(-1px)}
@media(max-width:800px){.lg-layout{grid-template-columns:1fr}.lg-aside{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.lg-hero{margin:32px auto}}
@media(max-width:560px){.lg-section{padding:24px 19px}.lg-aside{grid-template-columns:1fr}.lg-timeline li{grid-template-columns:75px minmax(0,1fr);gap:12px}.lg-timeline li:not(:last-child):before{left:85px}.lg-hero h1{font-size:38px}.lg-lead{font-size:14px}}
@media(prefers-reduced-motion:reduce){.lg-button{transition:none}}
