@charset "UTF-8";

/* =========================================================
   MARK SULLIVAN PHOTO — GLOBAL STYLES
   Single source of truth
   ========================================================= */

/* ======================
   BASE / TYPOGRAPHY
====================== */

:root{
  --text-main: #1f1f1f;
  --text-muted: rgba(0,0,0,.62);
  --text-hover: rgba(0,0,0,.88);
  --bg: #ffffff;

  --nav-font: "Libre Baskerville", Baskerville, "Times New Roman", serif;
  --body-font: Baskerville, "Palatino Linotype", Palatino,
               "Century Schoolbook L", "Times New Roman", serif;

  --shadow-dropdown: 0 10px 28px rgba(0,0,0,.12);

  /* Titles / meta */
  --title-size: clamp(1.4rem, 2.1vw, 2.15rem);
  --title-line: 1.12;
  --title-mb: 0.35rem;
  --meta-size: clamp(0.82rem, 1.15vw, 0.98rem);
  --meta-letter: 0.08em;
  --meta-mt: 0.10rem;
  --meta-mb: 0.65rem;
}

body{
  background-color: var(--bg);
  font-family: var(--body-font);
  font-weight: 500;
  font-size: large;
  color: var(--text-main);
}

/* Neutralize default link decoration */
a{
  text-decoration: none;
}

/* ======================
   HEADINGS
====================== */

h1{
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: normal;
  font-size: 1.4em;
  color: #1f1f1f;
}

/* ======================
   LAYOUT
====================== */

section{
  background:#fff;
  border-radius: 10px;
  color:#afafb0;
}

.container-fluid{
  text-align:left;
}

/* ======================
   NAVBAR (LOCKED)
====================== */

.navbar{
  background:#fff !important;
  border:none !important;
  box-shadow:none !important;
}

#mainNav.navbar{
  padding:.20rem .65rem;
}

.navbar-brand img{
  height:34px;
  width:auto;
}

.navbar .nav-link{
  font-family:var(--nav-font);
  font-size:1rem;
  font-weight:400;
  letter-spacing:.04em;
  line-height:1.15;
  padding:.22rem .46rem;
  color:var(--text-muted) !important;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus{
  color:var(--text-hover) !important;
}

.navbar .nav-link.active{
  color:rgba(0,0,0,.92) !important;
}

/* Dropdown */
.navbar .dropdown-menu{
  border:none;
  box-shadow:var(--shadow-dropdown);
  padding:.70rem 0;
  min-width:12rem;
  text-align:center;
}

.navbar .dropdown-item{
  font-family:var(--nav-font);
  font-size:1rem;
  font-weight:400;
  letter-spacing:.04em;
  padding:.46rem 1.25rem;
  color:rgba(0,0,0,.68);
}

.navbar .dropdown-item:hover{
  color:rgba(0,0,0,.92);
  background:transparent;
}

/* ======================
   HERO TEXT
====================== */

.hero-text,
.hero-caption{
  text-align:center;
  margin-top:24px;
}

.hero-text h2{
  font-family:Georgia, "Times New Roman", serif;
  font-size:22px;
  letter-spacing:.06em;
  color:#7a7a7a;
}

.hero-text p{
  font-size:15px;
  color:#8a8a8a;
}

/* ======================
   TITLES + META
====================== */

main h1{
  font-size:var(--title-size);
  line-height:var(--title-line);
  margin-top:.35rem;
  margin-bottom:var(--title-mb);
}

main h1 + p,
main .meta{
  font-size:var(--meta-size);
  letter-spacing:var(--meta-letter);
  text-transform:uppercase;
  opacity:.75;
  margin-top:var(--meta-mt);
  margin-bottom:var(--meta-mb);
}

/* ======================
   FOOTER
====================== */

footer{
  font-family:var(--nav-font);
  font-size:small;
  text-align:center;
  color:#afafb0;
  background:#fff;
  padding:24px 12px;
}

/* =========================================================
   FOOTER LINK OVERRIDE — FINAL, ABSOLUTE
   (Kills Bootstrap blue everywhere)
   ========================================================= */

footer a,
footer a:link,
footer a:visited,
footer a:hover,
footer a:focus,
footer a:active,
.footer-bar a,
.footer-bar a:link,
.footer-bar a:visited,
.footer-bar a:hover,
.footer-bar a:focus,
.footer-bar a:active{
  color:#afafb0 !important;
  text-decoration:none !important;
  border-bottom:1px solid rgba(175,175,176,.35);
  outline:none !important;
  box-shadow:none !important;
}

/* Prevent nested elements from turning blue */
footer a *{
  color:inherit !important;
}

/* ======================
   RESPONSIVE
====================== */

@media (max-width:768px){
  :root{
    --meta-mb:.55rem;
    --meta-letter:.07em;
  }
}

@media (max-width:480px){
  :root{
    --meta-mb:.48rem;
    --meta-letter:.065em;
  }
}