/**
 * Adenium Living — Plain English Guide Template Styles
 *
 * Mauve #DEB0D1 (hero) · Walnut #2D050A · Pecan #4A2626
 * Stone #E9D5C2 · Orchid #A191FF · Electric Yellow #E5E800
 */

:root {
  --walnut: #2D050A;
  --pecan: #4A2626;
  --mauve: #DEB0D1;
  --stone: #E9D5C2;
  --orchid: #A191FF;
  --yellow: #E5E800;

  --ground: #F4ECE5;
  --surface: #FCF7F3;
  --surface-2: #E9D5C2;
  --ink: #2D050A;
  --ink-soft: #4A2626;
  --ink-faint: #74524F;
  --rule: #E0CFC3;
  --rule-strong: #C9B3A5;
  --accent: #2D050A;
  --accent-ink: #4A2626;
  --accent-soft: #E9D5C2;
  --focus: #4A2626;
  --bar-bg: #2D050A;
  --bar-ink: #E9D5C2;
  --bar-tag: #C6A891;

  --font-display: "Pathway Extreme", "Helvetica Neue", Arial, sans-serif;
  --font-text: "Pathway Extreme", "Helvetica Neue", Arial, sans-serif;
  --radius: 14px;

  --step: clamp(1rem, 0.95rem + 0.2vw, 1.0625rem);
  --measure: 63ch;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ground: #2D050A;
    --surface: #4A2626;
    --surface-2: #5C3535;
    --ink: #F2E5DA;
    --ink-soft: #DCC5B4;
    --ink-faint: #BC9F8F;
    --rule: #5C3535;
    --rule-strong: #7A4C4C;
    --accent: #DEB0D1;
    --accent-ink: #E7C6DF;
    --accent-soft: #E9D5C2;
    --focus: #DEB0D1;
    --bar-bg: #1C0305;
    --bar-ink: #E9D5C2;
    --bar-tag: #B48F79;
  }
}

:root[data-theme="dark"] {
  --ground: #2D050A;
  --surface: #4A2626;
  --surface-2: #5C3535;
  --ink: #F2E5DA;
  --ink-soft: #DCC5B4;
  --ink-faint: #BC9F8F;
  --rule: #5C3535;
  --rule-strong: #7A4C4C;
  --accent: #DEB0D1;
  --accent-ink: #E7C6DF;
  --accent-soft: #E9D5C2;
  --focus: #DEB0D1;
  --bar-bg: #1C0305;
  --bar-ink: #E9D5C2;
  --bar-tag: #B48F79;
}

/* ==========================================================================
   HIDE THEME HEADER AND FOOTER ON GUIDE TEMPLATE
   ========================================================================== */
body.page-template-template-guide .site-header,
body.page-template-template-guide footer.footer,
body.page-template-template-guide #return-to-top {
  display: none !important;
}

body.page-template-template-guide,
body.page-template-template-guide #page,
body.page-template-template-guide #main,
body.page-template-template-guide #main.wrapper {
  margin: 0 !important;
  padding: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  background: var(--ground) !important;
}

/* ==========================================================================
   GUIDE BASE & OVERRIDES
   ========================================================================== */
.guide-template-body {
  margin: 0 !important;
  background: var(--ground) !important;
  color: var(--ink) !important;
  font-family: var(--font-text) !important;
  font-weight: 300 !important;
  font-size: var(--step) !important;
  line-height: 1.65 !important;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
}

.guide-template-body * {
  box-sizing: border-box !important;
}

.guide-template-body .wrap {
  max-width: 46rem !important;
  margin: 0 auto !important;
  padding: 0 1.5rem 5rem !important;
}

/* Links underline override */
.guide-template-body a {
  color: var(--accent-ink) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 2px !important;
  transition: text-decoration-thickness 0.15s ease;
}

.guide-template-body a:hover {
  text-decoration: underline !important;
  text-decoration-thickness: 2px !important;
}

.guide-template-body a.wordmark,
.guide-template-body a.btn {
  text-decoration: none !important;
}

.guide-template-body a.wordmark:hover,
.guide-template-body a.btn:hover {
  text-decoration: none !important;
}

.guide-template-body :focus-visible {
  outline: 3px solid var(--focus) !important;
  outline-offset: 3px !important;
  border-radius: 2px !important;
}

/* ---------- brand bar ---------- */
.guide-template-body .brandbar {
  background: var(--bar-bg) !important;
  color: var(--bar-ink) !important;
}

