/*
    CSS uploaded on 4/4/2025 - bhc
*/

/* RESET RULES */

@import url("https://fonts.googleapis.com/css?family=Montserrat:400,500,600,700");
@import url("https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,400;0,700;0,900;1,400;1,700;1,900&display=swap");

:root {
  --black: #3a3a3a;
  --font-body: "Lato", sans-serif;
  --white: #fff;
  --wts-red: #8c2233;
  --wts-gold: #bd8b41;
  --wts-gray: #56575a;
  --article-text: #020202;
  --link-color: var(--wts-red);
}

* {
  margin: 0;
  padding: 0;
}

body {
  font-family: var(--font-body);
  font-size: 1rem;
}

#sidebar {
  visibility: hidden;
}

#main-content {
  width: 100%;
}

input[type="radio"] {
  position: absolute;
  left: -9999px;
}

ol {
  list-style: none;
}

h1 {
  font-size: 3rem;
  text-align: center;
  margin: 5rem 0rem;
}

h2 {
  color: #8c2233;
}

a {
  text-decoration: none;
  color: inherit;
}

hr {
  margin: 2% 0;
}

img {
  display: block;
  border: 0;
  width: 100%;
  height: auto;
}

/***************************           C@G Landing Page Styling            *******************************/

.catg-header {
  display: block;
  margin: 5rem 0;
  text-align: center;
}

.catg-main-section {
  text-align: center;
}

/* FILTERS */
.filters {
  text-align: center;
  margin-bottom: 2rem;
}

.filters * {
  display: inline-block;
}

.filters label {
  padding: 0.5rem 1rem;
  margin-bottom: 0.25rem;
  border-radius: 2rem;
  min-width: 50px;
  line-height: normal;
  cursor: pointer;
  transition: all 0.1s;
}

