/* Hallmark · genre: editorial · macrostructure: photographic clearing / grouped document · design-system: design.md · designed-as-app */
@import 'editorial-tokens.css';

/* Loaded by About and FAQ only; no shared header, footer or homepage overrides. */
.editorial-page {
  background: var(--color-editorial-paper);
  color: var(--color-editorial-ink);
  font-family: var(--font-editorial-body);
  font-size: var(--text-editorial-body);
  line-height: 1.7;
}

.editorial-page,
.editorial-page *,
.editorial-page *::before,
.editorial-page *::after { box-sizing: border-box; }

.editorial-container {
  width: min(100% - 2 * var(--space-editorial-gutter), 80rem);
  margin-inline: auto;
}

.editorial-page h1,
.editorial-page h2 {
  min-width: 0;
  color: inherit;
  font-family: var(--font-editorial-display);
  font-style: normal;
  font-weight: 700;
  letter-spacing: -0.025em;
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.editorial-page h2 {
  margin: 0 0 var(--space-editorial-md);
  font-size: var(--text-editorial-heading);
  line-height: 1.2;
}

.editorial-page p { margin: 0; }

.editorial-hero {
  position: relative;
  display: grid;
  align-items: center;
  min-height: 33rem;
  padding-block: var(--space-editorial-section);
  isolation: isolate;
  background: var(--color-editorial-ink);
  color: var(--color-editorial-light);
}

.editorial-hero > picture,
.editorial-hero__image,
.editorial-hero::after {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.editorial-hero > picture { z-index: -2; }
.editorial-hero__image { display: block; object-fit: cover; object-position: center 56%; }
.editorial-hero::after {
  content: '';
  z-index: -1;
  pointer-events: none;
  background: linear-gradient(90deg, var(--color-editorial-overlay), var(--color-editorial-overlay-mid) 42%, var(--color-editorial-overlay-clear) 85%);
}

.editorial-hero h1 {
  max-width: 15ch;
  margin: 0;
  font-size: var(--text-editorial-display);
  line-height: 1.04;
}
.editorial-hero p {
  max-width: 36rem;
  margin-top: var(--space-editorial-md);
  font-size: var(--text-editorial-question);
  line-height: 1.6;
  text-wrap: pretty;
}
.editorial-hero .editorial-button { margin-top: var(--space-editorial-lg); }
.editorial-hero--compact { min-height: 27rem; }

.editorial-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-height: 3.5rem;
  padding: var(--space-editorial-sm) var(--space-editorial-lg);
  border: 1px solid transparent;
  border-radius: var(--radius-editorial-button);
  background: var(--color-editorial-accent);
  color: var(--color-editorial-ink);
  font-family: var(--font-editorial-body);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.2;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  transition: transform var(--dur-editorial-short) var(--ease-editorial-out);
}
.editorial-button:visited { color: var(--color-editorial-ink); }
.editorial-button:active { transform: translateY(1px); }
.editorial-page a:focus-visible,
.faq-disclosure summary:focus-visible {
  outline: 3px solid var(--color-editorial-focus);
  outline-offset: 5px;
}
.editorial-hero a:focus-visible,
.editorial-contact--dark a:focus-visible { outline-color: var(--color-editorial-focus-light); }

.editorial-text-link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-editorial-xs);
  min-height: 2.75rem;
  color: inherit;
  font-weight: 700;
  text-underline-offset: 0.3em;
  text-decoration-thickness: 1px;
}

.about-story {
  display: grid;
  grid-template-columns: minmax(0, 0.88fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(2rem, 5vw, 5rem);
  padding-block: var(--space-editorial-section);
}
.about-story__image { align-self: stretch; margin: 0; min-width: 0; }
.about-story__image picture { display: block; height: 100%; }
.about-story__image img { display: block; width: 100%; height: 100%; max-height: 48rem; object-fit: cover; object-position: center; }
.about-story__copy { display: grid; gap: var(--space-editorial-xl); }
.about-story__copy p { color: var(--color-editorial-muted); }
.about-story__copy strong { color: var(--color-editorial-ink); font-weight: 700; }

.about-promise {
  padding-block: var(--space-editorial-section);
  background: var(--color-editorial-ink);
  color: var(--color-editorial-light);
}
.about-promise__layout { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 6rem); }
.about-promise__intro p { max-width: 36ch; }
.about-promise__list { margin: 0; }
.about-promise__list > div { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(0, 1fr); gap: var(--space-editorial-md); padding-block: var(--space-editorial-md); border-top: 1px solid var(--color-editorial-rule-light); }
.about-promise__list > div:first-child { padding-top: 0; border-top: 0; }
.about-promise__list > div:last-child { padding-bottom: 0; }
.about-promise__list dt { font-family: var(--font-editorial-display); font-size: var(--text-editorial-question); font-weight: 700; line-height: 1.4; }
.about-promise__list dd { margin: 0; font-size: 1rem; line-height: 1.6; }

.editorial-contact { padding-block: var(--space-editorial-section); }
.editorial-contact--light { text-align: center; }
.editorial-contact--light p { max-width: 48rem; margin-inline: auto; }
.editorial-contact--light .editorial-button { margin-top: var(--space-editorial-lg); }
.editorial-contact--dark { background: var(--color-editorial-ink); color: var(--color-editorial-light); border-bottom: 1px solid var(--color-editorial-rule-light); }
.editorial-contact__layout { display: flex; align-items: center; justify-content: space-between; gap: var(--space-editorial-xl); }
.editorial-contact__layout h2 { margin-bottom: var(--space-editorial-sm); }
.editorial-contact__actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: var(--space-editorial-md) var(--space-editorial-lg); flex-shrink: 0; }

