
/* Gingeslos.it.com — styles */
:root{--bg:#1a1d2e;--text:#f0f2f5;--muted:#b8c5d1;--brand:#4a9eff;--accent:#ff6b35;--card:#252b3d;--link:#64b5f6}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font:16px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;background:var(--bg);color:var(--text)}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
img{max-width:100%;height:auto;display:block}
header,footer,nav,main,section,article,aside{display:block}
.container{max-width:1100px;margin:0 auto;padding:16px}
.topbar{background:#2a2f42;color:#e3f2fd;font-size:14px}
.topbar .container{display:flex;gap:16px;justify-content:space-between;align-items:center}
.btn{display:inline-block;padding:10px 16px;border-radius:12px;background:var(--brand);color:#ffffff;font-weight:600;border:0;cursor:pointer}
.btn-outline{background:transparent;border:2px solid var(--brand);color:var(--text)}
.hero{background:linear-gradient(180deg,#2a2f42,transparent),url('../img/hero.webp') center/cover no-repeat;border-bottom:1px solid #3a4154}
.hero-inner{display:grid;gap:18px;grid-template-columns:1.1fr 0.9fr;align-items:center}
.hero h1{font-size:38px;margin:0}
.hero p{color:var(--muted)}
.card{background:var(--card);border:1px solid #3a4154;border-radius:20px;padding:18px}
.grid{display:grid;gap:16px}
.grid-3{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
nav ul{list-style:none;margin:0;padding:0;display:flex;gap:14px;flex-wrap:wrap}
nav a{padding:8px 10px;border-radius:10px}
nav a.active, nav a:focus, nav a:hover{background:#3a4154}
footer{border-top:1px solid #3a4154;background:#1a1d2e;color:#b8c5d1}
footer .cols{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.badge{display:inline-block;padding:4px 10px;border-radius:999px;background:#3a4154;color:#e3f2fd;font-size:12px}
.notice{background:#2a2f42;border-left:4px solid var(--accent);padding:12px;border-radius:8px}
.breadcrumbs{font-size:14px;color:var(--muted);margin-top:4px}
table{width:100%;border-collapse:collapse}
th,td{border:1px solid #3a4154;padding:10px}
/* Cookie banner */
.cookie-banner{position:fixed;left:0;right:0;bottom:0;background:#1a1d2ecc;border-top:1px solid #3a4154;backdrop-filter:blur(8px);padding:12px;z-index:9999}
.cookie-banner .actions{display:flex;gap:8px;margin-top:8px;flex-wrap:wrap}
.hidden{display:none!important}
.logo{display:flex;align-items:center;gap:10px}
.logo img{border-radius:10px}
/* Accessibility */
.skip-link{position:absolute;left:-9999px;top:auto}
.skip-link:focus{left:8px;top:8px;background:#000;color:#fff;padding:8px;border-radius:8px;z-index:10000}
/* No horizontal scrolling except tables */
body{overflow-x:hidden}
.table-scroll{overflow-x:auto}
/* Form styles */
label{display:block;margin-bottom:8px;font-weight:500;color:var(--text)}
input,textarea{width:100%;padding:12px;border:1px solid #3a4154;border-radius:8px;background:var(--card);color:var(--text);font-size:16px;margin-bottom:16px}
input:focus,textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 2px rgba(74,158,255,0.2)}
/* Screen reader only */
.sr-only{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
/* Details/Summary styles */
details{margin:16px 0;border:1px solid #3a4154;border-radius:8px;background:var(--card)}
summary{padding:12px;cursor:pointer;font-weight:500;background:#2a2f42;border-radius:8px 8px 0 0}
details[open] summary{border-radius:8px 8px 0 0}
details p{padding:12px;margin:0}