.filters label:hover {
  background: var(--#8C2233);
  color: var(--white);
}

/* FILTERED ELEMENTS (POSTS - CARDS) */
.posts {
  display: grid;
  grid-gap: 1.5rem;
  grid-template-columns: repeat(3, 1fr);

  & .post {
    background: #e7e5e2;
    border: 1px rgba(0, 0, 0, 0.1);
  }

  & .post-title {
    padding: 5%;
    height: 10rem;
    font-size: 1rem;
  }
}

.posts .post-title h2 {
  margin-bottom: 0;
}

.posts figcaption {
  padding: 1rem;
}

/* FILTERING RULES */

[value="All"]:checked~.filters [for="All"],
[value="MATS"]:checked~.filters [for="MATS"],
[value="MAC"]:checked~.filters [for="MAC"],
[value="MDIVMAR"]:checked~.filters [for="MDIVMAR"],
[value="JUN"]:checked~.filters [for="JUN"],
[value="SEP"]:checked~.filters [for="SEP"],
[value="SU"]:checked~.filters [for="SU"],
[value="FA"]:checked~.filters [for="FA"],
[value="JAN"]:checked~.filters [for="JAN"],
[value="MAR"]:checked~.filters [for="MAR"],
[value="WI"]:checked~.filters [for="WI"],
[value="SP"]:checked~.filters [for="SP"] {
  background: var(--wts-red);
  color: var(--white);
}

[value="All"]:checked~.posts [data-category] {
  display: block;
}

[value="MATS"]:checked~.posts .post:not([data-category~="MATS"]),
[value="MAC"]:checked~.posts .post:not([data-category~="MAC"]),
[value="MDIVMAR"]:checked~.posts .post:not([data-category~="MDIVMAR"]),
[value="JUN"]:checked~.posts .post:not([data-category~="JUN"]),
[value="SEP"]:checked~.posts .post:not([data-category~="SEP"]),
[value="SU"]:checked~.posts .post:not([data-category~="SU"]),
[value="FA"]:checked~.posts .post:not([data-category~="FA"]),
[value="JAN"]:checked~.posts .post:not([data-category~="JAN"]),
[value="MAR"]:checked~.posts .post:not([data-category~="MAR"]),
[value="WI"]:checked~.posts .post:not([data-category~="WI"]),
[value="SP"]:checked~.posts .post:not([data-category~="SP"]) {
  display: none;
}

/***************************           Course at a Glance Page            *******************************/

.catg-course-header-course-title {
  color: maroon;
  font-weight: 200;
  font-size: 3rem;
}

.catg-course-header-lecturing-faculty {
  color: #000;
  font-weight: 450;
  font-size: 1.3rem;
  margin-top: 0;
}

.catg-course-header-ay {
  font-style: italic;
}

.catg-course-course-h3-subheadings {
  color: maroon;
  font-weight: 450;
  font-size: 1.3rem;
}

.catg-course-books-to-purchase {
  & .book-information {
    margin-left: 5%;
    margin-top: 2%;

    & .book-title {
      margin: 0;
      font-style: italic;
    }

    & div {
      margin: 0;
    }
  }
}

.catg-course-workload-table {
  text-align: center;
  border: 0px;
  border-spacing: 13px;
}

.workload-table-header-row {
  text-align: center;
  font-weight: 400;
  font-size: 1.2rem;

  border: none;
  border: 0px;
}

.workload-table-estimation-row {
  font-size: 3.1rem;
  font-weight: 250;

  & td {
    padding: 3% 0%;
    text-align: center;
    border: 0.75px;
  }

  & td:first-child {
    border-style: none solid none none;
    width: 35%;
  }

  & td:last-child {
    border-style: none none none solid;
    width: 35%;
  }
}

.workload-table-label-row {
  font-size: 1.2rem;
  font-weight: 150;
  text-align: center;
  border-style: none;
}

.catg-course-assignments-table {
  margin-left: 5%;
  border: none;
  border-width: 0px;

  & td,
  tr {
    border: none;
  }

  & tr td:first-child {
    width: 10px;
  }
}

/* FOOTER */
footer {
  font-size: 1rem;
  padding: 0 1.5rem;
  text-align: right;
}

footer span {
  color: #e31b23;
}

/* MQ */
@media screen and (max-width: 900px) {
  .posts {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media screen and (max-width: 600px) {
  html {
    font-size: 14px;
  }

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

/* Home Page Title */

#docsSearch h1 {
  font-size: 32px;
  font-weight: 400;
  text-align: center;
  margin: 0.4em 0;
  font-family: var(--font-body);
  color: #222256;
  padding: 10px;
}

/* Navbar */

.navbar .nav {
  position: relative;
}

.navbar .nav li {
  display: inline-block;
  font-family: var(--font-body);
  font-size: 13px;
  letter-spacing: 0.1em;
}

.navbar .nav li a,
.navbar .icon-private-w {
  font-size: 14px;
  font-weight: 300;
  color: white;
}

/* Header Size */

a.brand>img {
  max-width: 100%;
  vertical-align: middle;
  border: 0;
  height: 60px;
  margin-left: 15px;
  width: auto;
}

.navbar .navbar-inner {
  height: 80px;
  padding: 0;
}

.navbar .navbar-inner .container-fluid {
  padding: 0;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 100%;
  width: 100%;
}

.navbar .brand {
  float: left;
  display: block;
  padding: 0px;
  margin-left: -20px;
  font-size: 20px;
  font-weight: 200;
  color: #777;
  text-shadow: 0 1px 0 #fff;
}

/* Home Page Search Bar Background */

#docsSearch {
  background: #ffffff;
  border-top: 1px solid #dadada;
  margin-bottom: 3em;
  padding: 1.5em 0;
}

/* Search Input Box */

input.search-query {
  padding-right: 14px;
  padding-right: 4px \9;
  padding-left: 14px;
  padding-left: 4px \9;
  margin-bottom: 0;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  font-family: var(--font-body);
  font-weight: 100;
  letter-spacing: 1px;
}

/* Home Page Category Title*/

.category-list h3 {
  color: var(--wts-red);
  font-size: 20px;
  font-weight: 400;
  line-height: 1.3em;
  font-family: var(--font-body);
}

/* Category Styles */

.category-list .category p {
  color: #7e8287;
  font-family: var(--font-body);
  font-weight: 100;
  font-size: 15px;
  letter-spacing: 0.25px;
}

.category-list .category {
  background-color: #fff;
  background-position: top 20px center !important;
  background-repeat: no-repeat !important;
  background-size: 100px auto !important;
  box-shadow: 0 7px 4px -5px rgba(0, 0, 0, 0.05);
  box-sizing: border-box;
  /* min-height: 183px; */
  padding: 20px;
  position: relative;
  width: 31.5%;
  transition: all 0.2s;
}

.category-list .category:hover {
  text-decoration: none;
  background: #f7f7f9;
}

.collection-category h2 {
  font-weight: 500;
  margin: 0 0 20px;
  text-align: center;
  padding-left: 0%;
  font-family: var(--font-body);
  /* text-transform: uppercase; */
  color: #7e8287;
  font-size: 22px;
  letter-spacing: 1px;
}

.collection-category h2 a {
  color: #3db890;
}

.collection-category .category-list {
  margin: 0 0 4em;
  text-align: center;
}

/* Home Page Link Style */

#serp-dd .result a,
#serp-dd .result>li.active,
#full-Article strong a,
.collection a,
.contentWrapper a,
.most-pop-articles .popArticles a,
.most-pop-articles .popArticles a span,
.category-list .category .article-count,
.category-list .category .article-count,
.contentWrapper a {
  font-weight: 500;
  letter-spacing: 0.25px;
  color: var(--wts-gray);
  margin-top: 15px;
  /* text-transform: capitalize; */
  text-decoration: none;
  font-family: var(--font-body);
  font-weight: 500;
}

#serp-dd .result a:hover,
#serp-dd .result>li.active,
#full-Article strong a,
.collection a,
.contentWrapper a,
.most-pop-articles .popArticles a,
.most-pop-articles .popArticles a:hover span,
.category-list .category .article-count,
.category-list .category:hover .article-count,
.contentWrapper a {
  font-weight: 500;
  letter-spacing: 0.25px;
  color: var(--wts-gray);
  margin-top: 15px;
  /* text-transform: capitalize; */
  /* text-decoration: underline; */
  font-family: var(--font-body);
  font-weight: 500;
}

/* Home Page Search Button */

#searchBar button {
  color: #fff;
  /* text-shadow: 0 0px 0px rgba(255, 255, 255, 0); */
  background: var(--wts-red);
  border-radius: 0 5px 5px 0;
  border: 1px solid #b98389;
  font-size: 18px;
  padding: 0 1.5em;
  height: 50px;
  position: absolute;
  border: none;
  top: 32px;
}

#searchBar button:hover {
  background: var(--wts-red);
  /* text-shadow: 0 0px 0px rgba(255, 255, 255, 0); */
  border: none;
}

