/* Canoptek — static build. No preprocessor, no build step. */
body { margin:0; background:#0b0b0c; -webkit-font-smoothing:antialiased; overflow-x:hidden; }
  img, svg { max-width:100%; }
  a { color:#d4af37; text-decoration:none; }
  a:hover { color:#e6c458; }
  @keyframes cnvMarq { to { transform: translateX(-50%); } }
  @keyframes cnvFlow {
    0%   { transform: scale(1.12) translate3d(0,0,0); }
    50%  { transform: scale(1.2) translate3d(-2.2%,-1.4%,0); }
    100% { transform: scale(1.12) translate3d(0,0,0); }
  }
  @keyframes cnvGlow { 0%,100% { opacity:0.62; } 50% { opacity:0.9; } }
  @keyframes cnvFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-9px); } }
  @keyframes cnvRotCW { to { transform:rotate(360deg); } }
  @keyframes cnvRotCCW { to { transform:rotate(-360deg); } }
  @keyframes cnvDash { to { stroke-dashoffset:-400; } }
  @keyframes cnvBreathe { 0%,100% { opacity:0.28; transform:scale(1); } 50% { opacity:0.72; transform:scale(1.045); } }
  @keyframes cnvGlitch {
    0%,90%,100% { text-shadow:none; transform:translateX(0); }
    91% { text-shadow:-3px 0 rgba(212,175,55,0.9), 3px 0 rgba(255,255,255,0.45); transform:translateX(1px); }
    93% { text-shadow:4px 0 rgba(212,175,55,0.7), -4px 0 rgba(255,255,255,0.3); transform:translateX(-2px); }
    95% { text-shadow:-2px 0 rgba(232,200,98,0.8), 2px 0 rgba(255,255,255,0.25); transform:translateX(1px); }
    96% { text-shadow:none; transform:translateX(0); }
  }
  @keyframes cnvArc { 0% { background-position: 120% 0; } 100% { background-position: -120% 0; } }
  @keyframes cnvJolt {
    0%,86%,100% { transform: translate(0,0) skewX(0deg); }
    87% { transform: translate(-2px,1px) skewX(-1.6deg); }
    89% { transform: translate(2px,-1px) skewX(1.3deg); }
    91% { transform: translate(-1px,0) skewX(-0.6deg); }
    93% { transform: translate(1px,1px) skewX(0.4deg); }
  }
  @keyframes cnvCharge {
    0%,100% { filter: drop-shadow(0 0 6px rgba(212,175,55,0.22)); }
    50% { filter: drop-shadow(0 0 18px rgba(232,200,98,0.45)); }
  }
  @keyframes cnvFlicker { 0%,100% { opacity:0.055; } 47% { opacity:0.055; } 48% { opacity:0.11; } 49% { opacity:0.04; } 50% { opacity:0.09; } 51% { opacity:0.055; } }
  @keyframes cnvScanDrift { to { transform:translateY(6px); } }
  @keyframes cnvBlink { 0%,45% { opacity:1; } 50%,95% { opacity:0.15; } 100% { opacity:1; } }
  @keyframes cnvGlowPulse { 0%,100% { box-shadow:0 0 0 rgba(212,175,55,0); } 50% { box-shadow:0 0 26px rgba(212,175,55,0.28); } }
  @keyframes cnvTag { 0%,100% { border-color:#34343a; color:#c8c8c6; box-shadow:none; } 50% { border-color:#d4af37; color:#ffffff; box-shadow:0 0 18px rgba(212,175,55,0.16) inset; } }
  @keyframes cnvNode { 0%,100% { opacity:0.25; } 50% { opacity:1; } }
  @keyframes cnvSlide { 0% { transform:translateX(-6%); } 100% { transform:translateX(6%); } }
  @media (prefers-reduced-motion: reduce) { * { animation:none !important; transition:none !important; } }

  [data-panel] { display:none; }
  [data-acc][data-open="1"] [data-panel] { display:block; }
  [data-acc][data-open="1"] [data-plus] { transform:rotate(45deg); }
  [data-acc][data-open="1"] [data-num] { color:#d4af37; }

  @media (min-width: 481px) {
    [data-r="band"] { padding:76px 22px !important; }
    [data-r="hero"] { padding:96px 22px 0 !important; }
    [data-r="h1"] { font-size:44px !important; }
    [data-r="h2"] { font-size:32px !important; }
    [data-r="accT"] { font-size:24px !important; }
    [data-r="ghost"] { font-size:64px !important; }
  }

  @media (min-width: 1000px) {
    [data-r="navlinks"] { display:flex !important; }
    [data-r="burger"] { display:none !important; }
    [data-drawer], [data-scrim] { display:none !important; }
  }

  @media (min-width: 768px) {
    [data-r="nav"] { padding:20px 44px !important; }
    [data-r="navlogo"] { width:42px !important; height:42px !important; }
    [data-r="navword"] { font-size:24px !important; letter-spacing:0.22em !important; }
    [data-r="band"] { padding:104px 44px !important; }
    [data-r="hero"] { padding:132px 44px 0 !important; }
    [data-r="h1"] { font-size:72px !important; }
    [data-r="h2"] { font-size:44px !important; }
    [data-r="lede"] { font-size:23px !important; }
    [data-r="body"] { font-size:21px !important; }
    [data-r="accT"] { font-size:31px !important; }
    [data-r="accRow"] { padding:32px 0 !important; }
    [data-r="accBody"] { padding-left:66px !important; }
    [data-r="ghost"] { font-size:88px !important; }
    [data-r="ctarow"] { flex-direction:row !important; align-items:center !important; }
    [data-r="cta"] { width:auto !important; }
    [data-r="rail"] { grid-template-columns:150px 1fr !important; }
    [data-r="specrow"] { grid-template-columns:220px 1fr !important; align-items:baseline !important; }
    [data-r="man"] { grid-template-columns:repeat(2,1fr) !important; column-gap:56px !important; }
    [data-r="foot"] { flex-direction:row !important; align-items:center !important; justify-content:space-between !important; }
    [data-r="email"] { font-size:40px !important; }
  }

  @media (min-width: 1120px) {
    [data-r="nav"] { padding:22px 72px !important; }
    [data-r="band"] { padding:128px 72px !important; }
    [data-r="hero"] { padding:160px 72px 0 !important; }
    [data-r="h1"] { font-size:104px !important; }
    [data-r="h2"] { font-size:56px !important; }
    [data-r="accT"] { font-size:36px !important; }
    [data-r="ghost"] { font-size:120px !important; }
    [data-r="rail"] { grid-template-columns:210px 1fr !important; }
    [data-r="man"] { grid-template-columns:repeat(3,1fr) !important; }
    [data-r="email"] { font-size:56px !important; }
  }

/* --- interactive state (was React/DC state) --- */
[data-drawer] { transform: translateX(101%); }
[data-drawer].is-open { transform: translateX(0); }
[data-scrim] { opacity: 0; pointer-events: none; }
[data-scrim].is-open { opacity: 1; pointer-events: auto; }

/* touch targets */
[data-act] { -webkit-tap-highlight-color: transparent; }
[data-acc] { touch-action: manipulation; }

@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1 !important; transform: none !important; }
}

/* --- hover states (were inline style-hover) --- */
[data-hv="hv1"]:hover { color:#f2f2f0; }
[data-hv="hv2"]:hover { color:#e8c862; border-color:#d4af37; }
[data-hv="hv3"]:hover { background:#e8c862; color:#0b0b0c; }
[data-hv="hv4"]:hover { color:#d4af37; }
[data-hv="hv5"]:hover { color:#3d3216; }