/* SQL Repair Tool home page: only what Bootstrap 5 cannot do (gradients, icon sizing, hover effects, scroll-snap carousel, details/summary FAQ, star rating, native dialogs).
   Colours, spacing, type, cards, buttons, navbar, tables and forms come from bootstrap.min.css (Sass theme in bs2.scss). */
html{scroll-padding-top:76px}
svg.i{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none;vertical-align:-.2em}
svg.i.fill{fill:currentColor;stroke:none}
.bg-grad{background:linear-gradient(135deg,#2e4766 0%,#36597f 100%)}
.bg-grad-dark{background:linear-gradient(135deg,#243b57 0%,#2e4766 60%,#36597f 100%)}
/* hover effects */
.lift,.hov{transition:transform .2s ease,box-shadow .2s ease,background-color .15s,border-color .15s}
.lift:hover,.card.hov:hover{transform:translateY(-4px);box-shadow:0 10px 24px rgba(30,50,80,.14)!important}
.hov:not(.card):hover{background-color:#e0ecff!important;border-color:#93b4f0!important}
.bg-white.bg-opacity-10.hov:hover{background-color:rgba(255,255,255,.16)!important;border-color:rgba(255,255,255,.16)!important}
.flow-arrow{box-shadow:0 0 0 8px rgba(37,99,235,.25)}
.big-bi{box-shadow:0 0 0 8px rgba(46,71,102,.08)}
@media(max-width:991.98px){.flow-arrow svg{transform:rotate(90deg)}}
/* screenshot carousel (scroll-snap, swipe works natively) */
.car{position:relative;max-width:1000px;margin:0 auto}
.car-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;border:1px solid #e2e8f0;border-top:4px solid #2e4766;border-radius:.75rem;background:#fff;scrollbar-width:thin}
.car-slide{flex:0 0 100%;scroll-snap-align:center;margin:0;padding:20px 20px 22px;text-align:center}
.car-slide img{max-width:100%;max-height:560px;width:auto;border:1px solid #e2e8f0;border-radius:8px}
.car-slide figcaption{margin:14px auto 0;max-width:760px;font-size:16px;color:#0f172a}
.car-btn{position:absolute;top:42%;width:46px;height:46px;border-radius:50%;border:0;background:#2e4766;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 4px 12px rgba(30,50,80,.3);transition:background .15s}
.car-btn:hover{background:#2563eb}
.car-btn .i{width:22px;height:22px;stroke-width:2.4}
.car-btn.prev{left:-18px}.car-btn.prev .i{transform:rotate(90deg)}
.car-btn.next{right:-18px}.car-btn.next .i{transform:rotate(-90deg)}
@media(max-width:1060px){.car-btn.prev{left:6px}.car-btn.next{right:6px}}
.car-dots{display:flex;justify-content:center;flex-wrap:wrap;margin-top:14px}
.car-dots button{position:relative;width:24px;height:24px;border:0;padding:0;background:none;cursor:pointer}
.car-dots button::before{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;background:#c7d8f7;transition:width .2s,margin .2s}
.car-dots button.on::before{background:#2e4766;width:22px;margin-left:-11px}
/* FAQ (native details) */
details.faq{transition:border-color .2s,background-color .2s}
details.faq:hover,details.faq[open]{border-color:#93b4f0!important}
details.faq[open]{background-color:#f5f9ff!important;box-shadow:0 4px 14px rgba(37,99,235,.08)}
details.faq summary{list-style:none;cursor:pointer}
details.faq summary::-webkit-details-marker{display:none}
details.faq .chev{transition:transform .2s ease}
details.faq[open] .chev{transform:rotate(180deg)}
/* review form: star rating */
.rate{display:flex;flex-direction:row-reverse;justify-content:flex-end;gap:4px}
.rate input{position:absolute;opacity:0;pointer-events:none}
.rate label{cursor:pointer;color:#cbd5e1;line-height:1}
.rate label .i{width:30px;height:30px;fill:currentColor;stroke:none}
.rate input:checked~label,.rate label:hover,.rate label:hover~label{color:#f59e0b}
.rate input:focus-visible+label{outline:2px solid #2563eb;border-radius:4px}
/* native dialogs: blog popups + image lightbox */
dialog.dlg{width:min(1000px,94vw);max-height:90vh;padding:0;border:0;border-radius:14px;box-shadow:0 24px 70px rgba(15,23,42,.45);color:#334155}
dialog.dlg::backdrop{background:rgba(15,23,42,.6)}
.dlg-b img{max-width:100%;display:block;margin:10px 0;border:1px solid #e2e8f0;border-radius:6px}
.dlg-b pre{background:#0f172a;color:#e2e8f0;padding:14px;border-radius:8px;overflow:auto;font-size:14px}
dialog.lb{width:auto;max-width:96vw;background:transparent;box-shadow:none;overflow:visible}
dialog.lb img{display:block;max-width:94vw;max-height:88vh;width:auto;height:auto;border-radius:8px;background:#fff}
@media(prefers-reduced-motion:reduce){.lift,.hov,.car-track{transition:none;scroll-behavior:auto}}