input,
button,
select,
textarea {
  font-family: var(--font-body), sans-serif;
}

/* Side Bar Styles */

#sidebar .nav-list a {
  display: inline-block;
  color: var(--wts-gray);
  font-size: 16px;
  padding: 6px 15px 6px 0;
  line-height: 20px;
  margin-left: 0;
  font-family: var(--font-body);
  font-weight: 300;
}

#sidebar .nav-list .active a,
#sidebar .nav-list .active a:hover,
#sidebar .nav-list .active a:focus {
  font-weight: 500;
  color: var(--wts-red);
  background: 0 0;
  text-shadow: none;
  text-decoration: underline;
}

#sidebar h3 {
  text-transform: uppercase;
  font-size: 16px;
  color: #7e8287;
  font-weight: 400;
  margin-bottom: 4px;
  font-family: var(--font-body);
  letter-spacing: 2px;
}

/* Article Styles */

#main-content {
  background: none;
  float: right;
  margin-bottom: 2em;
  padding: 32px 0 0 28px;
}

#fullArticle .admin-edit {
  color: white;
}

#fullArticle img {
  display: block;
  margin: 1em 0 2em;
  padding: 4px;
  border-radius: 4px;
  box-sizing: border-box;
}

#fullArticle .title,
.contentWrapper h1 {
  margin: 0 30px 0.5em 0;
  font-family: var(--font-body);
  color: var(--wts-red);
  font-weight: 700;
}

