// Logo — Holanda Veículos (concessionária VW parceira)
const Logo = ({ height = 40, light = false, variant = "image" }) => {
  if (variant === "image") {
    const img = (
      <img
        src="assets/logo-holanda.png"
        alt="Holanda Veículos · Concessionária Volkswagen"
        style={{ height, width: "auto", display: "block", objectFit: "contain" }}
      />
    );
    if (light) {
      return (
        <div style={{
          display: "inline-flex",
          alignItems: "center",
          background: "#fff",
          padding: "10px 14px",
          borderRadius: 12,
          boxShadow: "0 4px 16px rgba(0,0,0,0.22)",
        }}>{img}</div>
      );
    }
    return <div style={{ display: "inline-flex", alignItems: "center" }}>{img}</div>;
  }

  const color = light ? "#fff" : "#001E50";
  const sub = light ? "rgba(255,255,255,0.72)" : "#43474f";
  return (
    <div style={{ display: "inline-flex", alignItems: "center", gap: 10, height }}>
      <div style={{ display: "flex", flexDirection: "column", justifyContent: "center", lineHeight: 1 }}>
        <span style={{
          fontFamily: "'Barlow Condensed', sans-serif",
          fontSize: Math.round(height * 0.46),
          fontWeight: 900,
          color,
          letterSpacing: "-0.01em"
        }}>HOLANDA</span>
        <span style={{
          fontSize: Math.round(height * 0.2),
          fontWeight: 700,
          color: sub,
          letterSpacing: "0.16em",
          marginTop: 3,
          textTransform: "uppercase",
        }}>Concessionária Volkswagen</span>
      </div>
    </div>
  );
};

Object.assign(window, { Logo });