/*
Theme Name: Self Canada
Theme URI: https://selfcanada.co/
Author: Self Canada
Description: A lightweight block theme for the Self Canada website migration.
Version: 0.6.4
Requires at least: 6.7
Requires PHP: 8.1
Text Domain: self-canada
*/

html {
  scroll-behavior: smooth;
}

body {
  text-rendering: optimizeLegibility;
}

a {
  text-underline-offset: 0.18em;
}

:focus-visible {
  outline: 3px solid var(--wp--preset--color--gold);
  outline-offset: 3px;
}

.wp-block-button__link {
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.wp-block-button__link:hover {
  box-shadow: 0 8px 24px rgba(10, 31, 68, 0.18);
  transform: translateY(-1px);
}

.sc-card {
  height: 100%;
  border: 1px solid rgba(10, 31, 68, 0.08);
  border-radius: 1rem;
  box-shadow: 0 14px 35px rgba(10, 31, 68, 0.07);
}

.sc-eyebrow {
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

/* Override WordPress's important gold preset for small text on light surfaces. */
.sc-eyebrow.has-gold-color {
  color: #856500 !important;
}

.sc-hero {
  overflow: hidden;
  position: relative;
}

.sc-hero::after {
  background: radial-gradient(circle, rgba(212, 167, 44, 0.22), transparent 68%);
  content: "";
  height: 34rem;
  pointer-events: none;
  position: absolute;
  right: -14rem;
  top: -17rem;
  width: 34rem;
}

.sc-proof-strip {
  border-bottom: 1px solid rgba(10, 31, 68, 0.1);
  border-top: 1px solid rgba(10, 31, 68, 0.1);
}

.sc-step-number {
  align-items: center;
  background: var(--wp--preset--color--gold);
  border-radius: 999px;
  color: var(--wp--preset--color--navy);
  display: inline-flex;
  font-weight: 800;
  height: 2.4rem;
  justify-content: center;
  width: 2.4rem;
}

.sc-page-hero {
  border-bottom: 1px solid rgba(10, 31, 68, 0.1);
}

.sc-detail-list li {
  margin-bottom: 0.75rem;
}

.sc-article-card { border-bottom: 1px solid rgba(10, 31, 68, 0.12); }
.sc-article-card .wp-block-post-title a { text-decoration: none; }
.sc-article-card .wp-block-post-title a:hover { text-decoration: underline; }
.sc-article-body > * + * { margin-block-start: 1.5rem; }

@media (max-width: 781px) {
  header.wp-block-template-part .wp-block-buttons.sc-header-cta {
    display: none !important;
  }
}

/* Explicit overlay colors also cover previously saved header blocks. */
header.wp-block-template-part .wp-block-navigation__responsive-container.is-menu-open {
  background-color: var(--wp--preset--color--navy) !important;
  color: var(--wp--preset--color--white) !important;
  box-sizing: border-box;
  padding: 1.5rem;
}

header.wp-block-template-part .is-menu-open .wp-block-navigation-item__content,
header.wp-block-template-part .is-menu-open .wp-block-navigation__responsive-container-close {
  color: var(--wp--preset--color--white);
}

header.wp-block-template-part .is-menu-open .wp-block-navigation__responsive-container-content {
  padding-inline: 0.5rem;
}

header.wp-block-template-part .is-menu-open .wp-block-navigation-item__content:hover,
header.wp-block-template-part .is-menu-open .wp-block-navigation-item__content:focus-visible {
  color: var(--wp--preset--color--gold);
  text-decoration: underline;
}

/* Keep footer links readable against the navy footer in every link state. */
footer.wp-block-template-part a,
footer.wp-block-template-part a:visited {
  color: var(--wp--preset--color--white);
}

footer.wp-block-template-part a:hover,
footer.wp-block-template-part a:focus-visible {
  color: var(--wp--preset--color--gold);
  text-decoration: underline;
}

/* Keep legal body text readable independently of fluid global typography. */
.sc-legal p,
.sc-legal li {
  font-size: max(16px, 1rem);
  line-height: 1.7;
  overflow-wrap: anywhere;
}

.sc-legal h2 {
  margin-block-start: 2rem;
  font-size: max(20px, 1.25rem);
  line-height: 1.35;
}

.sc-legal .wp-block-list {
  padding-inline-start: 1.5em;
}

.sc-legal li + li {
  margin-block-start: 0.5rem;
}

