/* Location pages — colonial archival tone. No red; parchment backgrounds. */

.loc-hero{
  padding: 54px 0 20px;
}
.loc-hero + .section{
  padding-top: 28px;
  padding-bottom: 56px;
}
.breadcrumbs{
  margin: 0 0 10px;
  font-size: 13px;
  color: var(--ink-muted, #6a5843);
}
.breadcrumbs a{
  color: var(--accent-navy, #2e4057);
  text-decoration: none;
  font-weight: 700;
}
.breadcrumbs a:hover{
  color: var(--accent-brass, #a67c2e);
  text-decoration: underline;
}

.loc-prev-next{
  display: flex;
  gap: 14px;
  margin: 0 0 14px;
  flex-wrap: wrap;
}
.loc-prev-next a{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 14px;
  border-radius: var(--radius);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  color: var(--ink-dark, #2b2116);
  background: rgba(243,234,215,.8);
  border: 1px solid var(--border-soft, #c9b79a);
  transition: background .2s, border-color .2s, color .2s;
}
.loc-prev-next a:hover{
  background: rgba(166,124,46,.12);
  border-color: var(--accent-brass, #a67c2e);
  color: var(--ink-dark, #2b2116);
}
/* Dark mode: strong contrast so button text is readable */
[data-theme="dark"] .loc-prev-next a{
  background: var(--accent-navy);
  color: #fff;
  border-color: var(--border-dark);
}
[data-theme="dark"] .loc-prev-next a:hover{
  background: var(--accent-brass);
  color: var(--ink-dark);
  border-color: var(--accent-brass);
}
.loc-nav-prev{}
.loc-nav-next{}

.loc-title{
  margin: 0 0 10px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600;
  letter-spacing: .02em;
  font-size: clamp(28px, 3.8vw, 46px);
  line-height: 1.08;
  color: var(--ink-dark, #2b2116);
}
.loc-subtitle{
  margin: 0 0 18px;
  color: var(--ink-muted, #6a5843);
  max-width: 70ch;
}

.loc-hero-card{
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 14px;
  padding: 14px;
  border-radius: var(--radius);
  background: var(--bg-parchment-light, #f3ead7);
  border: 1px solid var(--border-soft, #c9b79a);
  box-shadow: var(--shadow);
  overflow: hidden;
}
.loc-hero-media{
  border-radius: 14px;
  min-height: 260px;
  background: linear-gradient(180deg, rgba(230,214,184,.4), rgba(243,234,215,.3));
  border: 1px solid var(--border-soft, #c9b79a);
  position: relative;
}

.loc-hero-media::after{
  content: none !important;
  display: none !important;
}
.loc-hero-meta{
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.meta-row{
  display: flex;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 10px;
  border-radius: 14px;
  background: rgba(243,234,215,.6);
  border: 1px solid var(--border-soft, #c9b79a);
  font-size: 12px;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.meta-k{ color: var(--ink-muted, #6a5843); }
.meta-v{ color: var(--ink-dark, #2b2116); }
.meta-actions{
  display: flex;
  gap: 10px;
  margin-top: 6px;
}

.loc-grid{
  display: grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 20px;
  align-items: start;
}
.loc-article{
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.loc-card{
  background: var(--bg-parchment-light, #f3ead7);
  border: 1px solid var(--border-soft, #c9b79a);
  border-radius: var(--radius);
  padding: 20px;
  box-shadow: 0 8px 32px rgba(43,33,22,.06);
}
.loc-card .section-title{
  margin: 0 0 12px;
  font-family: "Cormorant Garamond", Georgia, serif;
  color: var(--ink-dark, #2b2116);
}
.loc-card .section-title:only-child{
  margin: 0;
}
.loc-article p{
  color: var(--ink-muted, #6a5843);
  margin: 0;
}
.loc-card .bullets{
  margin: 0;
}
.bullets{
  padding-left: 18px;
  color: var(--ink-muted, #6a5843);
}
.timeline{
  margin-top: 4px;
  display: grid;
  gap: 10px;
}
.tl-item{
  background: rgba(243,234,215,.5);
  border: 1px solid var(--border-soft, #c9b79a);
  border-radius: calc(var(--radius) - 2px);
  padding: 12px 14px;
}
.tl-year{
  font-family: "Cormorant Garamond", Georgia, serif;
  letter-spacing: .04em;
  font-size: 13px;
  margin-bottom: 6px;
  color: var(--ink-dark, #2b2116);
}
.tl-body{ color: var(--ink-muted, #6a5843); }

.loc-side .card{
  margin: 0;
}
.loc-side .card + .card{
  margin-top: 16px;
}
.facts, .links{
  margin: 10px 0 0;
  padding-left: 18px;
  color: var(--ink-muted, #6a5843);
}
.facts li, .links li{ margin: 6px 0; }

.link-website{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--accent-navy, #2e4057);
  font-weight: 600;
}
.link-website:hover{
  color: var(--accent-brass, #a67c2e);
}
.link-website::after{
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  background: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E") no-repeat center;
  mask-size: contain;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E") no-repeat center;
  -webkit-mask-size: contain;
  opacity: 0.9;
}

@media (max-width: 980px){
  .loc-hero-card{ grid-template-columns: 1fr; }
  .loc-grid{ grid-template-columns: 1fr; gap: 24px; }
}

/* Dark mode overrides (colors only) */
[data-theme="dark"] .loc-hero-card{ background: var(--mission-patch-bg); }
[data-theme="dark"] .loc-hero-card .btn-primary:hover{ background: var(--accent-brass); color: var(--ink-dark); }
[data-theme="dark"] .loc-content-wrap{ background: var(--hero-overlay); }
[data-theme="dark"] .loc-meta-block{ background: var(--callout-bg); }
[data-theme="dark"] .meta-row{
  background: var(--callout-bg);
  border-color: var(--border-dark);
}
[data-theme="dark"] .meta-k{ color: var(--ink-soft); }
[data-theme="dark"] .meta-v{ color: var(--ink-dark); }
[data-theme="dark"] .loc-why{ background: var(--callout-bg); box-shadow: 0 8px 32px rgba(0,0,0,.25); }
[data-theme="dark"] .timeline{ background: transparent; }
[data-theme="dark"] .tl-item{
  background: var(--callout-bg);
  border-color: var(--border-dark);
}
[data-theme="dark"] .tl-year{ color: var(--ink-dark); }
[data-theme="dark"] .tl-body{ color: var(--ink-soft); }
[data-theme="dark"] .loc-section{ border-color: var(--border-soft); }