/* ==========================================================
   depth inc. コーポレートサイト - 共通スタイル
   Tailwindで表現しにくいスタイルのみ記述
   ========================================================== */

html { scroll-behavior: smooth; scroll-padding-top: 5rem; }
body { font-family: 'Noto Sans JP', sans-serif; -webkit-font-smoothing: antialiased; }
.hero-grid {
  background-image:
    linear-gradient(rgba(10,26,58,0.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(10,26,58,0.05) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at 30% 40%, #000 20%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse at 30% 40%, #000 20%, transparent 75%);
}
.logo-helv {
  font-family: "Helvetica Neue", Helvetica, Arial, "Liberation Sans", sans-serif;
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1;
}
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s ease, transform .8s ease; }
.reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}
.nav-link { position: relative; }
.nav-link::after { content:''; position:absolute; left:0; bottom:-6px; height:2px; width:0; background:#8f6a12; transition:width .3s ease; }
.nav-link:hover::after { width:100%; }
.card-img { transition: transform .7s ease; }
.problem-card:hover .card-img { transform: scale(1.06); }

.nav-link.is-current::after { width:100%; }
details > summary { list-style:none; }
details > summary::-webkit-details-marker { display:none; }
details[open] .faq-plus { transform: rotate(45deg); }