/* ============================================================
   GLOBAL PAGE LAYOUT
   Keep navbar spacing, add left/right padding, preserve margins
   ============================================================ */

/* Restore normal top spacing so content does NOT sit under navbar */
body {
  margin: 0;
  padding-top: 60px !important;     /* adjust to 60–80px if needed */
}

/* Ensure main content does not touch screen edges */
.main-container,
.container {
  padding-left: 30px !important;     /* left/right page buffer */
  padding-right: 30px !important;
  max-width: 1200px;                 /* OPTIONAL: keep content readable */
  margin: 0 auto;                    /* center content */
}

/* ============================================================
   FULL-WIDTH BREAKOUT SECTIONS
   Use class="fullwidth" on elements that should span entire screen
   ============================================================ */

.fullwidth {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background-color: #2C3E50;
  padding: 40px 0;
}



/* If you want to remove Bootstrap container limit *inside* breakout */
.fullwidth > * {
  max-width: none !important;
}

/* ============================================================
   OPTIONAL STYLE ENHANCEMENTS
   ============================================================ */

/* Fix image scaling inside circular profile images */
img.img-circle {
  object-fit: cover;
}

/* Center all h1–h3 by default (optional) */
/*
h1, h2, h3 {
  text-align: center;
}
*/

/* Optional: improve text rendering */
body, p {
  font-smooth: always;
  -webkit-font-smoothing: antialiased;
}