/* Reset */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{min-height:100vh;background:#FFF8DC;color:#1A1A1A;font-family:Arial,Helvetica,sans-serif;line-height:1.6;font-size:16px}
/* CSS Variables */
:root{
  --color-gold:#D4AF37;--color-deep-red:#8B0000;--color-dark-gray:#2F2F2F;
  --color-bright-yellow:#FFD700;--color-bg-light:#FFF8DC;--color-bg-dark:#1A1A1A;
  --color-text-light:#F5F5F5;--color-text-dark:#1A1A1A;
  --font-heading:Georgia,'Times New Roman',serif;--font-body:Arial,Helvetica,sans-serif;
  --header-width:240px;--content-max:980px;--transition:0.3s ease
}
/* Focus */
:focus-visible{outline:2px solid var(--color-gold);outline-offset:2px}
/* Skip Link */
.skip-link{position:absolute;top:-100%;left:0;background:var(--color-gold);color:#1A1A1A;padding:0.5rem 1rem;z-index:9999;transition:top 0.3s}
.skip-link:focus{top:0}
/* Header (Sidebar) */
.header{position:fixed;top:0;left:0;width:var(--header-width);height:100vh;background:var(--color-bg-dark);color:var(--color-text-light);z-index:1000;display:flex;flex-direction:column;padding:1.5rem 1rem;transition:transform var(--transition)}
.header__inner{display:flex;flex-direction:column;height:100%}
.header__brand{font-family:var(--font-heading);font-size:1.5rem;font-weight:700;color:var(--color-gold);margin-bottom:0.5rem;line-height:1.2}
.header__version{font-size:0.85rem;color:var(--color-gold);opacity:0.8;margin-bottom:0.25rem}
.header__trust{font-size:0.75rem;color:var(--color-bright-yellow);margin-bottom:1.5rem}
.nav{margin-top:1rem;flex:1}
.nav__list{list-style:none}
.nav__item{margin-bottom:0.5rem}
.nav__link{display:block;color:var(--color-text-light);text-decoration:none;padding:0.5rem 0.75rem;border-radius:4px;transition:background var(--transition),color var(--transition)}
.nav__link:hover,.nav__link:focus{background:var(--color-deep-red);color:var(--color-gold)}
.nav__link[aria-current="page"]{background:var(--color-gold);color:var(--color-text-dark);font-weight:700}
/* Nav Toggle (mobile) */
.nav-toggle{display:none;background:none;border:none;cursor:pointer;padding:0.5rem;position:absolute;top:1rem;right:1rem;z-index:1100}
.nav-toggle__bar{display:block;width:24px;height:2px;background:var(--color-gold);margin:5px 0;transition:transform var(--transition)}
/* Footer */
.footer{background:var(--color-bg-dark);color:var(--color-text-light);padding:2rem 1rem;text-align:center}
.footer__inner{max-width:var(--content-max);margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;gap:1rem 2rem}
.footer__section{font-size:0.9rem;line-height:1.8}
.footer__copyright{color:var(--color-gold)}
.footer__icp{color:var(--color-bright-yellow);opacity:0.7}
.footer__contact{color:var(--color-bright-yellow)}
.footer__links a{color:var(--color-gold);text-decoration:none;margin:0 0.5rem;transition:color var(--transition)}
.footer__links a:hover{color:var(--color-bright-yellow)}
/* Generic Components */
.btn{display:inline-block;padding:0.6rem 1.4rem;border:1px solid var(--color-gold);background:transparent;color:var(--color-gold);text-decoration:none;border-radius:0;cursor:pointer;transition:all var(--transition);font-family:var(--font-body)}
.btn:hover,.btn:focus{background:var(--color-gold);color:var(--color-text-dark)}
.btn--primary{background:var(--color-gold);color:var(--color-text-dark);border-color:var(--color-gold)}
.btn--primary:hover{background:var(--color-bright-yellow);border-color:var(--color-bright-yellow)}
.breadcrumb{padding:0.75rem 0;font-size:0.9rem;color:var(--color-dark-gray)}
.breadcrumb a{color:var(--color-deep-red);text-decoration:none}
.breadcrumb a:hover{text-decoration:underline}
.breadcrumb span:not(:first-child)::before{content:"/";margin:0 0.5rem;color:var(--color-dark-gray)}
.page-container{max-width:var(--content-max);margin:0 auto;padding:2rem 1rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:2rem}
.card{background:#fff;border:1px solid var(--color-gold);padding:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.08)}
.card:hover{box-shadow:0 4px 16px rgba(0,0,0,0.12)}
.section{margin-bottom:2.5rem;border-top:1px solid var(--color-gold);padding-top:2rem}
/* Back to Top */
.back-to-top{position:fixed;bottom:2rem;right:2rem;width:48px;height:48px;background:var(--color-deep-red);color:var(--color-gold);border:none;border-radius:50%;font-size:1.5rem;cursor:pointer;opacity:0;visibility:hidden;transition:opacity var(--transition),visibility var(--transition);z-index:999;display:flex;align-items:center;justify-content:center}
.back-to-top.visible{opacity:1;visibility:visible}
/* Reduced motion */
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto}
}
/* Responsive: mobile breakpoint < 768px */
@media(max-width:767px){
  body{padding-left:0}
  .header{width:100%;height:auto;transform:translateX(-100%);position:fixed;top:0;left:0;z-index:1000}
  .header[data-open]{transform:translateX(0)}
  .nav-toggle{display:block}
  .nav__list{margin-top:1rem}
  .footer__section{width:100%}
}
/* Tablet & up >768px */
@media(min-width:768px){
  body{padding-left:var(--header-width)}
  .header{transform:none!important}
  .nav-toggle{display:none}
}
