.hero {
  box-sizing: border-box;
  margin-bottom: 2em;
  overflow-wrap: break-word;
}

.hero .hero-title {
  font-size: 2em;
  margin: 0 0 0.5em;
  line-height: 1.15;
}

.hero .summary {
  max-width: 60ch;
  font-size: 1.08em;
  margin: 0 0 1em;
}

.hero img {
  max-width: 100%;
}

.hero-fr > .wrapper {
  padding-bottom: 1.5em;
  padding-top: 1.5em;
}

.hero-fr .hero-image {
  outline: 1px solid #463a35;
  background: #281f1b;
  min-height: 9em;
  border: 10px solid #281f1b;
}

.hero-fr .hero-image img {
  object-fit: cover;
  max-height: 24em;
  width: 100%;
  display: block;
}

.hero-fr .intro-panel {
  max-width: 40em;
  background: #1c1512;
  margin-left: 0.75em;
  position: relative;
  border: 2px solid #ffffff;
  padding: 1.1em;
  margin-top: -2em;
}

.page-title h1 {
  color: #ffffff;
  font-size: 1.5em;
  margin: 0 0 1.25em;
}

.wrapper {
  box-sizing: border-box;
  max-width: 66em;
  padding-left: 1em;
  padding-right: 1em;
  margin: 0 auto;
}

.site-body {
  padding-bottom: 2.5em;
  padding-top: 1.5em;
}

.stream {
  min-width: 0;
}

.aside-left {
  min-width: 0;
  margin-top: 2em;
}

ul.posts, ol.posts {
  list-style: none;
  margin: 0;
  padding: 0;
}

.story-title {
  font-size: 1.55em;
  margin: 0 0 0.4em;
  font-family: "Fraunces", Georgia, serif;
  line-height: 1.25;
}

.story-title a {
  color: #ffffff;
  text-decoration: none;
}

.story-title a:hover {
  color: #e98f63;
  text-decoration: underline;
}

.post-meta {
  color: #a89b94;
  font-size: 0.85em;
  margin: 0 0 0.9em;
}

.post-meta a {
  color: #a89b94;
}

.card-body img {
  max-width: 100%;
  height: auto;
}

.card-body h2:not(.story-title), .entry-summary h2 {
  font-size: 1.15em;
  margin: 1.25em 0 0.5em;
}

.card-body h3, .entry-summary h3 {
  font-size: 1.02em;
}

.post-thumb {
  margin: 0 0 1em;
}

.post-thumb img {
  height: auto;
  border-radius: 0.125em;
  width: 100%;
  display: block;
}

.lead-post .story-title {
  font-size: 2.1em;
  line-height: 1.15;
}

.lead-post {
  margin-bottom: 2em;
  padding-bottom: 1.5em;
  border-bottom: 3px solid #ffffff;
}

.secondary-post {
  margin-bottom: 2em;
  gap: 2em;
  grid-template-columns: minmax(0,1fr);
  display: grid;
}

.posts .post-header {
  margin-bottom: 1em;
  gap: 1.25em;
  align-items: center;
  grid-template-columns: minmax(0,1fr);
  display: grid;
}

.posts .article:nth-child(even) {
  background: #281f1b;
  padding: 1.25em;
}

.posts .article {
  margin-bottom: 2em;
}

.posts .post-thumb {
  margin: 0;
}

.block {
  margin-bottom: 1.75em;
  font-size: 0.92em;
}

.block-title {
  color: #ffffff;
  padding-bottom: 0.35em;
  font-size: 1em;
  border-bottom: 2px solid #dd713c;
  margin: 0 0 0.6em;
  text-transform: none;
  font-family: "Fraunces", Georgia, serif;
}

.block-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.block-list li, .block-list > div {
  border-bottom: 1px solid #463a35;
  padding: 0.3em 0;
}

.block a {
  color: #e98f63;
  text-decoration: none;
}

.block a:hover {
  text-decoration: underline;
}

.article-title {
  color: #ffffff;
  font-size: 2.1em;
  margin: 0 0 0.5em;
  font-family: "Fraunces", Georgia, serif;
  line-height: 1.2;
}

.single-meta {
  color: #a89b94;
  font-size: 0.88em;
  margin: 0 0 1.5em;
}

.single-meta a {
  color: #a89b94;
}

.markdown img {
  max-width: 100%;
  height: auto;
}

.post-end {
  border-top: 1px solid #463a35;
  padding-top: 1.5em;
  margin-top: 2.5em;
}

.toc {
  background: #281f1b;
  margin-bottom: 1.5em;
  border-radius: 0.125em;
  padding: 1em 1.25em;
}

.toc p {
  margin: 0 0 0.4em;
}

.bio {
  margin-bottom: 1.5em;
  border-radius: 0.125em;
  border: 1px solid #463a35;
  padding: 1.25em;
}

