/* Samurai Footballer v5: accessible hero slider + information pages */

/* ---------- Hero slider ---------- */
.hero-slider {
  min-height: 100svh;
  display: block;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  background: #05070a;
}
.hero-slider::before,
.hero-slider::after { pointer-events: none; }
.hero-slides { position: absolute; inset: 0; z-index: 0; }
.hero-slide {
  position: absolute;
  inset: 0;
  min-height: 100svh;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .9s ease, visibility .9s step-end;
}
.hero-slide.is-active {
  z-index: 1;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity .9s ease, visibility 0s step-start;
}
.hero-slide .hero-media {
  position: absolute;
  inset: 0;
  overflow: hidden;
}
.hero-slide .hero-media::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 76% 42%, rgba(183,255,54,.14), transparent 32%),
    linear-gradient(90deg, rgba(2,4,8,.96) 0%, rgba(2,4,8,.76) 42%, rgba(2,4,8,.15) 79%),
    linear-gradient(0deg, #07090d 0%, transparent 42%);
  z-index: 2;
}
.hero-slide .hero-media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--slide-position, 62% center);
  filter: saturate(.78) contrast(1.12) brightness(.82);
  opacity: .45;
  transform: scale(1.24) translate3d(var(--slide-x, 3%),0,0);
  will-change: transform, opacity, filter;
  transition: opacity 1s ease, filter 1.2s ease;
  animation: none !important;
}
.hero-slide.is-active .hero-media img {
  opacity: 1;
  filter: saturate(.92) contrast(1.08) brightness(1);
  animation: sf-slide-kenburns 8s cubic-bezier(.16,1,.3,1) both !important;
}
.hero-slide .hero-content {
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  position: relative;
  z-index: 5;
  padding-top: 160px;
  padding-bottom: 74px;
  transform: none !important;
  opacity: 1 !important;
}
.hero-slide-copy { max-width: 960px; }
.hero-slider .hero-kicker,
.hero-slider .hero-title-line,
.hero-slider .hero-copy,
.hero-slider .hero-actions,
.hero-slider .hero-stats {
  opacity: 0;
  filter: blur(10px);
  animation: none !important;
  will-change: transform, opacity, filter;
}
.hero-slider .hero-kicker { transform: translate3d(-90px,20px,0); }
.hero-slider .hero-title {
  margin: 22px 0 26px;
  max-width: 1040px;
  font-size: clamp(3.4rem, 8.7vw, 8.45rem);
  line-height: .91;
  letter-spacing: -.075em;
  text-wrap: balance;
}
.hero-title-line {
  display: block;
  overflow: hidden;
  padding: .03em .04em .08em 0;
  transform: translate3d(0,25px,0);
}
.hero-title-text {
  display: block;
  transform: translate3d(0,125%,0) rotate(3deg);
  transform-origin: left bottom;
}
.hero-title-text.outline {
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(255,255,255,.74);
  position: relative;
  background: linear-gradient(105deg, transparent 0 38%, rgba(255,255,255,.95) 48%, transparent 58%) 120% 0 / 250% 100% no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
}
.hero-title-text.outline::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -.08em;
  width: min(3.8em, 72vw);
  height: 5px;
  border-radius: 999px;
  background: linear-gradient(90deg,var(--accent),transparent);
  transform: scaleX(0);
  transform-origin: left;
}
.hero-slider .hero-copy { transform: translate3d(-78px,20px,0); }
.hero-slider .hero-actions { transform: translate3d(0,58px,0); }
.hero-slider .hero-stats { transform: translate3d(0,65px,0); }
.hero-slide.is-active .hero-kicker {
  opacity: 1;
  filter: blur(0);
  transform: none;
  transition: opacity .62s .23s ease, transform .95s .23s cubic-bezier(.16,1,.3,1), filter .8s .23s ease;
}
.hero-slide.is-active .hero-title-line {
  opacity: 1;
  filter: blur(0);
  transform: none;
  transition: opacity .25s .25s ease, transform .5s .25s ease, filter .6s .25s ease;
}
.hero-slide.is-active .hero-title-line:nth-child(2) { transition-delay: .34s; }
.hero-slide.is-active .hero-title-text {
  transform: none;
  transition: transform 1.05s .34s cubic-bezier(.16,1,.3,1);
}
.hero-slide.is-active .hero-title-line:nth-child(2) .hero-title-text { transition-delay: .45s; }
.hero-slide.is-active .hero-title-text.outline {
  animation: sf-slide-title-shine 5.3s 1.5s ease-in-out infinite !important;
}
.hero-slide.is-active .hero-title-text.outline::after {
  transform: scaleX(1);
  transition: transform 1.1s .96s cubic-bezier(.16,1,.3,1);
}
.hero-slide.is-active .hero-copy {
  opacity: 1;
  filter: blur(0);
  transform: none;
  transition: opacity .72s .68s ease, transform .95s .68s cubic-bezier(.16,1,.3,1), filter .85s .68s ease;
}
.hero-slide.is-active .hero-actions {
  opacity: 1;
  filter: blur(0);
  transform: none;
  transition: opacity .72s .84s ease, transform .95s .84s cubic-bezier(.16,1,.3,1), filter .85s .84s ease;
}
.hero-slide.is-active .hero-stats {
  opacity: 1;
  filter: blur(0);
  transform: none;
  transition: opacity .72s 1s ease, transform 1s 1s cubic-bezier(.16,1,.3,1), filter .85s 1s ease;
}