#fullArticle .printArticle {
  position: absolute;
  right: 46px;
  top: 40px;
}

#fullArticle,
#fullArticle p,
#fullArticle ul,
#fullArticle ol,
#fullArticle li,
#fullArticle div,
#fullArticle blockquote,
#fullArticle dd,
#fullArticle table {
  color: var(--article-text);
  font-family: var(--font-body);
  font-size: 16px;
  font-weight: 300;
  letter-spacing: 0.01em;
}

#fullArticle a {
  color: var(--link-color);
}

#categoryHead .sort select {
  width: 150px;
  height: 24px;
  margin: 0;
  line-height: 24px;
  font-size: 13px;
  color: #7e8287;
  font-family: var(--font-body);
  font-weight: 300;
}

/* Style this one if you want bolded article text to have a different color */

#fullArticle strong {
  color: #7e8287;
}

#fullArticle h2 {
  font-size: 24px;
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--wts-red);
}

#fullArticle h3 {
  font-size: 20px;
  font-family: var(--font-body);
  font-weight: 700;
  color: var(--wts-red);
}

#fullArticle h4 {
  font-size: 16px;
  font-family: var(--font-body);
  font-weight: 300;
  color: #7e8287;
  font-style: italic;
}

.contentWrapper p {
  margin-top: -4px;
  word-wrap: break-word;
  font-family: var(--font-body);
  color: #7e8287;
  font-weight: 300;
  font-size: 16px;
  letter-spacing: 0.01em;
}

/* Article Footers */

.articleFoot p,
.articleFoot time {
  color: #7e8287;
  display: inline-block;
  font-family: var(--font-body);
  font-weight: 300;
  font-style: italic;
}

/* Page Footers */

footer p a {
  color: #7e8287;
  font-family: var(--font-body);
  font-weight: 300;
}

/* Contact Modal */

#contactModal h2,
.abuse h2 {
  background: #fff;
  margin: 0;
  padding: 11px 0 10px 18px;
  font-size: 22px;
  border-bottom: 1px solid #ccc;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  font-family: var(--font-body);
  color: #58a4b0;
  font-weight: 300;
}

#contactModal .control-label {
  width: 110px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 300;
  color: #7e8287;
}

.btn {
  color: #fff;
  text-shadow: 0 0px 0px rgba(255, 255, 255, 0);
  background: var(--wts-red);
  border-radius: 5px;
  font-size: 14px;
  padding: 0.5em;
  /* height: 50px; */
}

.btn:hover,
.btn:focus,
.btn:active,
.btn.active,
.btn.disabled,
.btn[disabled] {
  color: #fff;
  text-shadow: 0 0px 0px rgba(255, 255, 255, 0);
  background: var(--wts-red);
  border: 1px solid #9da39a;
}

#search-query .btn:hover {
  color: #fff;
  text-shadow: 0 0px 0px rgba(255, 255, 255, 0);
  background: var(--wts-red);
  border-radius: 5px;
  border: 1px solid #9da39a;
  font-size: 18px;
  padding: 0 1.5em;
  height: 50px;
}

.category-list {
  text-align: center;
}

/* Fix for making homepage category gallery go smoothly from 3 to 2 to 1 column */

@media screen and (max-width: 1105px) {
  section.category-list .category {
    width: 48.2%;
  }
}

@media screen and (max-width: 760px) {
  section.category-list .category {
    box-sizing: border-box;
    margin: 0 0 20px;
    padding: 120px 20px 15px;
    width: 100%;
  }
}

/* RESPONSIVE */

@media (max-width: 768px) {
  .navbar .btn-navbar {
    margin-top: 16px;
    right: -10px;
  }

  .related {
    padding: 30px 25px 25px;
  }

  .related ul {
    margin-left: 0;
  }

  .related h3 {
    padding-left: 0;
  }

  .related ul>li a {
    margin-left: 0;
  }
}