.bio p {
  margin: 0 0 0.4em;
}

.further h2 {
  font-size: 1.15em;
}

.post-nav {
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 1em;
  display: flex;
  margin-top: 1.5em;
}

.crumbs {
  color: #a89b94;
  font-size: 0.82em;
  margin: 0 0 1em;
}

.crumbs a {
  color: #a89b94;
}

.page-footer-s2 {
  border-top: 2px solid #ffffff;
  padding: 2em 0 0.5em;
  margin-top: 2.5em;
}

.page-footer-s2 .bottom-grid {
  gap: 1.5em;
  grid-template-columns: minmax(0,1fr);
  display: grid;
}

.page-footer-s2 ul, .page-footer-s2 ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

.page-footer-s2 .block-list {
  columns: 2;
}

.page-footer-s2 .footer-bottom {
  color: #a89b94;
  font-size: 0.8em;
  margin-top: 1.5em;
}

.links-row {
  flex-wrap: wrap;
  gap: 0.75em;
  list-style: none;
  margin: 1em 0 0;
  padding: 0;
  display: flex;
}

.action {
  background: #dd713c;
  color: #1c1512;
  font-weight: 700;
  border-radius: 0.25em;
  text-decoration: none;
  border: 2px solid #dd713c;
  padding: 0.6em 1.1em;
  display: inline-block;
}

.action-alt {
  background: #1c1512;
  color: #dd713c;
}

.pills {
  flex-wrap: wrap;
  font-size: 0.85em;
  gap: 0.5em;
  list-style: none;
  margin: 0.9em 0 0;
  padding: 0;
  display: flex;
}

.pills li, .pills span {
  background: #281f1b;
  color: #e4dfdd;
  border-radius: 0.5em;
  border: 1px solid #463a35;
  padding: 0.25em 0.65em;
}

.kicker-line {
  color: #a89b94;
  font-weight: 700;
  font-size: 0.8em;
  letter-spacing: 0.08em;
  margin: 0 0 0.4em;
  text-transform: uppercase;
}

.section-head, h2.section-head {
  margin: 0 0 1.5em;
}

.section-head h2, h2.section-head {
  margin-bottom: 0.35em;
  font-size: 1.9em;
}

.section-head p {
  color: #a89b94;
  margin: 0;
}

.intro-copy {
  max-width: 70ch;
  margin: 0 0 1.5em;
}

.hello-card {
  box-sizing: border-box;
  max-width: 100%;
  margin: 1em 0;
}

.hello-card .enquiry-box {
  gap: 0.6em;
  grid-template-columns: minmax(0,1fr);
  display: grid;
}

.hello-card .input-group {
  min-width: 0;
  gap: 0.2em;
  display: grid;
}

.hello-card label {
  font-weight: 600;
  font-size: 0.85em;
}

.hello-card input[type=text], .hello-card input[type=tel], .hello-card textarea {
  box-sizing: border-box;
  background: #1c1512;
  color: #e4dfdd;
  font: inherit;
  border-radius: 0.125em;
  width: 100%;
  border: 1px solid #463a35;
  padding: 0.5em 0.6em;
}

.hello-card button {
  background: #dd713c;
  color: #1c1512;
  font-weight: 700;
  font: inherit;
  border-radius: 0.125em;
  cursor: pointer;
  border: 0;
  padding: 0.65em 1.1em;
}

.hello-card .number {
  font-size: 0.9em;
  margin: 0.6em 0 0;
}

.hello-card .hero-lede {
  margin: 0 0 0.6em;
}

.hello-card-boxed {
  background: #1c1512;
  color: #e4dfdd;
  box-shadow: 0 10px 30px rgba(0,0,0,.14);
  border-radius: 0.25em;
  border: 1px solid #463a35;
  padding: 1.25em;
}

.hello-card-inline {
  background: #281f1b;
  color: #e4dfdd;
  border-radius: 0.25em;
  padding: 0.9em;
}

.hello-card-tabbed {
  background: #1c1512;
  color: #e4dfdd;
  border-top: 4px solid #dd713c;
  box-shadow: 0 6px 20px rgba(0,0,0,.1);
  padding: 1em;
}

.hello-card .switcher {
  flex-wrap: wrap;
  border-bottom: 1px solid #463a35;
  gap: 0;
  display: flex;
}

.hello-card .switcher input {
  height: 1px;
  opacity: 0;
  position: absolute;
  width: 1px;
}

.hello-card .switcher label {
  color: #a89b94;
  border-bottom: 3px solid transparent;
  cursor: pointer;
  padding: 0.45em 0.9em;
}

.hello-card .switcher input:checked + label {
  color: #ffffff;
  border-bottom-color: #dd713c;
}

.hello-card-call {
  background: #281f1b;
  color: #e4dfdd;
  border-radius: 0.25em;
  text-align: center;
  padding: 1em;
}