.faq-topics { border-bottom: 1px solid var(--color-editorial-rule); }
.faq-topics > div { display: flex; justify-content: center; gap: var(--space-editorial-xl); }
.faq-topics a {
  display: flex;
  align-items: center;
  min-height: 4.5rem;
  padding-block: var(--space-editorial-sm);
  color: var(--color-editorial-ink);
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}
.faq-content { max-width: 58rem; padding-block: var(--space-editorial-section); }
.faq-group { padding: 0; scroll-margin-top: calc(var(--header-height) + var(--space-editorial-lg)); }
.faq-group + .faq-group { margin-top: var(--space-editorial-xl); }
.faq-group h2 { margin-bottom: var(--space-editorial-lg); }
.faq-disclosure { border-top: 1px solid var(--color-editorial-rule); }
.faq-disclosure:last-child { border-bottom: 1px solid var(--color-editorial-rule); }
.faq-disclosure summary {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-editorial-md);
  min-height: 4.5rem;
  padding: var(--space-editorial-md) var(--space-editorial-xs);
  font-size: var(--text-editorial-question);
  font-weight: 700;
  line-height: 1.5;
  list-style: none;
  cursor: pointer;
}
.faq-disclosure summary::-webkit-details-marker { display: none; }
.faq-disclosure__toggle { position: relative; flex: 0 0 1.25rem; width: 1.25rem; height: 1.25rem; }
.faq-disclosure__toggle::before,
.faq-disclosure__toggle::after { content: ''; position: absolute; background: currentColor; }
.faq-disclosure__toggle::before { width: 100%; height: 1px; top: 50%; left: 0; }
.faq-disclosure__toggle::after { width: 1px; height: 100%; top: 0; left: 50%; transition: transform var(--dur-editorial-short) var(--ease-editorial-out); }
.faq-disclosure[open] .faq-disclosure__toggle::after { transform: scaleY(0); }
.faq-disclosure__answer { padding: 0 var(--space-editorial-xl) var(--space-editorial-md) var(--space-editorial-xs); color: var(--color-editorial-muted); }
.faq-disclosure__answer a { color: var(--color-editorial-link); text-decoration: underline; text-underline-offset: 0.2em; }

@media (hover: hover) {
  .editorial-button:hover { background: var(--color-editorial-accent-hover); color: var(--color-editorial-ink); }
  .editorial-text-link:hover { text-decoration-thickness: 2px; color: inherit; }
  .faq-topics a:hover { text-decoration: underline; text-underline-offset: 0.3em; }
  .faq-disclosure summary:hover { color: var(--color-editorial-link); }
}

@media (max-width: 59.999rem) {
  .about-story { grid-template-columns: minmax(0, 0.85fr) minmax(0, 1fr); gap: var(--space-editorial-lg); align-items: start; }
  .about-story__image { position: sticky; top: calc(var(--header-height) + var(--space-editorial-md)); align-self: start; }
  .about-story__image img { height: auto; }
  .about-promise__layout { grid-template-columns: minmax(0, 1fr); }
  .about-promise__intro p { max-width: 60ch; }
  .editorial-contact__layout { flex-direction: column; align-items: flex-start; }
  .editorial-contact__actions { justify-content: flex-start; }
  .faq-topics > div { gap: var(--space-editorial-md); justify-content: space-between; }
  .faq-topics a { font-size: 0.9375rem; }
}

@media (max-width: 39.999rem) {
  .editorial-hero { min-height: 32rem; align-items: end; padding-block: var(--space-editorial-xl); }
  .editorial-hero--compact { min-height: 30rem; }
  .editorial-hero__image { object-position: 58% center; }
  .editorial-hero::after { background: linear-gradient(180deg, var(--color-editorial-overlay-clear), var(--color-editorial-overlay-mid) 38%, var(--color-editorial-overlay) 90%); }
  .editorial-hero h1 { font-size: clamp(2.65rem, 10.5vw, 3.5rem); }
  .editorial-hero p { max-width: 34ch; }
  .editorial-button { width: 100%; padding-inline: var(--space-editorial-sm); }
  .about-story { grid-template-columns: minmax(0, 1fr); gap: var(--space-editorial-xl); }
  .about-story__image { position: static; }
  .about-story__image img { aspect-ratio: 4 / 3; object-position: center 65%; }
  .about-promise__list > div { grid-template-columns: minmax(0, 1fr); gap: var(--space-editorial-xs); }
  .editorial-contact__actions { width: 100%; flex-direction: column; align-items: flex-start; }
  .editorial-contact__actions .editorial-text-link { align-self: center; }
  .faq-topics > div { flex-direction: column; gap: 0; padding-block: var(--space-editorial-xs); }
  .faq-topics a { min-height: 2.75rem; padding-block: var(--space-editorial-xs); }
  .faq-content { padding-top: var(--space-editorial-xl); }
  .faq-disclosure summary { padding-inline: 0; }
  .faq-disclosure__answer { padding-left: 0; padding-right: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .editorial-button, .faq-disclosure__toggle::after { transition: none; }
  .editorial-button:active { transform: none; }
}

@media print {
  .editorial-hero { min-height: auto; background: none; color: var(--color-editorial-ink); }
  .editorial-hero > picture, .editorial-hero::after, .faq-topics, .editorial-contact { display: none; }
  .faq-disclosure::details-content { display: block; content-visibility: visible; }
  .faq-disclosure__answer { display: block; }
}