@media (max-width: 480px) {
  #searchBar button {
    color: transparent;
    text-shadow: 0;
    background: transparent;
    border-radius: 0 5px 5px 0;
    border: 0;
    font-size: 18px;
    padding: 0 1.5em;
    height: 50px;
    position: absolute;
  }

  #searchBar button .icon-search {
    display: block;
    text-shadow: none;
    margin-top: 15px;
  }

  #searchBar button:hover .icon-search:hover {
    display: block;
    text-shadow: none;
    margin-top: 15px;
    background-color: transparent;
  }
}

@media (max-width: 480px) {

  #fullArticle .title,
  .contentWrapper h1 {
    font-size: 24px;
  }

  #fullArticle h2 {
    font-size: 20px;
  }
}

/* Collection Titles  */
.collection-category h2 a {
  color: #54494b;
}

.collection-category h2 {
  font-weight: 400;
  margin: 0 0 20px;
  padding-left: 0.65%;
  font-family: var(--font-body);
  text-align: center;
}

/* Category Images */

/*
  Here is where you determine the images to be used just above each section of your Help Scout main page.
  You have to create one #category-xxx CSS selector for each separate category in your Help Scout collection.
  To get your category xxx number, simply visit the relevant category in your Help Scout docs and
  check the URL bar for the 3 digit category number.

  Then you have to specify an image located on a shared server somewhere on the internet that can
  serve up the images so Help Scout can display them.
*/

/* Getting Started (use your actual category names here in the comment to make it easier) */
#category-123 {
  background-image: url(https://storage.myhostingprovider.com/public/images/123-getting-started.png);
}

/* Setup Users */
#category-456 {
  background-image: url(https://storage.myhostingprovider.com/public/images/456-setup-users.png);
}

/* Uploading Files */
#category-223 {
  background-image: url(https://storage.myhostingprovider.com/public/images/223-uploading-files.png);
}

/* etc... keep going and add one CSS ID selector for each category. */



/* =========================================================
   MAC PRAX — HelpScout Page Styles
   Paste into HelpScout > Article > Custom CSS (head field)
   or wrap in <style> tags in the head code field.
   WTS Brand: Red #8c2233 | Gold #bd8b41 | Cream #f8f7f4
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400;0,600;1,400&family=Inter:wght@400;500;600&display=swap');

/* --- Reset & Base --- */
.prax-page *,
.prax-page *::before,
.prax-page *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.prax-page {
  font-family: 'Inter', sans-serif;
  font-size: 16px;
  line-height: 1.65;
  color: #2b2b2b;
  background-color: #ffffff;
  max-width: 860px;
  margin: 0 auto;
  padding: 0 24px 64px;
}

/* --- Header Banner --- */
.prax-header {
  background-color: #8c2233;
  padding: 36px 40px;
  text-align: center;
  margin: 0 -24px 48px;
}

.prax-header img.prax-logo {
  max-width: 260px;
  height: auto;
  display: block;
  margin: 0 auto 20px;
}

.prax-header h1.prax-title {
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 2.4rem;
  font-weight: 600;
  color: #ffffff;
  letter-spacing: 0.02em;
  line-height: 1.2;
  margin-bottom: 4px;
}

.prax-header p.prax-subtitle {
  font-family: 'Inter', sans-serif;
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #bd8b41;
  margin-top: 6px;
}

/* --- What is PRAX intro --- */
.prax-intro {
  background-color: #f8f7f4;
  border-left: 4px solid #bd8b41;
  border-radius: 4px;
  padding: 28px 32px;
  margin-bottom: 48px;
}

.prax-intro h2 {
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 1.5rem;
  font-weight: 600;
  color: #8c2233;
  margin-bottom: 12px;
}

.prax-intro p {
  color: #3a3a3a;
  margin-bottom: 14px;
  font-size: 0.97rem;
}

.prax-intro p:last-child {
  margin-bottom: 0;
}

.prax-intro .prax-callout {
  font-weight: 600;
  color: #2b2b2b;
}

/* --- Timeline Section Heading --- */
.prax-timeline-heading {
  text-align: center;
  margin-bottom: 12px;
}

