/* FV下の白い余白を削除 */
.hero-bg,
.hero-grid {
  bottom: 0;
}

/* FVとAbout Usの重なり順を調整 */
.hero {
  position: relative;
  z-index: 1;
}

.intro {
  position: relative;
  z-index: auto;
  isolation: auto;
  overflow: visible;
}

/* 英文をFVより前面へ */
.about-marquee {
  top: -55px;
  z-index: 10;
	color: #d8e4ee !important;
  opacity: 0.5;
  font-size: clamp(80px, 10vw, 160px);
}

/* 地図をAbout Us内の最背面へ */
.about-map {
  position: relative;
  z-index: 0;
  pointer-events: none;
}

/* タイトル・本文を地図より前面へ */
.intro-main {
  position: relative;
  z-index: 2;
}

/* FV下の英文：数字を大きくすると遅く、小さくすると速くなる */
.about-marquee-track {
  animation-duration: 50s;
}

/* スマホ */
@media (max-width: 700px) {
  .about-marquee-track {
    animation-duration: 50s;
  }
}

/* PC：右へ100px、上へ180px */
.about-map {
  transform: translate(100px, -180px) !important;
}

/* タブレット */
@media (max-width: 900px) {
  .about-map {
    transform: translate(70px, -110px) !important;
  }
}

/* スマホ */
@media (max-width: 560px) {
  .about-map {
    transform: translate(35px, -70px) !important;
  }
}

/*Works上のイラストの透明度*/
.landscape-break img {
  opacity: 0.2 !important;
}

/*Works右側の写真を右寄せ*/
.works-photo {
  justify-self: end;
  margin-right: 0 !important;
}

footer > div p,
.footer-links {
  font-weight: 500;
}

/* 対象：ヘッダーのお問い合わせ・工事実績を見る */
.site-header .nav-contact,
.works-copy > a {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  transition:
    translate 0.3s ease,
    box-shadow 0.3s ease;
}

/* きらりと横切る光 */
.site-header .nav-contact::before,
.works-copy > a::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: -50%;
  left: -70%;
  width: 45%;
  height: 200%;
  pointer-events: none;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(255, 255, 255, 0.65),
    transparent
  );
  transform: skewX(-25deg);
  animation: buttonShine 5s ease-in-out infinite;
}

/* 白いヘッダーボタンには淡い青の光 */
.site-header .nav-contact::before {
  background: linear-gradient(
    90deg,
    transparent,
    rgba(95, 145, 196, 0.3),
    rgba(255, 255, 255, 0.9),
    transparent
  );
}

/* 2つのボタンの発光タイミングをずらす */
.works-copy > a::before {
  animation-delay: 1.5s;
}

@keyframes buttonShine {
  0%, 70% {
    left: -70%;
    opacity: 0;
  }
  72% {
    opacity: 1;
  }
  92% {
    left: 130%;
    opacity: 1;
  }
  100% {
    left: 130%;
    opacity: 0;
  }
}

/* 矢印の動き */
.site-header .nav-contact svg,
.works-copy > a svg {
  transition: translate 0.3s ease;
}

/* マウスを重ねたとき */
@media (hover: hover) {
  .site-header .nav-contact:hover,
  .works-copy > a:hover {
    translate: 0 -3px;
    box-shadow: 0 8px 20px rgba(0, 57, 137, 0.2);
  }

  .site-header .nav-contact:hover svg {
    translate: 3px -3px;
  }

  .works-copy > a:hover svg {
    translate: 5px 0;
  }
}

/* キーボードで選択したとき */
.site-header .nav-contact:focus-visible,
.works-copy > a:focus-visible {
  outline: 3px solid #5f91c4;
  outline-offset: 4px;
}

/* 動きを減らす設定の場合 */
@media (prefers-reduced-motion: reduce) {
  .site-header .nav-contact::before,
  .works-copy > a::before {
    display: none;
  }

  .site-header .nav-contact,
  .works-copy > a,
  .site-header .nav-contact svg,
  .works-copy > a svg {
    transition: none;
    translate: none;
  }
}

/* ヘッダーを追従 */
.site-header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 110px;
  padding: 0 40px;
  z-index: 1000;
  background: transparent;
  transition:
    background-color 0.3s ease,
    box-shadow 0.3s ease;
}

/* ロゴ側の白背景 */
.site-header::before {
  left: 0;
  top: 0;
  width: min(370px, 30vw);
  height: 110px;
  border-radius: 0 0 24px 0;
  background: #fff;
}