.hello-card .ring-us {
  background: #dd713c;
  color: #1c1512;
  font-weight: 700;
  font-size: 1.25em;
  border-radius: 999px;
  text-decoration: none;
  padding: 0.9em 1.6em;
  display: inline-block;
}

.hello-card-two {
  background: #1c1512;
  color: #e4dfdd;
  border-radius: 0.25em;
  border: 2px dashed #463a35;
  padding: 1.1em;
}

.hello-card fieldset {
  min-width: 0;
  gap: 0.5em;
  margin: 0;
  border: 0;
  padding: 0;
  display: grid;
}

.hello-card legend {
  color: #a89b94;
  font-size: 0.75em;
  letter-spacing: 0.08em;
}

.hello-card details > summary {
  background: #ffffff;
  color: #1c1512;
  list-style: none;
  border-radius: 0.125em;
  margin: 0.3em 0;
  cursor: pointer;
  padding: 0.5em 1em;
  display: inline-block;
}

.hello-card-compact {
  background: #281f1b;
  color: #e4dfdd;
  border-radius: 0.25em;
  border: 1px solid #463a35;
  padding: 1em;
}

.hello-card-slip {
  background: #1c1512;
  color: #e4dfdd;
  position: relative;
  border-radius: 0.25em;
  border: 1px solid #463a35;
}

.hello-card-slip > .band {
  background: #281f1b;
  border-bottom: 2px dashed #463a35;
  border-radius: 0.25em 0.25em 0 0;
  padding: 1em 1.1em;
}

.hello-card-slip > .band .hero-lede {
  letter-spacing: 0.08em;
  margin: 0;
  text-transform: uppercase;
}

.hello-card-slip > .stage {
  padding: 1.1em;
}

.trending {
  flex-wrap: wrap;
  font-size: 0.88em;
  gap: 0.45em;
  align-items: center;
  margin: 0 0 1.75em;
  display: flex;
}

.trending a {
  background: #281f1b;
  color: #e4dfdd;
  border-radius: 999px;
  text-decoration: none;
  border: 1px solid #463a35;
  padding: 0.25em 0.75em;
}

.shelf {
  gap: 0.6em;
  margin: 0 0 2em;
  grid-template-columns: repeat(2, minmax(0,1fr));
  display: grid;
}

.shelf a {
  background: #1c1512;
  color: #ffffff;
  justify-content: space-between;
  border-top: 3px solid #dd713c;
  gap: 0.5em;
  text-decoration: none;
  border: 1px solid #463a35;
  padding: 0.7em 0.9em;
  display: flex;
}

.shelf span {
  color: #a89b94;
}

.post-header .single-meta {
  margin: 0 0 1.25em;
}

.story-page-tf .toc {
  margin-bottom: 1.5em;
  border-radius: 0.125em;
  border: 2px solid #dd713c;
  padding: 1em;
}

.logo {
  border: 2px solid currentColor;
  padding: 0.1em 0.5em;
}

.action, .ring-us, .hello-card button, .search-box button {
  background: transparent;
  color: #dd713c;
  border: 2px solid #dd713c;
}

.card-body a, .markdown a {
  text-underline-offset: 3px;
  text-decoration-style: dotted;
}

.toc {
  background: #281f1b;
  border: 1px solid #463a35;
  padding: 1em;
}

.card-body ul, .markdown ul {
  list-style-type: "\2713  ";
}

.trending a {
  background: transparent;
  border-bottom: 2px solid #dd713c;
  border-radius: 0;
  border: 0;
}

.post-nav-top {
  margin: 0.5em 0;
  text-align: right;
}

.story-page-pg-band .post-header {
  background: #dd713c;
  color: #1c1512;
  margin-bottom: 1.25em;
  border-radius: 0.25em;
  padding: 1.25em 1em;
}

.story-page-pg-band .article-title {
  color: #1c1512;
  margin: 0;
}

@media (min-width: 600px) {
  .hero .hero-title {
    font-size: 2.6em;
  }
  .site-body {
    grid-template-areas: "l m";
    column-gap: 2.25em;
    align-items: start;
    grid-template-columns: 12em minmax(0,1fr);
    display: grid;
  }
  .stream {
    grid-area: m;
  }
  .aside-left {
    grid-area: l;
    margin-top: 0;
  }
  .posts .post-header:has(figure) {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
  .page-footer-s2 .bottom-grid {
    grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  }
  .hello-card-inline .enquiry-box {
    align-items: end;
    grid-template-columns: minmax(0,1fr) minmax(0,1fr) auto;
  }
  .shelf {
    grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr));
  }
}

@media (min-width: 900px) {
  .secondary-post {
    grid-template-columns: repeat(2, minmax(0,1fr));
  }
}
