/* ==========================================================================
   1. VARIABLES & RESET
   ========================================================================== */
   @import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

   :root {
    /* Set a larger base for mobile (18px instead of the default 16px) */
    font-size: 112.5%; 
    --content-bg-color: rgba(51, 26, 26, 0.88);
  --border-dark: thin solid #662828;
  --accent-red: #cc0000;
  /* Logo moved to bottom or kept here for global scope */
  --logo128:url(data:image/png;base64,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);
    }

* {
  box-sizing: border-box;
}

html, body {
  height: 100%;
  margin: 0;
  padding: 0;
}

/* ==========================================================================
   2. BASE STYLES
   ========================================================================== */
body {
  font-family: "Montserrat", sans-serif;
  font-size: 1rem; /* 18px based on 112.5% root */
  line-height: 1.6;
  color: #ffffff;
  background-color: #000000;
  background-image: linear-gradient(to bottom, #000000, #484848);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  min-height: 100vh;
}

h2 {
  color: var(--accent-red);
  margin-top: 40px;
  text-shadow: 1px 1px 2px #000000;
}

section {
  margin-bottom: 40px;
}

/* ==========================================================================
   3. LAYOUT COMPONENTS
   ========================================================================== */
.div-page-column {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto 1fr auto;
  min-height: 100vh;
  width: 92vw;
  max-width: 92vw;
  min-width: 92vw;
  margin: 0 auto;
}

header, footer, main {
  z-index: 10;
}

header {
  margin-top: 2em;
  margin-bottom: 1em;
}

main {
  background-color: var(--content-bg-color);
  border: var(--border-dark);
  border-radius: 12px 12px 0 0;
  padding: 2em;
  margin-bottom: 0.5em;
}

footer {
  background-color: var(--content-bg-color);
  border: var(--border-dark);
  border-radius: 0 0 12px 12px;
  padding: 2em;
  margin-bottom: 2em;
  text-align: center;
  font-size: 0.9em;
  color: #887777;
}

/* ==========================================================================
   4. MODULES / COMPONENTS
   ========================================================================== */

   header nav strong { color: #cc0000; }

/* Hero Section */
.hero {
  padding: 0 2em 2em 2em;
  background: #660000;
  background-image: linear-gradient(to bottom, #550000, #780000);
  border: 1px solid #990000;
  border-radius: 8px;
  background-repeat: no-repeat;
}

.hero > h1 {
  margin-top: 0.5em;
}

/* Grid System */
.grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
}

.grid > div {
  border: thin solid #770000;
  padding: 0 1em;
  box-shadow: 0 0 9px #990000;
}

/* Mobile-first Grid Rounding */
.grid > div:nth-child(1) { border-radius: 8px 8px 0 0; }
.grid > div:nth-child(3) { border-radius: 0 0 8px 8px; }

#contact {
  text-align: center;
  margin-bottom: 1em;
}

/* Buttons */
.cta-button {
  display: block;
  width: 30ch;
  margin: 0 auto;
  padding: 15px 25px;
  background: var(--button-red);
  background-image: linear-gradient(to bottom, #990000, #de0000);
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  text-align: center;
  text-shadow: 1px 1px 1px #660000;
  border: 1px solid #cc0000;
  border-radius: 5px;
  cursor: pointer;
}

.cta-button:hover {
  background-image: linear-gradient(to bottom, #aa0000, #de0000);
  color: #ffff66;
}

/* ==========================================================================
   99. LOGO
   ========================================================================== */

.div-logo {
  position: fixed;
  top: 0;
  left: 0;
  width: 17vw;
  min-width: 17vw;
  z-index: 100;
  text-align: center;
}

.logo-large, .logo-small {
  background-image: var(--logo128);
  border: 1px inset #000000;
  border-radius: 50%;
  box-shadow: 0 0 24px #ff0000;
  
}

.logo-large {
  display: none;
  width: 129px;
  height: 128px;
  margin:6em auto 0 auto;
}

.logo-small {
  display: block;
  width: 90px;
  height: 90px;
  background-size: 90px 90px;
  margin: 0 auto 0.5em auto;
  position: relative;
  top:-0.5em;
}

/* ==========================================================================
   5. ANIMATIONS
   ========================================================================== */

 #canvas-hero {
     position:fixed;
      display: block;
      width: 100vw;
      height: 100vh;
      background: linear-gradient(#000000, #330000);
      z-index: 1;
      top: 0;
}
.hr-nav {
  border: none;
  height: 1px;
  background-color: #cc0000;
  margin-left: 0;
  width: 0;
  animation: expandLine 2s ease-out 1s forwards;
}

.nav-text {
  opacity: 0;
  animation: navFadeIn 2s ease-out 1s forwards;
}

@keyframes expandLine {
  from { width: 0; }
  to { width: 100%; }
}

@keyframes navFadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

/* ==========================================================================
   6. RESPONSIVE BREAKPOINTS
   ========================================================================== */

/* Tablets */
@media (min-width: 768px) {
  :root {
    font-size: 125%; /* 20px base */
  }
}

/* Laptops & Desktop */
@media (min-width: 1024px) {
  :root {
    font-size: 100%; /* 16px base */
  }

  .div-page-column {
    width: 66vw;
    max-width: 66vw;
    min-width: 66vw;
  }

  nav{margin-top: 5.6em;}

  .logo-large {
    display: block;
    width: 90px;
    height: 90px;
    margin:7em auto 0 auto;
    background-size: 90px 90px;
  }

  .logo-small{
      display:none;
  }

}

/* :::::::::: [ !!  SMALL LAPTOP ONLY... ] ::::::::::::*/
@media (min-width: 1200px) {

  .logo-large {
    width: 129px;
    height: 128px;
    margin:6em auto 0 auto;
    background-size: 129px 128px;
  }

  .grid {
    grid-template-columns: repeat(3, 1fr);
  }

  /* Desktop Grid Rounding */
  .grid > div:nth-child(1) { border-radius: 8px 0 0 8px; }
  .grid > div:nth-child(2) { border-radius: 0; }
  .grid > div:nth-child(3) { border-radius: 0 8px 8px 0; }
}