.prax-timeline-heading h2 {
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 1.6rem;
  font-weight: 600;
  color: #8c2233;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

/* --- Timeline Image --- */
.prax-timeline-img-wrap {
  text-align: center;
  margin-bottom: 48px;
}

.prax-timeline-img-wrap img {
  max-width: 100%;
  height: auto;
  border-radius: 6px;
}

/* --- Phase Cards --- */
.prax-phases {
  display: flex;
  flex-direction: column;
  gap: 32px;
  margin-bottom: 52px;
}

.prax-phase {
  border: 1px solid #e0ddd8;
  border-radius: 8px;
  overflow: hidden;
}

.prax-phase-header {
  background-color: #8c2233;
  padding: 18px 28px;
  display: flex;
  align-items: center;
  gap: 18px;
}

.prax-phase-number {
  width: 40px;
  height: 40px;
  background-color: #bd8b41;
  color: #ffffff;
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 1.3rem;
  font-weight: 600;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.prax-phase-header h3 {
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 1.25rem;
  font-weight: 600;
  color: #ffffff;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.prax-phase-body {
  padding: 28px;
  background-color: #ffffff;
}

/* --- Phase Meta Grid --- */
.prax-meta-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 32px;
  margin-bottom: 24px;
}

.prax-meta-item {
  border-top: 2px solid #bd8b41;
  padding-top: 10px;
}

.prax-meta-label {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #8c2233;
  margin-bottom: 6px;
}

.prax-meta-value {
  font-size: 0.92rem;
  color: #3a3a3a;
  line-height: 1.5;
}

.prax-meta-value em {
  font-style: italic;
}

/* --- Prerequisite list inside Who/Start --- */
.prax-meta-value ul {
  padding-left: 18px;
  margin-top: 6px;
}

.prax-meta-value ul li {
  margin-bottom: 3px;
  font-size: 0.9rem;
}

/* --- Deliverables --- */
.prax-deliverables {
  background-color: #f8f7f4;
  border-radius: 6px;
  padding: 20px 24px;
}

.prax-deliverables-label {
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: #8c2233;
  margin-bottom: 10px;
}

.prax-deliverables ul {
  padding-left: 18px;
  margin-bottom: 0;
}

.prax-deliverables ul li {
  font-size: 0.92rem;
  color: #3a3a3a;
  margin-bottom: 4px;
  line-height: 1.5;
}

.prax-deliverables ul li ul {
  margin-top: 4px;
  margin-bottom: 4px;
}

.prax-deliverables .prax-submission-note {
  margin-top: 12px;
  font-size: 0.88rem;
  color: #56575a;
  font-style: italic;
}

.prax-deliverables .prax-submission-note strong {
  color: #2b2b2b;
  font-style: normal;
}

/* --- Questions Section --- */
.prax-questions {
  background-color: #8c2233;
  border-radius: 8px;
  padding: 36px 40px;
  text-align: center;
  color: #ffffff;
  margin-bottom: 40px;
}

.prax-questions h2 {
  font-family: 'EB Garamond', Georgia, serif;
  font-size: 1.7rem;
  font-weight: 600;
  color: #ffffff;
  margin-bottom: 14px;
  letter-spacing: 0.02em;
}

.prax-questions p {
  font-size: 0.95rem;
  color: #f0ece6;
  margin-bottom: 10px;
  line-height: 1.6;
}

.prax-questions p:last-child {
  margin-bottom: 0;
}

.prax-questions a {
  color: #bd8b41;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.prax-questions a:hover {
  color: #d4a85c;
}

/* --- Footer --- */
.prax-footer {
  text-align: center;
  font-size: 0.8rem;
  color: #888;
  padding-top: 16px;
  border-top: 1px solid #e0ddd8;
}

/* --- Responsive --- */
@media (max-width: 600px) {
  .prax-header {
    padding: 28px 20px;
    margin: 0 -24px 36px;
  }

  .prax-header h1.prax-title {
    font-size: 1.75rem;
  }

  .prax-meta-grid {
    grid-template-columns: 1fr;
  }

  .prax-phase-body {
    padding: 20px 18px;
  }

  .prax-questions {
    padding: 28px 20px;
  }
}