.hero-slider-controls {
  position: absolute;
  right: max(24px,calc((100vw - 1180px)/2));
  bottom: 48px;
  z-index: 20;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.16);
  border-radius: 999px;
  background: rgba(4,7,11,.62);
  box-shadow: 0 18px 55px rgba(0,0,0,.34);
  backdrop-filter: blur(18px);
}
.hero-slider-button {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  padding: 0;
  border: 1px solid rgba(255,255,255,.17);
  border-radius: 50%;
  background: rgba(255,255,255,.045);
  color: #fff;
  cursor: pointer;
  transition: transform .28s ease, background .28s ease, color .28s ease, border-color .28s ease;
}
.hero-slider-button:hover,
.hero-slider-button:focus-visible {
  color: #07100a;
  background: var(--accent);
  border-color: var(--accent);
  transform: translateY(-2px) scale(1.05);
}
.hero-slider-dots { display: flex; align-items: center; gap: 8px; }
.hero-slider-dot {
  position: relative;
  width: 40px;
  height: 8px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.hero-slider-dot::before {
  content: "";
  position: absolute;
  inset: 3px 0;
  border-radius: 999px;
  background: rgba(255,255,255,.24);
}
.hero-slider-dot::after {
  content: "";
  position: absolute;
  inset: 3px 0;
  border-radius: 999px;
  background: var(--accent);
  transform: scaleX(0);
  transform-origin: left;
}
.hero-slider-dot[aria-current="true"]::after { animation: sf-slider-progress var(--slide-duration,6800ms) linear forwards; }
.hero-slider.is-paused .hero-slider-dot[aria-current="true"]::after { animation-play-state: paused; }
.hero-slide-number {
  min-width: 42px;
  color: rgba(255,255,255,.72);
  font-size: .75rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-align: center;
}
.hero-slide-number strong { color: var(--accent); font-size: 1rem; }
.hero-slider-status {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0,0,0,0);
  white-space: nowrap;
  border: 0;
}

