/* Sticks x Bricks - static export */
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
  body { margin:0; background:#101114; -webkit-font-smoothing:antialiased; }
  a { color:#F2F1ED; text-decoration:none; } a:hover { color:#F0A32B; }
  @keyframes marquee { from { transform:translateX(0); } to { transform:translateX(-50%); } }
  @keyframes fadeUp { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
  @keyframes drift1 { 0%,100% { transform:translate(0,0); opacity:0.4; } 50% { transform:translate(7px,-26px); opacity:1; } }
  @keyframes drift2 { 0%,100% { transform:translate(0,0); opacity:0.3; } 50% { transform:translate(-9px,20px); opacity:0.85; } }
  @keyframes drift3 { 0%,100% { transform:translate(0,0); opacity:0.35; } 33% { transform:translate(12px,-12px); opacity:0.9; } 66% { transform:translate(-8px,14px); opacity:0.6; } }

/* hover states */
.btn-hot { transition: background 0.18s ease, color 0.18s ease; }
.btn-hot:hover { background:#F0A32B !important; color:#16181D !important; }
.card-hover { transition: background 0.18s ease; }
.card-hover:hover { background:#15171C !important; }
.link-hot { transition: color 0.18s ease; }
.link-hot:hover { color:#F0A32B !important; }

/* anchor offset under sticky header */
section[id] { scroll-margin-top: 84px; }

/* responsive */
html, body { overflow-x:hidden; }

@media (max-width: 860px) {
  header nav a:not(.btn-hot) { display:none !important; }
  header nav a.btn-hot { padding:7px 11px !important; font-size:11px !important; white-space:nowrap; }
  header nav { gap:10px !important; }
  header > div { padding:11px 26px !important; }
  header span[style*="font-size:26px"], header span[style*="font-size: 26px"] { font-size:16px !important; }
  header div[style*="grid-template-columns:11px 11px"], header div[style*="grid-template-columns: 11px 11px"] { transform:scale(0.78); transform-origin:left center; }
  header a[style*="gap:12px"], header a[style*="gap: 12px"] { gap:6px !important; }

  h1 { font-size:13vw !important; }
  h2 { font-size:10vw !important; }
  section, footer { padding-left:10px !important; padding-right:10px !important; }
  section { padding-top:80px !important; padding-bottom:80px !important; }

  div[style*="grid-template-columns:repeat(3, 1fr)"], div[style*="grid-template-columns: repeat(3, 1fr)"] { grid-template-columns:1fr !important; }
  div[style*="grid-template-columns:repeat(4, 1fr)"], div[style*="grid-template-columns: repeat(4, 1fr)"] { grid-template-columns:1fr !important; gap:28px !important; }
  div[style*="grid-template-columns:1fr 1.1fr"], div[style*="grid-template-columns: 1fr 1.1fr"] { grid-template-columns:1fr !important; gap:32px !important; }
  div[style*="grid-template-columns:1.1fr 1fr"], div[style*="grid-template-columns: 1.1fr 1fr"] { grid-template-columns:1fr !important; gap:36px !important; }
  div[style*="grid-template-columns:80px 1fr 1.6fr"], div[style*="grid-template-columns: 80px 1fr 1.6fr"] { grid-template-columns:1fr !important; gap:8px !important; }
  div[style*="grid-template-columns:1.6fr 1fr 1fr"], div[style*="grid-template-columns: 1.6fr 1fr 1fr"] { grid-template-columns:1fr !important; gap:36px !important; }
  div[style*="padding-top:52px"], div[style*="padding-top: 52px"] { padding-top:0 !important; }


  footer div[style*="grid-template-columns:1.6fr 1fr 1fr"], footer div[style*="grid-template-columns: 1.6fr 1fr 1fr"] { grid-template-columns:1fr !important; gap:32px !important; }
  footer div[style*="justify-content:space-between"], footer div[style*="justify-content: space-between"] { flex-wrap:wrap; gap:8px !important; }
  a[style*="font-size:34px"], a[style*="font-size: 34px"] { font-size:7.2vw !important; }

  /* comparison table (class-based, reliable) */
  .cmp-row { grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1.05fr) !important; }
  .cmp-section { padding-left:4px !important; padding-right:4px !important; }
  .cmp-head { font-size:8.5px !important; letter-spacing:0.02em !important; line-height:1.5 !important; padding:12px 2px !important; overflow:hidden; }
  .cmp-label { font-size:11px !important; line-height:1.4 !important; padding:11px 3px 11px 8px !important; }
  .cmp-cell { padding:12px 2px !important; }
  .cmp-legend > span > span { width:7px !important; height:7px !important; }
  .cmp-legend { font-size:8px !important; letter-spacing:0.02em !important; gap:10px !important; padding:10px 8px !important; flex-wrap:wrap; }

  /* header (class-based) */
  .brand-link { gap:7px !important; }
  .brand-word { font-size:17px !important; }
  .brand-icon { transform:scale(0.8); transform-origin:left center; }
  .cta-btn, header nav a.btn-hot { padding:7px 11px !important; font-size:11px !important; white-space:nowrap !important; }
  .contact-grid { grid-template-columns:1fr !important; gap:36px !important; }
}