
/* =========================================================
   RSB Scooter — Standalone Styles (no WordPress dependency)
   File: /public/www/css/rsb-scooter.css
   ======================================================= */

/* === COLORS === */
:root{
  --rsb-primary:#f29422;
  --rsb-dark:#000000;
  --rsb-light:#ffffff;
  --rsb-text:#111111;
  --rsb-muted:#6b7280;
  --rsb-border:#e5e7eb;
  --rsb-border-dark:#222222;
}

/* === TYPOGRAPHY === */
html,body{margin:0;padding:0}
body{
  font-family:'Open Sans', Arial, Helvetica, sans-serif;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{font-family:'Passion One', 'Ubuntu', system-ui, sans-serif; margin:0.4em 0;}
a{color:var(--rsb-primary); text-decoration:none}
a:hover{opacity:.9}

/* === LAYOUT === */
.grid{max-width:1200px;margin:0 auto;padding:0 16px;}
.row{width:100%}
.text-center{text-align:center}

/* === HEADER === */
.site-header{
  position:sticky; top:0; z-index:1000;
  background:rgba(0,0,0,0.55);
  backdrop-filter:saturate(140%) blur(6px);
}
.site-header .banner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 0}
.logo-link{display:flex;align-items:center;gap:12px;color:var(--rsb-light);}
.menu-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:16px}
.menu-link{color:var(--rsb-light);font-weight:600}
.menu-link.--active{color:var(--rsb-primary)}
.hamburger{display:none}
@media (max-width: 820px){
  .menu-list{display:none}
  .hamburger{display:inline-flex; width:36px; height:24px; position:relative; cursor:pointer}
  .hamburger span, .hamburger::before, .hamburger::after{
    content:""; position:absolute; left:0; right:0; height:3px; background:var(--rsb-light); border-radius:2px;
  }
  .hamburger span{top:50%; transform:translateY(-50%);}
  .hamburger::before{top:0}
  .hamburger::after{bottom:0}
  .menu-open .menu-list{display:flex; flex-direction:column; background:rgba(0,0,0,.92); position:absolute; left:0; right:0; top:60px; padding:12px 16px;}
}

/* === HERO SECTION === */
.hero{min-height:70vh; display:flex; align-items:center; background-position:center; background-size:cover; position:relative}
.hero .overlay{background:rgba(0,0,0,.55); padding:40px; border-radius:8px; color:var(--rsb-light)}
.hero .badge{display:inline-block; padding:6px 10px; border-radius:4px; border:1px solid rgba(255,255,255,.25); color:#fff; font-weight:700; margin-bottom:10px}
.hero .h1{font-size:42px; text-shadow:3px 3px 3px #000}
.hero .h2{font-size:22px}
@media (max-width: 820px){
  .hero .h1{font-size:34px}
  .hero .h2{font-size:18px}
}

/* === SIDEBAR PRICES === */
.layout{display:grid; grid-template-columns:320px 1fr; gap:24px;}
@media (max-width: 900px){ .layout{grid-template-columns:1fr} }
.sidebar{position:relative}
.prices{background:rgba(255,255,255,.08); border:1px solid var(--rsb-border-dark); border-radius:10px; padding:14px}
.prices .customer-type{display:flex; align-items:center; justify-content:space-between; padding:10px 0; border-bottom:1px solid rgba(255,255,255,.12)}
.prices .customer-type:last-child{border-bottom:none}
.prices h3{margin:0; font-size:18px; color:var(--rsb-light)}
.prices .subtitle{margin:0; font-size:13px; color:#dddddd}
.prices .customer-type-price{margin:0; font-weight:800; color:var(--rsb-primary)}

/* === CONTENT (Quick Details) === */
.quick-details{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px}
.quick-details .details{display:flex; align-items:center; gap:8px; padding:10px; border:1px solid rgba(255,255,255,.2); border-radius:6px; background:rgba(255,255,255,.08); color:var(--rsb-light)}
.quick-details .label{font-weight:700; margin-right:6px}

/* === FOOTER === */
.site-footer{border-top:1px solid var(--rsb-border-dark); background:var(--rsb-dark); color:var(--rsb-light); text-align:center; padding:20px 10px}
.site-footer a{color:var(--rsb-light)}

/* === LIGHT THEME HELPERS === */
.light body{background:var(--rsb-light); color:var(--rsb-text)}
.light .site-header{background:#ffffffcc; backdrop-filter:saturate(140%) blur(6px)}
.light .menu-link{color:var(--rsb-text)}
.light .hero .overlay{background:rgba(255,255,255,.75); color:#000}
.light .prices{background:#fff; border:1px solid var(--rsb-border)}
.light .prices .customer-type{border-bottom:1px solid var(--rsb-border)}
.light .prices h3{color:#000}
.light .subtitle{color:#555}
.light .quick-details .details{border:1px solid var(--rsb-border); background:#fff; color:#111}
.light .site-footer{background:#f9f9f9; color:#222; border-top:1px solid #eee}
