/* /faq/ — Current Brand editorial knowledge hub */
.faq-page { min-width: 0; }
.faq-page main { display: block; }
.faq-page > .skip-link {
  position: fixed;
  z-index: 1000;
  top: 12px;
  left: 12px;
  max-width: calc(100vw - 24px);
  min-height: 44px;
  padding: 8px 16px;
  border: 1px solid var(--color-gold-decorative);
  background: var(--color-ai-900);
  color: var(--color-surface);
  font: 700 .9rem/1.7 var(--font-gothic);
  transform: translateY(calc(-100% - 24px));
}
.faq-page > .skip-link:focus { transform: translateY(0); }
.faq-page > .skip-link:focus-visible {
  outline: var(--focus-ring-width) solid var(--color-focus-on-light);
  outline-offset: var(--focus-ring-offset);
}

.faq-hero {
  position: relative;
  margin-top: 16px;
  padding: clamp(48px, 7vw, 80px) 24px clamp(44px, 6vw, 72px);
  border-block: 1px solid rgba(183, 146, 67, .55);
  background:
    radial-gradient(circle at 85% 24%, rgba(183, 146, 67, .12), transparent 26%),
    radial-gradient(circle at 12% 78%, rgba(16, 44, 61, .06), transparent 29%),
    linear-gradient(125deg, rgba(255, 252, 245, .96), rgba(247, 242, 232, .92));
}
.faq-hero::after {
  position: absolute;
  right: clamp(18px, 7vw, 90px);
  top: 25px;
  width: clamp(100px, 18vw, 210px);
  aspect-ratio: 1;
  background: url("/images/assets/deco_circle.png") center / contain no-repeat;
  opacity: .2;
  content: "";
  pointer-events: none;
}
.faq-measure,
.faq-content,
.faq-closing {
  width: min(100%, 880px);
  margin-inline: auto;
}
.faq-measure { position: relative; z-index: 1; }
.faq-eyebrow {
  margin-bottom: 14px;
  color: var(--color-gold-text-on-light);
  font: 700 .8rem/1.5 var(--font-gothic);
  letter-spacing: .13em;
}
.faq-hero h1 {
  color: var(--color-ai-900);
  font: 500 clamp(2rem, 5vw, 3.25rem)/1.4 var(--font-mincho);
  letter-spacing: .045em;
}
.faq-lead {
  max-width: 720px;
  margin-top: clamp(25px, 4vw, 40px);
  padding-left: 18px;
  border-left: 3px solid var(--color-gold-decorative);
  color: var(--color-ai-900);
  font: 500 clamp(1rem, 1.7vw, 1.0625rem)/2 var(--font-mincho);
}
.faq-guide {
  display: grid;
  grid-template-columns: 80px minmax(0, 1fr);
  gap: 22px;
  align-items: end;
  max-width: 690px;
  margin-top: 32px;
  padding: 20px 24px 0;
  border: 1px solid rgba(183, 146, 67, .5);
  border-left: 3px solid var(--color-gold-decorative);
  background: rgba(255, 252, 245, .88);
}
.faq-guide__portrait { width: 80px; height: auto; }
.faq-guide__body { min-width: 0; padding-bottom: 20px; }
.faq-guide__name {
  margin-bottom: 7px;
  color: var(--color-gold-text-on-light);
  font: 700 .75rem/1.6 var(--font-gothic);
  letter-spacing: .08em;
}
.faq-guide__body p:last-child {
  color: var(--color-ai-900);
  font: 500 .96rem/1.9 var(--font-mincho);
}

.faq-content { padding: 54px 24px 20px; }
.faq-toc {
  padding: 26px 30px;
  border: 1px solid var(--color-border);
  border-top: 2px solid var(--color-gold-decorative);
  background: var(--color-surface);
  box-shadow: var(--shadow-card);
}
.faq-toc p {
  margin-bottom: 15px;
  color: var(--color-gold-text-on-light);
  font: 700 .78rem/1.5 var(--font-gothic);
  letter-spacing: .1em;
}
.faq-toc ul {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
  gap: 6px 18px;
  list-style: none;
}
.faq-toc a {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 7px 0;
  border-bottom: 1px solid var(--color-border);
  color: var(--color-ai-900);
  font: 600 .95rem/1.7 var(--font-mincho);
  text-decoration: none;
}
.faq-toc a::after {
  margin-left: auto;
  padding-left: 12px;
  color: var(--color-gold-text-on-light);
  content: "↓";
}
.faq-toc a:hover,
.faq-toc a:focus-visible { text-decoration: underline; text-underline-offset: .25em; }