@keyframes sf-slide-kenburns {
  0% { transform: scale(1.24) translate3d(var(--slide-x,3%),0,0); }
  100% { transform: scale(1.055) translate3d(0,0,0); }
}
@keyframes sf-slide-title-shine {
  0%,58% { background-position: 120% 0; }
  78%,100% { background-position: -120% 0; }
}
@keyframes sf-slider-progress { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- FAQ / legal / sitemap ---------- */
.info-layout {
  display: grid;
  grid-template-columns: minmax(220px,.34fr) minmax(0,1fr);
  gap: clamp(34px,6vw,86px);
  align-items: start;
}
.info-aside {
  position: sticky;
  top: 112px;
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: linear-gradient(145deg,rgba(255,255,255,.045),rgba(255,255,255,.015));
}
.info-aside h2 { margin: 0 0 15px; font-size: 1.08rem; }
.info-aside p { margin: 0; color: var(--muted); font-size: .92rem; }
.info-aside nav { margin-top: 20px; }
.info-aside a {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 0;
  border-bottom: 1px solid var(--line);
  color: #cdd3de;
  font-size: .9rem;
}
.info-aside a:hover { color: var(--accent); }
.legal-content { display: grid; gap: 20px; }
.legal-section,
.faq-category,
.sitemap-card {
  scroll-margin-top: 120px;
  padding: clamp(24px,4vw,42px);
  border: 1px solid var(--line);
  border-radius: 24px;
  background: linear-gradient(145deg,rgba(255,255,255,.05),rgba(255,255,255,.015));
  box-shadow: 0 22px 80px rgba(0,0,0,.16);
}
.legal-section h2,
.faq-category h2,
.sitemap-card h2 { margin: 0 0 14px; font-size: clamp(1.25rem,2.2vw,1.72rem); }
.legal-section h3 { margin: 28px 0 10px; font-size: 1.02rem; }
.legal-section p,
.legal-section li,
.sitemap-card p { color: #c6ccd7; }
.legal-section ul,
.legal-section ol { padding-left: 1.35em; }
.legal-note {
  padding: 16px 18px;
  border-left: 3px solid var(--accent);
  background: rgba(183,255,54,.055);
  color: #dbe2ec;
  font-size: .9rem;
}
.faq-page-list { display: grid; gap: 12px; }
.faq-page-list details {
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.025);
  overflow: hidden;
}
.faq-page-list summary {
  position: relative;
  padding: 22px 58px 22px 24px;
  color: #fff;
  font-size: 1rem;
  font-weight: 800;
  cursor: pointer;
  list-style: none;
}
.faq-page-list summary::-webkit-details-marker { display: none; }
.faq-page-list summary::after {
  content: "+";
  position: absolute;
  right: 23px;
  top: 50%;
  color: var(--accent);
  font-size: 1.55rem;
  line-height: 1;
  transform: translateY(-50%);
  transition: transform .3s ease;
}
.faq-page-list details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.faq-page-list details p { margin: 0; padding: 0 24px 24px; color: #c5ccd7; }
.sitemap-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.sitemap-card ul { margin: 18px 0 0; padding: 0; list-style: none; }
.sitemap-card li + li { border-top: 1px solid var(--line); }
.sitemap-card a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 13px 0;
  color: #dce1ea;
}
.sitemap-card a::after { content: "→"; color: var(--accent); transition: transform .25s ease; }
.sitemap-card a:hover { color: var(--accent); }
.sitemap-card a:hover::after { transform: translateX(5px); }

@media (max-width: 980px) {
  .hero-slider-controls { right: 24px; bottom: 28px; }
  .hero-slide .hero-content { padding-bottom: 120px; }
  .info-layout { grid-template-columns: 1fr; }
  .info-aside { position: static; }
}
@media (max-width: 760px) {
  .hero-slider { min-height: 100svh; }
  .hero-slide .hero-media::after {
    background: linear-gradient(0deg,#07090d 0%,rgba(2,4,8,.78) 58%,rgba(2,4,8,.25) 100%), radial-gradient(circle at 70% 24%,rgba(183,255,54,.11),transparent 33%);
  }
  .hero-slide .hero-content { justify-content: flex-end; padding: 122px 0 118px; }
  .hero-slider .hero-title { margin: 17px 0 22px; font-size: clamp(2.85rem,13.2vw,4.15rem); line-height: .98; }
  .hero-title-text { white-space: normal; }
  .hero-slider .hero-copy { font-size: .95rem; line-height: 1.82; }
  .hero-slider .hero-stats { margin-top: 34px; }
  .hero-slider-controls { left: 20px; right: auto; bottom: 20px; gap: 8px; }
  .hero-slider-button { width: 38px; height: 38px; }
  .hero-slider-dot { width: 27px; }
  .hero-slide-number { display: none; }
  .sitemap-grid { grid-template-columns: 1fr; }
  .legal-section,.faq-category,.sitemap-card { padding: 22px; border-radius: 19px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-slide,.hero-slide .hero-media img,.hero-slider .hero-kicker,.hero-slider .hero-title-line,.hero-title-text,.hero-slider .hero-copy,.hero-slider .hero-actions,.hero-slider .hero-stats { transition: none !important; animation: none !important; }
  .hero-slide.is-active .hero-media img { transform: scale(1.06); }
  .hero-slide.is-active .hero-kicker,.hero-slide.is-active .hero-title-line,.hero-slide.is-active .hero-copy,.hero-slide.is-active .hero-actions,.hero-slide.is-active .hero-stats { opacity: 1; filter: none; transform: none; }
  .hero-slide.is-active .hero-title-text { transform: none; }
  .hero-slider-dot[aria-current="true"]::after { transform: scaleX(1); }
}
/* Keep the global dark gradient above imagery but below slide copy. */
.hero-slider .hero-slides { z-index: auto; }
.hero-slider .hero-slide {
  z-index: auto;
  opacity: 1;
  visibility: hidden;
  transition: visibility .9s step-end;
}
.hero-slider .hero-slide.is-active {
  z-index: auto;
  opacity: 1;
  visibility: visible;
  transition: visibility 0s step-start;
}
.hero-slider .hero-slide .hero-media { opacity: 0; transition: opacity .9s ease; }
.hero-slider .hero-slide.is-active .hero-media { opacity: 1; }
.hero-slider .hero-slide .hero-media::after { display: none !important; animation: none !important; }
.sf-v5 .site-header { position: fixed !important; inset: 0 0 auto; }
/* Correct legacy blanket body-child positioning for fixed UI layers. */
.sf-v5 .skip-link { position: fixed !important; }
.sf-v5 .sf-intro { position: fixed !important; }
.sf-v5 .sf-scroll-rail { position: fixed !important; }
.sf-v5 .sf-pointer-halo { position: fixed !important; }
.hero-slide--1 { --slide-position: 62% center; --slide-x: 4%; }
.hero-slide--2 { --slide-position: 52% center; --slide-x: -4%; }
.hero-slide--3 { --slide-position: 58% center; --slide-x: 3%; }
@media (max-width: 760px) {
  .hero-slider .hero-stats {
    grid-template-columns: repeat(3,minmax(0,1fr));
    width: 100%;
    max-width: none;
    margin-top: 32px;
  }
  .hero-slider .stat { min-width: 0; padding: 15px 7px 14px 0; }
  .hero-slider .stat + .stat { padding-left: 10px; }
  .hero-slider .stat strong { font-size: clamp(1.05rem,6vw,1.5rem); white-space: nowrap; }
  .hero-slider .stat span { margin-top: 6px; font-size: .61rem; line-height: 1.35; }
}
.faq-more { margin-top: 24px; }