.guide-template-body .brandbar .inner {
  max-width: 46rem !important;
  margin: 0 auto !important;
  padding: 1.1rem 1.5rem !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
}

.guide-template-body .wordmark {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: 1.2rem !important;
  letter-spacing: -0.025em !important;
  color: var(--bar-ink) !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
}

.guide-template-body .wordmark:hover {
  text-decoration: none !important;
}

.guide-template-body .brandbar .tag {
  font-family: var(--font-display) !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
  color: var(--bar-tag) !important;
}

@media (max-width: 34rem) {
  .guide-template-body .brandbar .tag {
    display: none !important;
  }
}

/* ---------- masthead ---------- */
.guide-template-body header.masthead {
  border-bottom: 1px solid var(--rule) !important;
  border-top: none !important;
  padding: 2.75rem 0 2rem !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 1.1rem !important;
  margin: 0 !important;
  background: transparent !important;
}

.guide-template-body .eyebrow {
  font-family: var(--font-display) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  color: var(--accent-ink) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body h1 {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: clamp(2rem, 1.45rem + 2.5vw, 2.95rem) !important;
  line-height: 1.08 !important;
  letter-spacing: -0.025em !important;
  color: var(--accent) !important;
  text-wrap: balance;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .standfirst {
  font-size: clamp(1.1rem, 1.02rem + 0.35vw, 1.24rem) !important;
  line-height: 1.5 !important;
  font-weight: 300 !important;
  color: var(--ink-soft) !important;
  max-width: var(--measure) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.4rem 1.4rem !important;
  font-size: 0.83rem !important;
  color: var(--ink-faint) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .meta span {
  display: inline-block !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------- main & sections (Vertical Spacing) ---------- */
.guide-template-body main {
  display: flex !important;
  flex-direction: column !important;
  gap: 3rem !important;
  padding-top: 2.75rem !important;
  margin: 0 !important;
  padding-bottom: 0 !important;
}

.guide-template-body section {
  display: flex !important;
  flex-direction: column !important;
  gap: 1rem !important;
  margin: 0 !important;
  padding: 0 !important;
  clear: none !important;
}

.guide-template-body h2 {
  font-family: var(--font-display) !important;
  font-weight: 700 !important;
  font-size: clamp(1.36rem, 1.22rem + 0.65vw, 1.62rem) !important;
  line-height: 1.24 !important;
  letter-spacing: -0.015em !important;
  color: var(--accent) !important;
  text-wrap: balance;
  margin: 0 !important;
  padding: 0 0 0.55rem 0 !important;
  border-bottom: 1px solid var(--rule) !important;
  border-top: none !important;
}

.guide-template-body h3 {
  font-family: var(--font-display) !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  margin: 0 !important;
  padding: 0 !important;
  color: var(--ink) !important;
  letter-spacing: normal !important;
}

.guide-template-body p {
  margin: 0 !important;
  padding: 0 !important;
  max-width: var(--measure) !important;
  line-height: 1.65 !important;
  font-weight: 300 !important;
  color: inherit !important;
}

.guide-template-body .lede {
  font-size: 1.08rem !important;
  color: var(--ink-soft) !important;
}

.guide-template-body ul,
.guide-template-body ol {
  margin: 0 !important;
  padding-left: 1.35rem !important;
  max-width: var(--measure) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.55rem !important;
  list-style-type: disc !important;
}

.guide-template-body ol {
  list-style-type: decimal !important;
}

.guide-template-body li {
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.65 !important;
  font-weight: 300 !important;
}

.guide-template-body li::marker {
  color: var(--accent) !important;
  font-weight: 600 !important;
}

.guide-template-body strong,
.guide-template-body b {
  font-weight: 600 !important;
}

.guide-template-body li > strong {
  font-weight: 600 !important;
}

.guide-template-body .plain {
  list-style: none !important;
  padding-left: 0 !important;
}

/* ---------- summary card ---------- */
.guide-template-body .summary {
  background: var(--mauve) !important;
  color: var(--walnut) !important;
  border: 0 !important;
  border-radius: var(--radius) !important;
  padding: 1.6rem 1.7rem !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 1.15rem !important;
  margin: 0 !important;
}

.guide-template-body .summary h2 {
  font-family: var(--font-display) !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.13em !important;
  text-transform: uppercase !important;
  color: var(--pecan) !important;
  border: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
}

.guide-template-body .facts {
  display: flex !important;
  flex-direction: column !important;
  gap: 1.15rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .fact {
  display: grid !important;
  grid-template-columns: 8.5rem 1fr !important;
  gap: 0.4rem 1.25rem !important;
  align-items: baseline !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .fact dt {
  font-size: 0.78rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: var(--pecan) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .fact dd {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 1.04rem !important;
  line-height: 1.5 !important;
  color: inherit !important;
}

.guide-template-body .fact dd p {
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .fact dd strong {
  font-weight: 700 !important;
}

@media (max-width: 34rem) {
  .guide-template-body .fact {
    grid-template-columns: 1fr !important;
  }
}

/* ---------- flagged callout ---------- */
.guide-template-body .flagged {
  background: var(--orchid) !important;
  color: var(--walnut) !important;
  border-radius: var(--radius) !important;
  padding: 1.3rem 1.5rem !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.6rem !important;
  max-width: none !important;
  margin: 0 !important;
}

.guide-template-body .flagged .label {
  font-size: 0.74rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--pecan) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .flagged p {
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
}

/* ---------- two-column compare ---------- */
.guide-template-body .compare {
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 1rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

@media (max-width: 40rem) {
  .guide-template-body .compare {
    grid-template-columns: 1fr !important;
  }
}

.guide-template-body .compare .panel,
.guide-template-body .panel {
  max-height: none !important;
  max-width: none !important;
  overflow: visible !important;
  opacity: 1 !important;
  visibility: visible !important;
  transition: none !important;
  background: var(--surface) !important;
  border: 1px solid var(--rule) !important;
  border-radius: var(--radius) !important;
  padding: 1.3rem 1.4rem !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.8rem !important;
  margin: 0 !important;
}

.guide-template-body .compare .panel p,
.guide-template-body .panel p {
  color: inherit !important;
  margin: 0 !important;
}

.guide-template-body .panel ul {
  gap: 0.45rem !important;
  max-width: none !important;
  margin: 0 !important;
  padding-left: 1.35rem !important;
}

.guide-template-body .panel .tag {
  font-size: 0.74rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .panel.yes .tag {
  color: var(--accent-ink) !important;
}

.guide-template-body .panel.no .tag {
  color: var(--ink-faint) !important;
}

.guide-template-body .panel .note,
.guide-template-body .panel .note p {
  font-size: 0.93rem !important;
  color: var(--ink-soft) !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------- numbered steps (a real sequence) ---------- */
.guide-template-body .steps {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  counter-reset: step;
  gap: 0 !important;
  max-width: none !important;
}

.guide-template-body .steps > li {
  counter-increment: step;
  display: grid !important;
  grid-template-columns: 2.6rem 1fr !important;
  gap: 0 1.1rem !important;
  padding: 1.25rem 0 !important;
  border-top: 1px solid var(--rule) !important;
  border-bottom: none !important;
  margin: 0 !important;
}

.guide-template-body .steps > li:last-child {
  border-bottom: 1px solid var(--rule) !important;
}

.guide-template-body .steps > li::before {
  content: counter(step);
  font-family: var(--font-display) !important;
  font-size: 1.55rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: var(--accent) !important;
  font-variant-numeric: tabular-nums !important;
  padding-top: 0.1rem !important;
}

.guide-template-body .steps .body {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.55rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .steps .body p {
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .steps .body ul {
  max-width: none !important;
  gap: 0.4rem !important;
  margin: 0 !important;
}

/* ---------- timeframes table ---------- */
.guide-template-body .table-scroll {
  overflow-x: auto !important;
  margin: 0 !important;
}

.guide-template-body table {
  border-collapse: collapse !important;
  width: 100% !important;
  min-width: 30rem !important;
  font-size: 0.96rem !important;
  margin: 0 !important;
  border: none !important;
}

.guide-template-body caption {
  text-align: left !important;
  font-size: 0.86rem !important;
  color: var(--ink-faint) !important;
  padding-bottom: 0.6rem !important;
  margin: 0 !important;
}

.guide-template-body th,
.guide-template-body td {
  text-align: left !important;
  padding: 0.7rem 0.9rem 0.7rem 0 !important;
  border-bottom: 1px solid var(--rule) !important;
  vertical-align: top !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
}

.guide-template-body th {
  font-size: 0.74rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.09em !important;
  text-transform: uppercase !important;
  color: var(--ink-faint) !important;
  border-bottom: 1px solid var(--rule-strong) !important;
}

.guide-template-body td:first-child {
  font-weight: 500 !important;
  white-space: nowrap !important;
  padding-right: 1.4rem !important;
  font-variant-numeric: tabular-nums !important;
}

.guide-template-body td p {
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------- checklist ---------- */
.guide-template-body .checklist {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
  gap: 0.6rem !important;
}

.guide-template-body .checklist li {
  display: grid !important;
  grid-template-columns: 1.35rem 1fr !important;
  gap: 0.75rem !important;
  align-items: start !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .checklist li::before {
  content: "" !important;
  width: 1.05rem !important;
  height: 1.05rem !important;
  margin-top: 0.32rem !important;
  border: 1.5px solid var(--rule-strong) !important;
  border-radius: 3px !important;
  background: var(--surface) !important;
}

/* ---------- glossary ---------- */
.guide-template-body .glossary {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.9rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .glossary div {
  display: flex !important;
  flex-direction: column !important;
  gap: 0.2rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .glossary dt {
  font-weight: 600 !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .glossary dd {
  margin: 0 !important;
  padding: 0 !important;
  color: var(--ink-soft) !important;
  max-width: var(--measure) !important;
}

.guide-template-body .glossary dd p {
  margin: 0 !important;
  padding: 0 !important;
}

/* ---------- enquiry block ---------- */
.guide-template-body .enquiry {
  background: var(--stone) !important;
  color: var(--walnut) !important;
  border-radius: var(--radius) !important;
  padding: 1.9rem !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.85rem !important;
  margin: 0 !important;
}

.guide-template-body .enquiry h2 {
  font-family: var(--font-display) !important;
  font-size: 1.42rem !important;
  font-weight: 700 !important;
  letter-spacing: -0.015em !important;
  border: 0 !important;
  padding: 0 !important;
  color: var(--walnut) !important;
  margin: 0 !important;
}

.guide-template-body .enquiry p {
  color: var(--pecan) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body .btn-row {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 0.75rem !important;
  padding-top: 0.35rem !important;
  margin: 0 !important;
}

.guide-template-body .call-line {
  font-size: 0.95rem !important;
  color: var(--pecan) !important;
  padding-top: 0.15rem !important;
  margin: 0 !important;
}

.guide-template-body .btn {
  display: inline-block !important;
  padding: 0.72rem 1.5rem !important;
  border-radius: 999px !important;
  font-family: var(--font-display) !important;
  font-weight: 500 !important;
  font-size: 0.98rem !important;
  text-decoration: none !important;
  border: 0 !important;
  color: var(--walnut) !important;
  line-height: normal !important;
  cursor: pointer;
  transition: filter 0.15s ease;
}

.guide-template-body .btn.primary {
  background: var(--yellow) !important;
}

.guide-template-body .btn.primary:hover {
  filter: brightness(0.94) !important;
  text-decoration: none !important;
}

.guide-template-body .btn.secondary {
  background: var(--orchid) !important;
}

.guide-template-body .btn.secondary:hover {
  filter: brightness(0.96) !important;
  text-decoration: none !important;
}

.guide-template-body .enquiry a:not(.btn) {
  color: var(--walnut) !important;
  text-decoration: underline !important;
}

/* ---------- footer ---------- */
.guide-template-body footer {
  margin-top: 3.5rem !important;
  padding-top: 1.75rem !important;
  border-top: 1px solid var(--rule) !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 1.1rem !important;
  font-size: 0.88rem !important;
  color: var(--ink-faint) !important;
  background: transparent !important;
}

.guide-template-body footer p {
  max-width: var(--measure) !important;
  margin: 0 !important;
  padding: 0 !important;
  color: inherit !important;
}

.guide-template-body footer h3 {
  font-size: 0.74rem !important;
  letter-spacing: 0.11em !important;
  text-transform: uppercase !important;
  color: var(--ink-faint) !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body footer ul {
  font-size: 0.88rem !important;
  gap: 0.35rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.guide-template-body footer a {
  color: var(--ink-soft) !important;
  text-decoration: underline !important;
}

/* ---------- print & accessibility ---------- */
@media (prefers-reduced-motion: reduce) {
  .guide-template-body * {
    transition: none !important;
    animation: none !important;
  }
}

@media print {
  body.page-template-template-guide,
  .guide-template-body {
    background: #fff !important;
    color: #000 !important;
    font-size: 11pt !important;
  }
  .guide-template-body .enquiry,
  .guide-template-body .btn-row {
    display: none !important;
  }
  .guide-template-body h2 {
    break-after: avoid !important;
  }
  .guide-template-body .steps > li,
  .guide-template-body .panel,
  .guide-template-body .summary {
    break-inside: avoid !important;
  }
  .guide-template-body a {
    text-decoration: none !important;
    color: #000 !important;
  }
}
