/* ============================================
   札幌新陽高等学校 オープンスクール LP
   カスタムCSS
   ============================================ */

   
/* 方眼紙風の背景パターン */
.bg-grid {
  background-color: #ffffff;
  background-image:
    linear-gradient(to right, rgba(46, 125, 161, 0.10) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(46, 125, 161, 0.10) 1px, transparent 1px);
  background-size: 22px 22px;
}

/* 画像差し替え用プレースホルダー */
.ph {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background:
    repeating-linear-gradient(45deg, rgba(46,125,161,.06) 0 14px, rgba(46,125,161,.12) 14px 28px);
  color: #4a667a;
  font-weight: 700;
  letter-spacing: .02em;
}

/* スクロールスナップのカルーセル */
.snap-x {
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.snap-x::-webkit-scrollbar { display: none; }
.snap-item { scroll-snap-align: center; }

/* details（アコーディオン）の＋／－トグル */
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }
.acc-icon::before { content: "＋"; }
details[open] .acc-icon::before { content: "－"; }

/* 滑らかなスクロール（ナビアンカー用） */
html {
  scroll-behavior: smooth;
  scroll-padding-top: 72px;
}

/* フォーカスリング（アクセシビリティ対応） */
a:focus-visible,
button:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #FCD500;
  outline-offset: 2px;
  border-radius: 4px;
}

/* ロード時の段階的フェードイン */
@media (prefers-reduced-motion: no-preference) {
  .reveal {
    opacity: 0;
    transform: translateY(14px);
    transition: opacity .6s ease, transform .6s ease;
  }
  .reveal.in {
    opacity: 1;
    transform: none;
  }
}