/* お問い合わせ：青背景・白文字 */
.site-header .desktop-nav .nav-contact {
  background: #003989;
  color: #fff;
  border: 0;
  border-radius: 12px;
  padding: 22px 28px;
  font-weight: 700;
}

/* FVの角丸 */
.hero-bg,
.hero-grid,
.hero-grid::after {
  border-radius: 20px;
}

/* スクロール後 */
.site-header.is-scrolled {
  background: #fff;
  box-shadow: 0 3px 18px rgba(16, 40, 61, 0.08);
}

.site-header.is-scrolled .desktop-nav {
  color: #10283d;
}

.site-header.is-scrolled .menu-button {
  color: #003989;
}

/* スマホ・タブレット */
@media (max-width: 900px) {
  .site-header {
    height: 76px;
    padding: 0 24px;
  }

  .site-header::before {
    width: 260px;
    max-width: 75vw;
    height: 76px;
    border-radius: 0 0 18px 0;
  }

  .hero-bg,
  .hero-grid,
  .hero-grid::after {
    border-radius: 14px;
  }

  .site-header.is-scrolled .desktop-nav.is-open {
    color: #fff;
  }
}

/* WordPress管理バー表示中 */
.admin-bar .site-header {
  top: 32px;
}

@media (max-width: 782px) {
  .admin-bar .site-header {
    top: 46px;
  }
}

@media (max-width: 600px) {
  .admin-bar .site-header.is-scrolled {
    top: 0;
  }
}

/* FVの切り欠きをロゴ背景の位置に合わせる */
.hero {
  --hero-corner-radius: 20px;
}

/* ロゴ背景の右上に続く角丸 */
.hero .hero-corner-top {
  left: min(370px, 30vw);
  top: 18px;
}

/* ロゴ背景の下に続く左側の角丸 */
.hero .hero-corner-left {
  left: 18px;
  top: 110px;
}

/* スマホ・タブレット */
@media (max-width: 900px) {
  .hero {
    --hero-corner-radius: 14px;
  }

  .hero .hero-corner-top {
    left: min(260px, 75vw);
    top: 18px;
  }

  .hero .hero-corner-left {
    left: 18px;
    top: 76px;
  }
}

@media (min-width: 901px) {
  .site-header .desktop-nav {
    position: relative;
    top: 15px;
    transition: top 0.3s ease;
  }

  .site-header.is-scrolled .desktop-nav {
    top: 0;
  }
}

/* Consolidated motion updates */
.site-header .nav-contact::before,.works-copy>a::before{animation-iteration-count:1;animation-fill-mode:forwards}
.section-title-motion .title-line{display:block;overflow:hidden;padding-bottom:.1em;margin-bottom:-.1em}
.section-title-motion .title-char{display:inline-block;white-space:pre;opacity:0;transform:translateY(100%) skewX(12deg);transition:opacity 1s cubic-bezier(.36,.14,0,1),transform 1s cubic-bezier(.36,.14,0,1);transition-delay:var(--char-delay,0ms)}
.section-title-motion.title-visible .title-char{opacity:1;transform:translateY(0) skewX(0)}
.motion-ready .about-map.map-motion{opacity:0;filter:blur(10px);transition:opacity 1s ease-out,filter 1s ease-out}
.motion-ready .about-map.map-motion.is-visible{opacity:1;filter:blur(0)}
.motion-ready .company dl.company-table-motion{opacity:0;transform:translateY(25px);transition:opacity .9s ease,transform .9s ease}
.motion-ready .company dl.company-table-visible{opacity:1;transform:translateY(0)}
.site-header.is-scrolled .desktop-nav>a:not(.nav-contact)::after{background:#003989}
.site-header.is-scrolled .desktop-nav>a:not(.nav-contact):hover::after,
.site-header.is-scrolled .desktop-nav>a:not(.nav-contact):focus-visible::after{width:100%}
.site-header{transition:transform .3s ease,background-color .3s ease,box-shadow .3s ease}
.site-header.header-hidden{transform:translateY(calc(-100% - 50px));pointer-events:none}
.site-header:not(.header-hidden){transform:translateY(0)}
@media(prefers-reduced-motion:reduce){
  .section-title-motion .title-char{opacity:1;transform:none;transition:none}
  .motion-ready .about-map.map-motion{opacity:1;filter:none;transition:none}
  .motion-ready .company dl.company-table-motion{opacity:1;transform:none;transition:none}
  .site-header{transition:none}
}