/* style.css - Minimalist Horizontal Brand Page Stylesheet */

:root {
  /* Color Palette - Blue/Purple to Yellow Text */
  --purple-start: #4A0E70;
  --purple-end: #1F0038;
  --yellow-text: #FFE600;
  
  /* Fonts - Configured with Poppins (Geometric) and Khand (Condensed) fallbacks */
  --font-brand: 'Poppins', 'Khand', sans-serif;
  --font-sans: 'Plus Jakarta Sans', sans-serif;
}

/* Base Reset & Core Layout */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html, body {
  width: 100%;
  height: 100%;
  overflow: hidden;
  
  /* Deep purple-blue vertical gradient matching the reference profile */
  background: linear-gradient(180deg, var(--purple-start) 0%, var(--purple-end) 100%);
  
  font-family: var(--font-sans);
  color: var(--yellow-text);
  user-select: none;
  -webkit-font-smoothing: antialiased;
}

/* Foreground Main Content */
.main-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
}

.logo-container {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
}

/* Brand Title "BACKUS" (Normal Horizontal Layout in Poppins/Khand) */
.brand-title {
  font-family: var(--font-brand);
  font-size: 14vw; /* Scaled with width since text is normal horizontal layout */
  font-weight: 900;
  line-height: 1;
  color: var(--yellow-text);
  letter-spacing: -0.04em;
  text-transform: uppercase;
}

/* Desktop and Tablet Adjustments */
@media (min-width: 768px) {
  .brand-title {
    font-size: 11vw;
  }
}

/* Large Desktop Scaling */
@media (min-width: 1400px) {
  .brand-title {
    font-size: 10vw;
  }
}

/* Portrait Mobile Devices */
@media (max-width: 480px) {
  .brand-title {
    font-size: 16vw;
  }
}