.faq-category { margin-top: clamp(58px, 8vw, 88px); }
.faq-category h2 {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 0 0 15px;
  border-bottom: 1px solid var(--color-gold-decorative);
  color: var(--color-ai-900);
  font: 500 clamp(1.6rem, 3vw, 2rem)/1.5 var(--font-mincho);
  letter-spacing: .045em;
}
.faq-category h2::before {
  display: block;
  width: 28px;
  height: 30px;
  flex: 0 0 28px;
  background: repeating-linear-gradient(to bottom, var(--color-gold-decorative) 0 2px, transparent 2px 5px);
  content: "";
}
.faq-item {
  padding: 27px clamp(18px, 3vw, 32px) 29px;
  border-bottom: 1px solid var(--color-border);
  background: linear-gradient(120deg, rgba(255, 252, 245, .9), rgba(247, 242, 232, .72));
}
.faq-item:nth-of-type(even) {
  background: linear-gradient(120deg, rgba(247, 242, 232, .72), rgba(255, 252, 245, .9));
}
.faq-item h3 {
  color: var(--color-ai-900);
  font: 600 clamp(1.05rem, 2vw, 1.2rem)/1.7 var(--font-mincho);
  letter-spacing: .02em;
}
.faq-item h3::before {
  display: inline-block;
  width: 4px;
  height: 1em;
  margin: 0 12px -2px 0;
  background: var(--color-gold-decorative);
  content: "";
}
.faq-item p {
  margin-top: 13px;
  color: var(--color-ink-900);
  font-size: .96rem;
  line-height: 1.9;
}
.faq-item a,
.faq-closing > p a {
  color: var(--color-ai-900);
  font-weight: 700;
  text-decoration-thickness: 1px;
}

.faq-closing {
  margin-top: 64px;
  padding: 34px 24px 70px;
  border-top: 1px solid var(--color-gold-decorative);
}
.faq-closing__guide {
  display: grid;
  grid-template-columns: 70px minmax(0, 1fr);
  gap: 20px;
  align-items: end;
  margin-bottom: 28px;
  padding: 16px 20px 0;
  border: 1px solid rgba(183, 146, 67, .5);
  border-left: 3px solid var(--color-gold-decorative);
  background: linear-gradient(120deg, var(--color-surface), var(--color-washi-100));
}
.faq-closing__guide img { width: 70px; height: auto; }
.faq-closing__guide > div { min-width: 0; padding-bottom: 16px; }
.faq-closing__guide p:last-child {
  color: var(--color-ai-900);
  font: 500 .96rem/1.9 var(--font-mincho);
}
.faq-closing > p { color: var(--color-ink-900); line-height: 1.9; }
.faq-closing nav {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
  margin-top: 30px;
}
.faq-closing nav a {
  display: flex;
  min-width: 0;
  min-height: 112px;
  padding: 18px 20px;
  flex-direction: column;
  justify-content: center;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
  color: var(--color-ai-900);
  text-decoration: none;
}
.faq-closing nav a:last-child {
  border-color: var(--color-ai-900);
  background: var(--color-ai-900);
  color: var(--color-surface);
}
.faq-closing nav a span { font: 700 .75rem/1.6 var(--font-gothic); }
.faq-closing nav a strong {
  margin-top: 9px;
  font: 600 1.05rem/1.6 var(--font-mincho);
}
.faq-closing nav a:hover,
.faq-closing nav a:focus-visible { text-decoration: underline; text-underline-offset: .25em; }
.faq-page .faq-closing nav a:last-child:focus-visible {
  outline-color: var(--color-focus-on-dark);
}

@media (max-width: 600px) {
  .faq-content { padding: 36px 16px 12px; }
  .faq-hero { padding-inline: 16px; }
  .faq-closing { padding-inline: 16px; }
  .faq-hero::after { opacity: .45; }
  .faq-toc { padding: 20px; }
  .faq-toc ul,
  .faq-closing nav { grid-template-columns: minmax(0, 1fr); }
  .faq-guide,
  .faq-closing__guide { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .faq-guide { padding: 18px 20px 0; }
  .faq-guide__portrait,
  .faq-closing__guide img { width: 68px; }
  .faq-guide__body { padding-bottom: 20px; }
  .faq-closing__guide { padding: 18px 20px 0; }
}

@media (prefers-reduced-motion: reduce) {
  .faq-page * { scroll-behavior: auto; }
}