/* Drop the Hype brand layer for Luno. 1.0.3-dth.3, 24 October 2026.
   Railings #191F23 and International orange #FF4F00; buttons #D54100 with white text.
   Light page #F7F7F7 (neutral light grey) with pure white surfaces; dark mode on Railings. */

/* Accent: the button orange #D54100 (white text passes 4.5). Set the same value in Ghost > Design > Accent colour.
   International orange #FF4F00 lives in the logo dot, the glow and the images. */
:root { --color-accent: #D54100; --ghost-accent-color: #D54100; }

/* Light-mode page colours */
/* Light mode: warm page, pure white surfaces (quotes, callouts, cards on hover, inputs, menus) */
html[data-color-scheme="light"] { --color-page:#F7F7F7; --color-page-alt:#FFFFFF; --color-stroke:#E3E3E3; --color-content:#191F23; --color-content-alt:#191F23; --color-content-muted:#5D6469; --input-background-color:#FFFFFF; }

/* Dark mode: Railings page, two surface steps */
html[data-color-scheme="dark"] { --color-page:#191F23; --color-page-alt:#21272C; --color-stroke:rgba(255,255,255,.12); --color-content:#EEF0F2; --color-content-alt:#FFFFFF; --color-content-muted:#A3AAB0; --input-background-color:#21272C; }

@layer utilities {
  /* slimmer, quieter header */
  header.container { padding-top: 1rem !important; padding-bottom: 1rem !important; }
  header.container [data-ghost-search] { width: 13rem !important; }
  header.container [data-ghost-search] .input { height: 2rem !important; font-size: 0.8125rem !important; box-shadow: none !important; background: transparent !important; }
  header.container [data-search-hint] { display: none !important; }
  header.container .button [data-icon] { display: none !important; }

  /* logo and theme toggle on one line with the header */
  .site-logo img { height: 1.75rem !important; min-height: 0 !important; width: auto !important; }
  .site-sidebar > div:first-child { padding-top: 1rem !important; padding-left: 1.25rem !important; padding-right: 1.25rem !important; }
  .site-sidebar .site-logo { display: flex !important; align-items: center !important; height: 2rem !important; }
  [data-color-scheme-toggle] { height: 2rem !important; padding: 3px !important; box-sizing: border-box !important; }
  [data-color-scheme-toggle] [data-icon] { width: 24px !important; height: 24px !important; padding: 0 !important; }

  /* one hero post, then a clean break */
  .featured-posts { grid-template-columns: 1fr !important; text-shadow: none !important; padding-bottom: 2.5rem !important; margin-bottom: 2rem !important; border-bottom: 1px solid var(--color-stroke) !important; }
  .featured-posts .post-card { display: grid !important; grid-template-columns: 1.35fr 1fr !important; gap: 2.5rem !important; align-items: center !important; aspect-ratio: auto !important; overflow: visible !important; border-radius: 0 !important; grid-column: auto !important; grid-row: auto !important; }
  .featured-posts .post-card .post-card-image { position: relative !important; height: auto !important; aspect-ratio: 16 / 9 !important; }
  .featured-posts .post-card .post-card-content { position: static !important; inset: auto !important; background: none !important; padding: 0 !important; color: var(--color-content) !important; justify-content: center !important; }
  .featured-posts .post-card .post-card-meta { display: flex !important; margin: 0 0 0.75rem !important; }
  .featured-posts .post-card .post-card__tag { background: var(--color-page-alt) !important; color: var(--color-content-alt) !important; box-shadow: none !important; backdrop-filter: none !important; }
  .featured-posts .post-card .post-card-title, .featured-posts .post-card .post-card-title a { color: var(--color-content-alt) !important; }
  .featured-posts .post-card .post-card-title { font-size: 2.25rem !important; line-height: 1.15 !important; -webkit-line-clamp: 3 !important; }
  .featured-posts .post-card .post-card-excerpt { -webkit-line-clamp: 3 !important; font-size: 1rem !important; margin-top: 0.75rem !important; }
  .featured-posts .post-card footer { display: flex !important; border-color: var(--color-stroke) !important; }
  .dth-latest-label { font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: var(--color-content-muted); margin: 0 0 1rem; }
  @media (max-width: 1023px) { .featured-posts .post-card { grid-template-columns: 1fr !important; gap: 1rem !important; } .featured-posts .post-card .post-card-title { font-size: 1.6rem !important; } }

  /* no "Explore More Content"; slim footer; footer sign-up form shows on phones and tablets only */
  .explore-more-content { display: none !important; }
  .explore-more-content + [data-posts] { margin-top: 2rem !important; }
  [data-footer] { padding-top: 0 !important; margin-top: 3rem !important; }
  [data-footer] > .container > div:first-child { display: none !important; }
  [data-footer] form[data-members-form] { display: none !important; }
  [data-footer] > .container > div:nth-child(2) { margin-top: 0 !important; padding: 1.25rem 0 !important; border-bottom: 0 !important; }
  @media (max-width: 1279px) { [data-footer] form[data-members-form] { display: block !important; } }

  /* topic colours: the dot on tag chips and filter tabs */
  .post-card__tag[href*="managed-service-practice"]::before, .tags-list a[href*="managed-service-practice"]::before { background: #F4C26A; }
  .post-card__tag[href*="partner-management"]::before,      .tags-list a[href*="partner-management"]::before      { background: #7690E0; }
  .post-card__tag[href*="managed-service-trends"]::before,  .tags-list a[href*="managed-service-trends"]::before  { background: #8EDCF5; }
  .post-card__tag[href*="people-leadership"]::before,       .tags-list a[href*="people-leadership"]::before       { background: #5E9E57; }

  /* white text on every orange button; deeper orange on hover; active menu item in link orange */
  a.button, button.button, form[data-members-form] button[type="submit"] { color: #FFFFFF !important; }
  a.button:hover, button.button:hover, form[data-members-form] button[type="submit"]:hover { background-color: #BC3903 !important; border-color: #BC3903 !important; }
  html[data-color-scheme="light"] .site-sidebar a[aria-current="page"] { color: #C44100 !important; }
  html[data-color-scheme="dark"] .site-sidebar a[aria-current="page"] { color: #FF7A3D !important; }

  /* cards lift to the surface colour on hover, whatever colour a tag has */
  .post-card { --hover-bg-color: var(--color-page-alt) !important; }
  .post-card__tag[href*="/tag/"]::before, .tags-list a[href*="/tag/"]::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; margin-right: 6px; vertical-align: middle; }

  /* topic pages: smaller round image, wider description, a "Topic" label in the topic's colour */
  .tag-template main > section:has(> img.rounded-full) { gap: 2rem !important; padding: 1.5rem 0 1rem !important; }
  .tag-template main > section > img.rounded-full { width: 7rem !important; height: 7rem !important; box-shadow: none !important; }
  .tag-template main > section:has(> img.rounded-full) > div { gap: 0.6rem !important; flex: 1 1 auto; }
  .tag-template main > section h1 { font-size: 2.5rem !important; line-height: 1.1 !important; }
  .tag-template main > section p { max-width: 46rem !important; font-size: 1rem !important; line-height: 1.6 !important; color: var(--color-content-muted) !important; }
  .tag-template main > section > div::before { content: "Topic"; font-size: 0.75rem; font-weight: 600; line-height: 1; letter-spacing: 0.1em; text-transform: uppercase; color: var(--dth-topic-text, var(--color-content-muted)); text-align: center; }
  @media (min-width: 768px) { .tag-template main > section > div::before { text-align: left; } }
  @media (max-width: 767px) { .tag-template main > section h1 { font-size: 2rem !important; } .tag-template main > section p { text-align: center !important; } }
}

@layer base {
  header.container a.button { height: 2rem !important; min-height: 0 !important; padding: 0 0.9rem !important; line-height: 2rem !important; box-shadow: none !important; }
}

/* end-of-post sign-up box: the orange glow fades through warm charcoal so it never turns mauve against Railings (the box itself is added by the Site footer script) */
.dth-cta { margin: 2rem 0 1rem; padding: 1.75rem 1.75rem 1.5rem; border-radius: 16px; color: #fff; background: radial-gradient(circle at 100% 100%, #1B1611 0, rgba(27,22,17,.75) 45%, rgba(27,22,17,0) 80%), linear-gradient(135deg, #21282D, #11161A); position: relative; overflow: hidden; }
.dth-cta::after { content: ""; position: absolute; right: -30%; bottom: -80%; width: 80%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(closest-side, rgba(255,90,10,.55), rgba(232,89,15,.3) 30%, rgba(184,82,15,.1) 60%, rgba(184,82,15,0)); }
.dth-cta > * { position: relative; z-index: 1; }
.dth-cta h3 { margin: 0 0 .4rem; font-size: 1.35rem; color: #fff; }
.dth-cta p { margin: 0 0 1rem; color: rgba(255,255,255,.78); font-size: .95rem; max-width: 48ch; }
.dth-cta-btn { display: inline-flex; align-items: center; height: 2.5rem; padding: 0 1.25rem; border-radius: 999px; background: #D54100; color: #FFFFFF !important; font-weight: 700; text-decoration: none !important; }

/* links in posts and pages: deeper orange on the light page, bright orange in dark mode */
html[data-color-scheme="light"] .post-body a:not(.kg-btn), html[data-color-scheme="light"] .gh-content a:not(.kg-btn) { color: #C44100; }
html[data-color-scheme="dark"] .post-body a:not(.kg-btn), html[data-color-scheme="dark"] .gh-content a:not(.kg-btn) { color: #FF7A3D; }

/* white quotes and callouts on the light page; surface colour in dark mode */
.post-body blockquote:not(.kg-blockquote-alt), .gh-content blockquote:not(.kg-blockquote-alt) { background: var(--color-page-alt); border: 1px solid var(--color-stroke); border-inline-start: .25rem solid #FF4F00; border-radius: 12px; font-style: normal; }
.kg-callout-card { background: var(--color-page-alt) !important; border: 1px solid var(--color-stroke); border-radius: 12px; }
html[data-color-scheme="light"] .kg-bookmark-card a.kg-bookmark-container { background: #FFFFFF; }

/* About the Blog: the line under each topic heading in its topic colour */
#managed-service-practice + p { color: #9B670B; }
#partner-management + p      { color: #4669D5; }
#managed-service-trends + p  { color: #0E7A9C; }
#people-leadership + p       { color: #4A7D45; }
html[data-color-scheme="dark"] #managed-service-practice + p { color: #F4C26A; }
html[data-color-scheme="dark"] #partner-management + p      { color: #7690E0; }
html[data-color-scheme="dark"] #managed-service-trends + p  { color: #8EDCF5; }
html[data-color-scheme="dark"] #people-leadership + p       { color: #65A65E; }

/* Topic colours as variables: bright for dark mode and graphics, deeper for text on the light page */
.tag-managed-service-practice { --dth-topic: #F4C26A; --dth-topic-text: #9B670B; }
.tag-partner-management      { --dth-topic: #7690E0; --dth-topic-text: #4669D5; }
.tag-managed-service-trends  { --dth-topic: #8EDCF5; --dth-topic-text: #0E7A9C; }
.tag-people-leadership       { --dth-topic: #5E9E57; --dth-topic-text: #4A7D45; }
html[data-color-scheme="dark"] .tag-managed-service-practice { --dth-topic-text: #F4C26A; }
html[data-color-scheme="dark"] .tag-partner-management      { --dth-topic-text: #7690E0; }
html[data-color-scheme="dark"] .tag-managed-service-trends  { --dth-topic-text: #8EDCF5; }
html[data-color-scheme="dark"] .tag-people-leadership       { --dth-topic-text: #65A65E; }