/* Dark theme (October 2026). Loaded after style.css on every page and only overrides it: removing this file's
   <link> brings the old look back. Warm black with muted coral, sage and sand accents; serif headings. */
:root {
  --bg: #0f0f11;
  --surface: #17171a;
  --surface-2: #1f1f23;
  --border: #2b2b30;
  --text: #e9e7e2;
  --muted: #a5a29a;
  --coral: #e07a5f;
  --coral-soft: rgba(224, 122, 95, 0.14);
  --sage: #8fb996;
  --sand: #e3c27a;
  --serif: "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, "Times New Roman", serif;
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

html, body { background: var(--bg); color: var(--text); font-family: var(--sans); font-size: 16px; line-height: 1.65; }
p, li { color: var(--text); }
.lead { color: var(--muted); font-weight: 400; }
h1, h2, h3, h4, .h2 { color: var(--text); font-family: var(--serif); font-weight: 600; letter-spacing: 0.005em; }
h4 { font-size: 1.35em; margin-top: 0; }
a, a:visited { color: var(--coral); }
a:hover, a:focus { color: var(--sand); text-decoration: none; }
.normallink a { color: var(--coral); }
::selection { background: var(--coral); color: #111; }

/* Navigation */
.navbar, .navbar-default { background: rgba(15, 15, 17, 0.88); border: 0; border-bottom: 1px solid var(--border);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); padding: 6px 0; font-size: 1em; }
.navbar-brand img { border: 2px solid var(--coral); width: 46px; height: 46px; object-fit: cover; }
.navbar-default .navbar-nav li a,
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .active > a { background: transparent !important; color: var(--muted); font-weight: 500;
  letter-spacing: 0.02em; transition: color 0.15s; }
.navbar-default .navbar-nav li a:hover,
.navbar-default .navbar-nav li a:focus,
.navbar-default .navbar-nav li a.active,
.navbar-default .navbar-nav > .open > a:hover { color: var(--text) !important; background: transparent !important; }
.navbar-default .navbar-nav li a.active { box-shadow: inset 0 -2px 0 var(--coral); }
/* blog.html's menu (Bootstrap 4 markup: .nav without .navbar-nav) */
.navbar .nav > li > a { color: var(--muted); font-weight: 500; letter-spacing: 0.02em; padding: 10px 14px; display: block; }
.navbar .nav > li > a:hover, .navbar .nav > li > a.active { color: var(--text); }
.navbar .nav > li > a.active { box-shadow: inset 0 -2px 0 var(--coral); }
.dropdown-menu { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 6px; }
.dropdown-menu > li > a, .navbar-default .navbar-nav .open .dropdown-menu > li > a { color: var(--text) !important;
  border-radius: 6px; padding: 8px 14px; }
.dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover { background: var(--surface-2) !important; color: var(--coral) !important; }
.navbar-toggle { border-color: var(--border) !important; background: transparent !important; }
.navbar-toggle .icon-bar { background: var(--text) !important; }
.navbar-collapse { border-color: var(--border) !important; }
.badge { background: var(--coral); color: #111; font-weight: 600; margin-left: 6px; }

/* Home: hero over the mountain photo, darkened so the text reads */
#home { min-height: 78vh; background-image: linear-gradient(180deg, rgba(15,15,17,0.55) 0%, rgba(15,15,17,0.75) 60%, var(--bg) 100%), url(img/mountains.jpeg); }
.landing-text { display: table-cell; vertical-align: middle; text-align: center; padding: 0 16px; }
.landing-text h1 { color: var(--text); font-size: clamp(2.6rem, 7vw, 5.2rem); padding: 0 0 12px; line-height: 1.1; }
.landing-text h1::after { content: ""; display: block; width: 72px; height: 3px; margin: 22px auto 0; border-radius: 3px;
  background: linear-gradient(90deg, var(--coral), var(--sand), var(--sage)); }
.landing-text h3 { color: var(--muted); font-family: var(--sans); font-weight: 400; font-size: 1.3em; }

/* Sections and images */
.padding { padding: 72px 0; }
.padding + .padding { border-top: 1px solid var(--border); }
.hovereffect { border-radius: 14px; overflow: hidden; background: var(--surface); border: 1px solid var(--border); }
.hovereffect img { border-radius: 14px; }
img.img-responsive { border-radius: 12px; }
.navbar-brand img.img-responsive { border-radius: 50%; }
#fixed { height: 320px; background-image: linear-gradient(rgba(15,15,17,0.6), rgba(15,15,17,0.6)), url(img/background.jpg); }

/* Buttons */
.btn, .btn-primary, .btn-default { background: var(--coral); border: 0; color: #111 !important; font-weight: 600;
  border-radius: 999px; padding: 10px 22px; transition: transform 0.15s, background 0.15s; }
.btn:hover, .btn:focus, .btn-primary:hover { background: var(--sand); color: #111 !important; transform: translateY(-1px); }

/* Footer */
footer { background: var(--surface); border-top: 1px solid var(--border); padding: 40px 16px 32px; color: var(--text); }
footer h3 { color: var(--text); font-size: 1.2em; margin-bottom: 14px; }
footer h4 { font-family: var(--sans); font-size: 1em; font-weight: 400; color: var(--muted); display: block; margin: 8px 0; }
footer h4 .fa { color: var(--coral); width: 1.2em; text-align: center; }
footer a, footer .fa { color: var(--text); }
footer a:hover, footer .fa:hover { color: var(--coral); }
.fa { transition: color 0.15s; }

/* Resume page */
.wrapper { background: var(--surface); border: 1px solid var(--border); border-radius: 16px; overflow: hidden; box-shadow: none; }
.main-wrapper { background: var(--surface); color: var(--text); }
.main-wrapper .section-title { color: var(--coral); font-family: var(--serif); letter-spacing: 0.04em; }
.main-wrapper .section-title .fa, .main-wrapper .section-title .icon-holder { background: var(--coral-soft) !important; color: var(--coral) !important; }
.main-wrapper .job-title { color: var(--text); }
.main-wrapper .time { color: var(--sand); font-size: 0.82em; line-height: 1.8; overflow: visible; }
.main-wrapper .upper-row { overflow: visible; min-height: 1.9em; }
.main-wrapper .company, .main-wrapper .project-title { color: var(--muted); }
.main-wrapper .item + .item { border-top: 1px solid var(--border); padding-top: 22px; }
.sidebar-wrapper { background: var(--surface-2); border-left: 1px solid var(--border); color: var(--text); }
.sidebar-wrapper a { color: var(--text); }
.sidebar-wrapper p, .sidebar-wrapper li, .sidebar-wrapper h5.meta { line-height: 1.6 !important; color: var(--muted); font-size: 14px; font-weight: 400; }
.sidebar-wrapper a:hover { color: var(--coral); }
.sidebar-wrapper .profile-container { background: transparent; }
.sidebar-wrapper .name { color: var(--text); font-family: var(--serif); }
.sidebar-wrapper .tagline, .sidebar-wrapper .tagline a { color: var(--sage); }
.sidebar-wrapper .container-block-title { color: var(--sand); font-family: var(--serif); }
.sidebar-wrapper .profile { border: 3px solid var(--coral); }
.skillset .level-bar { background: var(--border); }
.skillset .level-bar-inner { background: linear-gradient(90deg, var(--coral), var(--sand)); }

/* Blog cards (blog.html uses Bootstrap 4 cards) */
.card { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; color: var(--text);
  transition: transform 0.15s, border-color 0.15s; }
.card:hover { transform: translateY(-2px); border-color: var(--coral); }
.card-title { color: var(--text); font-family: var(--serif); }
.card-text, .card-text li { color: var(--muted); }
.card-text a { color: var(--coral); word-break: break-word; }
.card-footer { background: var(--surface-2); border-top: 1px solid var(--border); color: var(--sage); border-radius: 0 0 14px 14px; }
.blogContainer { background: var(--surface); box-shadow: none; border: 1px solid var(--border); color: var(--text); }
.BlogLabel { background: var(--surface-2); color: var(--sage); border-color: var(--border); }

/* Phones */
@media (max-width: 767px) {
  .padding { padding: 48px 0; }
  .navbar-default .navbar-nav li a.active { box-shadow: none; color: var(--coral) !important; }
  .navbar-collapse { background: var(--bg); }
  .main-wrapper { padding: 28px 20px; }
  #fixed { height: 180px; background-attachment: scroll; }
  #home { background-attachment: scroll; min-height: 64vh; }
}
