/* Feature promotion only: uses the approved LottoLuma colours and icons. */
html,body{min-width:0}
:root{--lf-ink:#18384d;--lf-muted:#506b7d;--lf-paper:#fff;--lf-tint:#f2f8fb;--lf-line:#d3e3ec;--lf-accent:#246da2;--lf-soft:#e6f3f8}
html[data-theme=dark]{--lf-ink:#e7f3fb;--lf-muted:#b1c8d7;--lf-paper:#112738;--lf-tint:#142f42;--lf-line:#345366;--lf-accent:#8bd7f6;--lf-soft:#17384c}
.lf-showcase,.lf-tour-hero,.lf-fair-note{color:var(--lf-ink);line-height:1.65;overflow-wrap:anywhere}
.lf-showcase *,.lf-tour-hero *,.lf-fair-note *{box-sizing:border-box}
.lf-showcase{margin:64px 0;padding:clamp(22px,3.1vw,42px);border:1px solid var(--lf-line);border-radius:26px;background:var(--lf-paper);scroll-margin-top:110px}
.lf-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:28px}.lf-heading>div{max-width:770px}
.lf-kicker{display:block;color:var(--lf-accent);font-size:11px;letter-spacing:.16em;font-weight:850;margin-bottom:13px}
.lf-showcase h2,.lf-showcase h3,.lf-tour-hero h1{color:var(--lf-ink);-webkit-text-fill-color:var(--lf-ink);background:none;letter-spacing:-.035em;line-height:1.22;margin:0}
.lf-showcase h2{font-size:clamp(27px,3.1vw,41px)}.lf-showcase h3{font-size:22px}.lf-heading p,.lf-tour-hero>p{color:var(--lf-muted);font-size:15px;line-height:1.8;margin:14px 0 0}
.lf-tour-link{display:inline-flex;align-items:center;gap:18px;flex-shrink:0;color:var(--lf-accent);font-size:13px;font-weight:800;text-decoration:none;border-bottom:1px solid var(--lf-line);padding:0 0 6px}
.lf-examples{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;scroll-margin-top:110px}
.lf-export{min-width:0;border:1px solid var(--lf-line);background:var(--lf-paper);border-radius:18px;overflow:hidden;scroll-margin-top:110px}
.lf-export-label{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:17px 22px;border-bottom:1px solid var(--lf-line);font-size:9px;letter-spacing:.085em;font-weight:850;color:var(--lf-accent)}
.lf-export-label span:last-child{color:var(--lf-muted);text-align:right}
.lf-stage{height:290px;display:flex;align-items:center;justify-content:center;padding:28px;background:radial-gradient(ellipse at 25% 0%,#d5edf9,transparent 80%),#eaf3f7;overflow:hidden;text-decoration:none}
html[data-theme=dark] .lf-stage{background:radial-gradient(ellipse at 25% 0%,#24546d,transparent 80%),#122e41}
.lf-stage-card img{display:block;width:100%;height:auto;max-height:100%;object-fit:contain;border-radius:12px;box-shadow:0 15px 26px #193e5729}
.lf-stage-paper{gap:24px;background:radial-gradient(ellipse at 0% 0%,#e3f1ef,transparent 75%),#edf3f5}
.lf-paper{display:block;height:244px;flex:none;aspect-ratio:516/730;box-shadow:0 10px 25px #193e5730;border-radius:2px;overflow:hidden;transform:rotate(-2deg)}
.lf-paper img{width:100%;height:100%;display:block;object-fit:contain}
.lf-paper-detail{display:flex;flex-direction:column;gap:11px;font-size:11px;line-height:1.6;color:var(--lf-muted)}.lf-paper-detail strong{color:var(--lf-ink);font-size:24px;line-height:1.3;letter-spacing:-.03em}
.lf-export-copy{padding:26px}.lf-export-copy>p{font-size:13px;color:var(--lf-muted);line-height:1.85;margin:13px 0 18px;min-height:73px}
.lf-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 24px}.lf-tags span{font-size:10px;font-weight:750;color:var(--lf-accent);background:var(--lf-soft);padding:5px 9px;border-radius:6px}
.lf-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px 22px}.lf-button{display:inline-flex;align-items:center;justify-content:center;gap:15px;min-height:45px;border:1px solid #246da2;border-radius:9px;background:#246da2;color:#fff!important;-webkit-text-fill-color:#fff;font-family:inherit;font-size:12px;line-height:1.5;font-weight:750;text-decoration:none!important;padding:12px 16px}
.lf-text-link{display:inline-flex;align-items:center;gap:12px;color:var(--lf-accent);font-size:12px;font-weight:750;text-decoration:none;border-bottom:1px solid var(--lf-line);padding:4px 0}
.lf-example-note{color:var(--lf-muted);font-size:11px;line-height:1.8;margin:15px 0 0;max-width:100ch}
.lf-mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:30px;border:1px solid var(--lf-line);border-radius:13px;overflow:hidden;background:var(--lf-tint)}
.lf-mini-grid>a{display:flex;align-items:center;gap:13px;min-width:0;padding:22px 18px;color:var(--lf-ink);text-decoration:none;border-right:1px solid var(--lf-line);border-bottom:1px solid var(--lf-line)}
.lf-mini-grid>a:nth-child(3n){border-right:0}.lf-mini-grid>a:nth-child(n+4){border-bottom:0}.lf-mini-grid img{width:31px;height:31px;flex:none}.lf-mini-grid>a>span:first-of-type{min-width:0}.lf-mini-grid strong{font-size:12px;display:block;font-weight:800;line-height:1.45}.lf-mini-grid small{font-size:10px;color:var(--lf-muted);display:block;margin-top:5px;line-height:1.6}.lf-mini-grid>a>span:last-child{color:var(--lf-accent);margin-left:auto;font-size:15px}
.lf-bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;margin-top:22px;font-size:11px;color:var(--lf-muted)}.lf-bottom>a{font-size:12px;font-weight:800;text-decoration:none;color:var(--lf-accent)}
.lf-showcase a:hover,.lf-fair-note a:hover,.lf-tour-hero a:hover{text-decoration:underline;text-underline-offset:4px}.lf-button:hover{background:#1c5c8b}.lf-mini-grid>a:hover{background:var(--lf-soft)}
.lf-showcase :is(a,summary):focus-visible,.lf-tour-hero a:focus-visible,.lf-fair-note a:focus-visible{outline:3px solid var(--lf-accent);outline-offset:4px}
.lf-tour-main{padding-bottom:36px}.lf-tour-hero{padding:44px 0 10px;max-width:950px}.lf-tour-hero h1{font-size:clamp(35px,4.7vw,60px);font-weight:850}.lf-tour-hero>p{max-width:70ch;font-size:16px;margin:22px 0}.lf-tour-hero .lf-actions{margin-top:28px}.lf-hero-facts{display:flex;flex-wrap:wrap;gap:15px 30px;font-size:10px;letter-spacing:.09em;font-weight:800;color:var(--lf-muted);margin:30px 0 4px}
.lf-tour-exports{margin-top:36px}.lf-all-example{margin-top:28px;border:1px solid var(--lf-line);border-radius:12px;background:var(--lf-tint)}.lf-all-example summary{cursor:pointer;padding:18px 22px;color:var(--lf-ink);font-size:13px;font-weight:800}.lf-all-example summary span{float:right;color:var(--lf-accent)}
.lf-all-layout{padding:0 24px 24px;display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:32px;align-items:center}.lf-all-layout img{display:block;width:100%;height:auto;border-radius:10px}.lf-all-layout h3{font-size:25px}.lf-all-layout p{color:var(--lf-muted);font-size:14px;line-height:1.85;margin:16px 0}
.lf-three-steps{list-style:none;padding:0;margin:28px 0 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.lf-three-steps li{display:flex;gap:13px;align-items:flex-start}.lf-three-steps li>span{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;color:var(--lf-accent);background:var(--lf-soft);font-size:12px;font-weight:850;flex:none}.lf-three-steps strong{display:block;font-size:12px}.lf-three-steps small{display:block;font-size:11px;line-height:1.8;color:var(--lf-muted);margin-top:5px}
.lf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.lf-feature{display:flex;align-items:flex-start;flex-direction:column;min-width:0;background:var(--lf-tint);border:1px solid var(--lf-line);border-radius:14px;padding:25px}.lf-feature>img{margin-bottom:22px}.lf-feature h3{font-size:19px;line-height:1.35;letter-spacing:-.02em}.lf-feature p{font-size:12px;line-height:1.9;color:var(--lf-muted);margin:13px 0 20px}.lf-feature>a{margin-top:auto;font-size:12px;font-weight:800;color:var(--lf-accent);text-decoration:none}.lf-subheading{font-size:25px!important;margin:42px 0 24px!important;scroll-margin-top:110px}
.lf-fair-note{padding:26px 30px;border:1px solid var(--lf-line);border-left:4px solid var(--lf-accent);background:var(--lf-tint);border-radius:0 16px 16px 0}.lf-fair-note>strong{font-size:18px}.lf-fair-note p{font-size:13px;color:var(--lf-muted);margin:12px 0;line-height:1.85}.lf-fair-note a{font-size:12px;font-weight:750;color:var(--lf-accent)}
@media(max-width:1100px){.lf-stage{height:260px;padding:22px}.lf-paper{height:220px}.lf-paper-detail{gap:8px}.lf-paper-detail strong{font-size:20px}.lf-export-copy{padding:22px}.lf-mini-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.lf-mini-grid>a:nth-child(3n){border-right:1px solid var(--lf-line)}.lf-mini-grid>a:nth-child(2n){border-right:0}.lf-mini-grid>a:nth-child(n+4){border-bottom:1px solid var(--lf-line)}.lf-mini-grid>a:nth-child(n+5){border-bottom:0}.lf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.lf-showcase{margin:40px 0;padding:22px 18px;border-radius:20px}.lf-heading{align-items:flex-start;flex-direction:column;gap:16px}.lf-heading p{font-size:13px}.lf-examples{grid-template-columns:1fr;gap:20px}.lf-export-copy>p{min-height:0}.lf-stage{height:270px}.lf-stage-card{height:auto;min-height:180px;padding:24px 18px}.lf-stage-card img{max-height:none}.lf-stage-paper{gap:24px}.lf-paper{height:235px}.lf-paper-detail strong{font-size:23px}.lf-export-label{padding:15px 18px;font-size:8px}.lf-export-copy{padding:23px 20px}.lf-actions{gap:13px 18px}.lf-example-note{font-size:10px}.lf-three-steps{grid-template-columns:1fr;gap:18px}.lf-all-layout{grid-template-columns:1fr;gap:24px;padding:0 18px 22px}.lf-all-layout>a{max-width:330px;margin:auto}.lf-all-layout h3{font-size:23px}.lf-tour-hero{padding:32px 0 8px}.lf-tour-hero>p{font-size:14px}.lf-hero-facts{gap:12px 20px}.lf-fair-note{padding:23px}.lf-grid{gap:14px}.lf-feature{padding:21px}.lf-feature h3{font-size:17px}}
@media(max-width:520px){.lf-mini-grid,.lf-grid{grid-template-columns:1fr}.lf-mini-grid>a{border-right:0!important;border-bottom:1px solid var(--lf-line)!important;padding:18px}.lf-mini-grid>a:last-child{border-bottom:0!important}.lf-mini-grid strong{font-size:13px}.lf-mini-grid small{font-size:11px}.lf-paper{height:220px}.lf-stage-paper{gap:18px}.lf-paper-detail strong{font-size:21px}.lf-paper-detail{font-size:9px}.lf-showcase h2{font-size:27px}.lf-export-copy h3{font-size:22px}.lf-export-copy>p{font-size:12px}.lf-bottom{align-items:flex-start;flex-direction:column}.lf-all-example summary{font-size:12px;padding:17px}.lf-tour-hero h1{font-size:36px}.lf-feature{padding:24px}.lf-feature h3{font-size:20px}.lf-feature p{font-size:13px}}

@media(max-width:380px){.lf-stage-paper{height:230px;gap:12px;padding:18px 12px}.lf-paper{height:180px}.lf-paper-detail strong{font-size:18px}.lf-paper-detail{font-size:8px}}