/*
Theme Name: BAKU Block Theme
Theme URI: https://baku-inc.jp
Author: BAKU Inc.
Author URI: https://baku-inc.jp
Description: BAKU Inc.のFSE対応ブロックテーマ（Full Site Editing）
Requires at least: 6.0
Tested up to: 6.4
Requires PHP: 7.4
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: baku-block
*/

/* カスタムプロパティ ========================================================================================================= */
:root{
  --deep-navy:#0D172B;
  --ocean-blue:#1E3A8A;
  --sky-blue:#3B82F6;
}

/* グローバルスタイル ========================================================================================================= */
*{margin:0;padding:0;box-sizing:border-box;}
html,body{height:100%;}

body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif;
  line-height:1.6;
  color:#333;
  background:
    linear-gradient(90deg,
      var(--deep-navy) 0%,
      #152951 20%,
      var(--ocean-blue) 35%,
      #2c5fb8 42%,
      #2563eb 50%,
      #2c5fb8 58%,
      var(--ocean-blue) 65%,
      #152951 80%,
      var(--deep-navy) 100%);
}

/* ブロックテーマ：フッターを下へ */
.wp-site-blocks{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}
.wp-site-blocks>main{flex:1 0 auto;}
.wp-site-blocks>.wp-block-group:first-of-type{flex:1 0 auto;}

/* セクション間の余計な境界線/余白 */
.wp-block-group{border-top:none;}
main,
.wp-site-blocks>.wp-block-group:first-child{border-top:none;margin-top:0;}
.wp-site-blocks>*+*{margin-block-start:0!important;}

/* ヘッダースタイル ========================================================================================================= */
.wp-block-template-part.site-header,
.site-header{
  position:fixed!important;
  top:0;left:0;right:0;
  z-index:1000;
  padding:25px 0;
  background:linear-gradient(180deg,
    rgba(13,23,43,.85) 0%,
    rgba(13,23,43,.6) 30%,
    rgba(13,23,43,.3) 60%,
    rgba(13,23,43,.15) 80%,
    transparent 100%)!important;
  backdrop-filter:blur(10px);
  transition:all .3s;
}
.site-header.scrolled{
  padding:15px 0;
  box-shadow:0 2px 20px rgba(0,0,0,.1);
  background:rgba(13,23,43,.95)!important;
}
.header-container{
  max-width:1400px;
  margin:0 auto;
  padding:0 40px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}
.wp-block-site-title a{
  font-size:24px;
  font-weight:700;
  color:#fff!important;
  text-decoration:none;
  letter-spacing:.5px;
}
.wp-block-navigation ul{
  display:flex;
  gap:40px;
  list-style:none;
}
.wp-block-navigation a{
  color:rgba(255,255,255,.9)!important;
  text-decoration:none;
  font-size:15px;
  font-weight:500;
  transition:color .3s;
}
.wp-block-navigation a:hover{color:var(--sky-blue)!important;}

/* レスポンシブナビ（ハンバーガー） ========================================================================================================= */
.wp-block-navigation__responsive-container.is-menu-open,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content{
  background:rgba(13,23,43,.98)!important;
  color:#fff!important;
  z-index:2000;
}

.wp-block-navigation__responsive-container.is-menu-open
.wp-block-navigation__responsive-container-content{
  max-height:none!important;
  overflow:visible!important;
  width:100%;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container{
  display:flex!important;
  flex-direction:column!important;
  justify-content:center;
  align-items:center;
  gap:16px;
  padding:24px 32px;
  margin:0;
  list-style:none;
}

.wp-block-navigation__responsive-container.is-menu-open
ul.wp-block-navigation__container a{
  color:#fff!important;
  font-size:18px;
  font-weight:500;
  text-decoration:none;
}

.wp-block-navigation__responsive-container.is-menu-open button.wp-block-navigation__responsive-container-close{
  color:#fff!important;
}

.wp-block-navigation__responsive-container.is-menu-open{
  position:fixed!important;
  inset:0;
  width:100vw;
  height:100vh;
  display:flex;
  justify-content:center;
  align-items:center;
  background:rgba(13,23,43,.96)!important;
  z-index:2000;
}

.has-modal-open{overflow:hidden;}
.wp-block-navigation__responsive-container.is-menu-open nav.wp-block-navigation{width:100%;}

/* ヒーロースタイル ========================================================================================================= */
.hero-section,
.mirror-section{
  background:transparent!important;
  margin-top:0!important;
  margin-bottom:0!important;
}

.hero-section{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  position:relative;
  padding:120px 40px 80px;
  margin-bottom:0!important;
  border-bottom:none!important;
  overflow:hidden;
}

/* ヒーローだけラジアル */
.hero-section::before{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse 80% 60% at center 45%,
    rgba(59,130,246,.75) 0%,
    rgba(59,130,246,.6) 15%,
    rgba(59,130,246,.4) 35%,
    rgba(59,130,246,.2) 55%,
    rgba(59,130,246,.08) 65%,
    transparent 75%);
  pointer-events:none;
  z-index:-1;
}

.hero-content{
  max-width:900px;
  text-align:center;
  color:#fff;
  position:relative;
  z-index:1;
}

.hero-section h1{
  font-size:clamp(32px,5vw + 8px,72px);
  font-weight:700;
  margin-bottom:30px;
  line-height:1.1;
  letter-spacing:-1px;
  color:#fff;
}

.hero-section .hero-description{
  font-size:clamp(16px,1.4vw + 10px,22px);
  margin-bottom:16px;
  color:rgba(255,255,255,.95);
  line-height:1.6;
}

.hero-section .hero-subtitle{
  font-size:clamp(14px,1.0vw + 9px,18px);
  color:rgba(255,255,255,.85);
  margin-bottom:40px;
  line-height:1.6;
}

/* ヒーロー直下の余白/境界線を殺す */
.hero-section .wp-block-group,
.hero-section .wp-block-cover{margin-bottom:0!important;}
.hero-section + *{
  margin-top:0!important;
  padding-top:0!important;
  border-top:none!important;
  background:transparent!important;
}
.hero-section + .wp-block-group,
.hero-section + .wp-block-cover,
.hero-section + .wp-block-spacer{
  margin:0!important;
  padding-top:0!important;
  padding-bottom:0!important;
  border:0!important;
  background:transparent!important;
}

.hero-section + .wp-block-group > .wp-block-spacer:first-child{
  margin:0!important;
  height:0!important;
}

.hero-section + .wp-block-group > *:first-child{
  margin-top:0!important;
  padding-top:0!important;
}

/* CTA */
.wp-block-button.cta-button .wp-block-button__link,
.cta-button{
  display:inline-block;
  padding:18px 50px;
  background:rgba(59,130,246,.3)!important;
  color:#fff!important;
  text-decoration:none;
  border-radius:50px;
  font-size:18px;
  font-weight:600;
  border:2px solid rgba(59,130,246,.5)!important;
  transition:all .3s;
  backdrop-filter:blur(10px);
}

.wp-block-button.cta-button .wp-block-button__link:hover,
.cta-button:hover{
  background:rgba(59,130,246,.5)!important;
  border-color:var(--sky-blue)!important;
  transform:translateY(-2px);
}

.wp-block-button.cta-button{
  border:none!important;
  box-shadow:none!important;
  background:transparent!important;
  padding:0!important;
}

.wp-block-button.cta-button .wp-block-button__link{border:2px solid rgba(59,130,246,.5)!important;}
.wp-block-button.cta-button .wp-block-button__link:focus{outline:none!important;box-shadow:none!important;}

/* スクロールインジケーター */
.scroll-indicator{
  position:absolute;
  bottom:40px;
  left:50%;
  transform:translateX(-50%);
  color:#fff;
  text-align:center;
}

.scroll-arrow{
  width:30px;height:50px;
  border:2px solid rgba(255,255,255,.6);
  border-radius:15px;
  margin:0 auto;
  position:relative;
}

.scroll-arrow::after{
  content:"";
  position:absolute;
  top:10px;
  left:50%;
  transform:translateX(-50%);
  width:6px;height:6px;
  background:rgba(255,255,255,.8);
  border-radius:50%;
  animation:scroll 2s infinite;
}

@keyframes scroll{
  0%{top:10px;opacity:1;}
  100%{top:30px;opacity:0;}
}

/* 共通セクション（ミラー） ========================================================================================================= */
.mirror-section{
  padding:100px 40px;
  color:#fff;
}

.section-container{max-width:1200px;margin:0 auto;}
.section-title{
  font-size:48px;
  font-weight:700;
  text-align:center;
  margin-bottom:40px;
  letter-spacing:-.5px;
  color:#fff;
}

.section-description{
  font-size:18px;
  line-height:1.8;
  color:rgba(255,255,255,.9);
  max-width:800px;
  margin:0 auto 40px;
  text-align:center;
}

/* TOPページ========================================================================================================================
    hero-section
      hero-content
        hero-main-title
        hero-description
        hero-subtitle
        cta-button
        scroll-indicator
          scroll-arrow
    mirror-section (Services)
      section-container
        section-title
        section-description
        services-grid
          service-card
            service-header
            service-icon
    mirror-section (Approach)
      section-container
        section-title
        section-description
        approach-steps
          step-card
            step-number
    mirror-section (Works)
      section-container
        section-title
    mirror-section (CTA)
      section-container
        cta-button
======================================================================================================================== */
.services-grid,
.results-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:40px;
  margin-top:40px;
}

.service-card,
.result-card{
  background:rgba(255,255,255,.05);
  padding:40px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.1);
  transition:all .3s;
  backdrop-filter:blur(10px);
}

.service-card:hover,
.result-card:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(59,130,246,.3);
  transform:translateY(-5px);
}

.service-card h3{
  color:#fff;
  font-size:24px;
  font-weight:600;
  margin:0 0 14px;
  line-height:1.35;
}

.service-card p{
  color:rgba(255,255,255,.82);
  line-height:1.7;
}

.result-number{font-size:48px;font-weight:700;color:var(--sky-blue);margin-bottom:10px;}
.result-card p{color:rgba(255,255,255,.82);line-height:1.7;}

/* サービスカードスタイル ========================================================================================================= */
.service-header{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
}

.service-icon{
  width:40px;
  height:40px;
  flex:0 0 40px;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  border:none;
  background:none;
}

.service-icon img,
.service-icon svg{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  display:block;
  object-fit:contain;
}

.service-icon svg{overflow:visible;}
.service-icon svg *{vector-effect: non-scaling-stroke;}

/* アプローチセクション ========================================================================================================= */
.approach-steps{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:30px;
  margin-top:60px;
}

.step-card{
  text-align:left;
  padding:30px 10px;
}

.step-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:38px;height:38px;
  border-radius:999px;
  background:rgba(59,130,246,.18);
  border:1px solid rgba(59,130,246,.35);
  color:#fff;
  font-weight:700;
  margin-bottom:14px;
}

.step-card h3{
  color:#fff;
  font-size:18px;
  font-weight:600;
  margin:0 0 8px;
}

.step-card p{
  color:rgba(255,255,255,.82);
  margin:0;
  line-height:1.7;
}

/* worksセクション ========================================================================================================= */
.works-filter{max-width:1100px;margin:0 auto 32px;padding:0 24px;}
.works-filter--stack{display:flex;flex-direction:column;align-items:center;gap:18px;}
.works-filter__group{width:100%;max-width:1100px;display:flex;flex-direction:column;align-items:center;gap:10px;}
.works-filter__group-label{
  width:100%;
  text-align:center;
  font-size:13px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(255,255,255,.7);
}

.works-filter__chips{
  width:100%;
  max-width:920px;
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
}

.works-filter__form{display:inline-block;margin:0;padding:0;}

.works-filter__chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:30px;
  padding:0 16px;
  line-height:1;
  box-sizing:border-box;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.6);
  background:rgba(15,23,42,.7);
  color:rgba(248,250,252,.9);
  font-size:12px;
  cursor:pointer;
  white-space:nowrap;
  -webkit-appearance:none;
  appearance:none;
  transition:background .18s ease,border-color .18s ease,color .18s ease;
}

.works-filter__chip-label{display:block;line-height:1;}
.works-filter__chip:hover{border-color:rgba(59,130,246,.9);background:rgba(30,64,175,.8);}
.works-filter__chip.is-active{
  border-color:rgba(59,130,246,.95);
  background:rgba(37,99,235,.95);
  color:#fff;
  box-shadow:0 0 0 1px rgba(15,23,42,.9),0 8px 18px rgba(15,23,42,.65);
}

/* worksカードスタイル ========================================================================================================= */
.results-grid--works > br,
.results-grid--works > p:empty{display:none!important;}

.results-grid.results-grid--works{
  max-width:1100px;
  margin:48px auto 0;
  padding:0 24px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:40px;
  justify-items:stretch;
  align-items:stretch;
}

.result-card.works-card{
  padding:0;
  border-radius:20px;
  overflow:hidden;
  background:rgba(255,255,255,.05); /* rgba(13,23,43,.9) */
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter:blur(8px);
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease;
}

.result-card.works-card:hover{
  transform:translateY(-4px);
  border-color:rgba(59,130,246,.4);
  box-shadow:0 18px 45px rgba(0,0,0,.35);
}

.results-grid--works a,
.results-grid--works a:link,
.results-grid--works a:visited{
  color:#fff !important;
  text-decoration:none !important;
}

.works-card__inner{
  display:flex;
  flex-direction:column;
  height:100%;
  border-radius:20px;
  overflow:hidden;
  min-width:0; /* グリッド内でカードがはみ出さない */
  margin:0;
  padding:0;
}

.works-card__link{
  display:block;
  line-height:0;
  min-width:0;
  margin:0;
  padding:0;
}

.works-card__thumb{
  width:100%;
  max-width:100%;
  min-width:0;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:20px 20px 0 0; /* カードの上角に揃える */
  background-size:cover;
  background-position:center center;
  background-repeat:no-repeat;
  flex:0 0 auto;
  display:block;
  margin:0;
  padding:0;
  -webkit-backface-visibility:hidden; /* iOSのレンダリング安定 */
  backface-visibility:hidden;
}

.works-card__thumb img,
.works-card__thumb .wp-post-image{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
}

.works-card__body{
  padding:20px 24px 22px;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  color:#fff;
}

.works-card__meta{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin:0 0 2px;
}

.works-card__meta-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.works-card__chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:24px;
  padding:0 10px;
  box-sizing:border-box;
  border-radius:999px;
  border:1px solid rgba(148,163,184,.45);
  background:rgba(15,23,42,.55);
  color:rgba(248,250,252,.92) !important;
  text-decoration:none !important;
  font-size:11px;
  line-height:1;
  white-space:nowrap;
}

.works-card__chip span{display:inline-block;line-height:1;}
.works-card__chip:hover{
  border-color:rgba(59,130,246,.85);
  background:rgba(30,64,175,.55);
}

.works-card__title{
  font-size:18px;
  font-weight:600;
  line-height:1.5;
  color:#fff !important;
  margin:0;
  min-height:calc(1.5em * 2);
  text-decoration:none !important;
}

@media (max-width: 1024px){
  .results-grid.results-grid--works{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:28px;
  }
}

@media (max-width:768px){
  .results-grid.results-grid--works{
    max-width:100%;
    margin-top:32px;
    padding:0 16px;
    grid-template-columns:1fr;
    gap:24px;
    box-sizing:border-box;
  }
  .result-card.works-card{
    min-width:0; /* スマホでカードが親よりはみ出さない */
  }
  .works-card__thumb{
    border-radius:20px 20px 0 0;
  }
}

/* works詳細セクション  ========================================================================================================= */
.single-work .wp-block-post-featured-image{
  overflow: visible;
  display:flex;
  justify-content:center;
}

.single-work .wp-block-post-featured-image img{
  width:100%;
  height:auto;
  object-fit:contain;
  max-width:1100px;
  border-radius:20px;
}

/* フッタースタイル ========================================================================================================= */
.wp-block-template-part.site-footer,
.site-footer{
  background:var(--deep-navy);
  padding:60px 40px 30px;
  color:rgba(255,255,255,.7);
}

.footer-bottom{
  text-align:center;
  padding-top:30px;
  margin-top:40px;
  border-top:1px solid rgba(255,255,255,.1);
  font-size:14px;
}

/* レスポンシブスタイル ========================================================================================================= */
@media (max-width:768px){
  .hero-section{
    padding:96px 16px 40px!important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
  }
  .hero-section .hero-main-title{
    font-size:40px!important;
    line-height:1.25!important;
    letter-spacing:-.5px!important;
  }
  .hero-section .hero-description{font-size:16px!important;line-height:1.7!important;}
  .hero-section .hero-subtitle{font-size:14px!important;line-height:1.7!important;}
  .wp-block-button.cta-button .wp-block-button__link,
  .cta-button{
    width:100%!important;
    max-width:320px!important;
    padding:14px 28px!important;
  }
  .hero-content{order:1;text-align:center;}
  .scroll-indicator{
    order:2;
    position:static!important;
    bottom:auto!important;
    left:auto!important;
    transform:none!important;
    display:flex!important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    margin:24px auto 0!important;
    text-align:center!important;
  }
  .scroll-arrow{width:24px!important;height:40px!important;border-width:1.5px!important;}

  .section-title{font-size:28px;}
  .wp-block-navigation ul{flex-direction:row;gap:20px;}

  .service-card,
  .result-card{padding:32px 12px!important;}
  .result-card.works-card{padding:0!important;} /* Worksカードは余白なし（サムネイルを端まで） */

  /* モバイルではグリッドを1列に */
  .services-grid,
  .results-grid{
    grid-template-columns:1fr !important;
    padding-left:8px!important;
    padding-right:8px!important;
  }
  .approach-steps{
    grid-template-columns:1fr !important;
  }

  /* ブロックエディターのグリッドレイアウトをモバイルで1列に（サービスページ等） */
  .is-layout-grid,
  .wp-block-group.is-layout-grid,
  .wp-block-group[style*="grid-template-columns"]{
    grid-template-columns:1fr !important;
  }
  /* サービスページ：Groupブロックのグリッドを1列に（bodyに .page-slug-services が付く） */
  body.page-slug-services .wp-block-group{
    grid-template-columns:1fr !important;
  }

  .works-filter{padding:0 16px;}
  .works-filter__group-label{font-size:12px;}
  .works-filter__chip{font-size:11px;padding:0 12px;height:28px;}
}


/* Servicesページ========================================================================================================================
    services-section
      section-title
      section-description
      services-items
        service-item
          service-icon
          service-title
          service-description
======================================================================================================================== */

/* Servicesセクション ========================================================================================================= */
.services-section{
  max-width:1100px;
  margin:56px auto 0;
  padding:0 24px;
  color:#fff;
}

/* セクション見出し（事業戦略・コンサルティング等） */
.services-section > .wp-block-heading,
.services-section > h2,
.services-section > h3{
  text-align:center !important;
  color:#fff !important;
  font-size:clamp(22px,2.2vw,30px);
  font-weight:700;
  letter-spacing:-0.3px;
  margin:0 0 12px !important;
}

/* セクション説明（見出し直下の段落） */
.services-section > .wp-block-paragraph,
.services-section > p{
  text-align:center;
  color:rgba(255,255,255,.85) !important;
  max-width:64ch;
  margin:0 auto 22px !important;
  line-height:1.8;
}

/* 区切り線がある場合（任意） */
.services-section > .wp-block-separator{
  margin:14px auto 18px !important;
  opacity:.6;
}

/* グリッド：PCは常に3列（複数行） */
.services-section .service-items{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px 18px !important;
  align-items:stretch;
  margin-top:24px !important;
}

/* タブレット以下：サービスページも1列に */
@media (max-width:1024px){
  .services-section .service-items{
    grid-template-columns:1fr !important;
  }
}

@media (max-width:768px){
  .services-section{
    padding:0 16px;
    margin-top:40px;
  }
  .services-section .service-items{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
}

/* 1カード：service-item（見出し+段落のグループ） */
.services-section .service-item{
  position:relative;
  padding:18px 18px 16px;
  border-radius:18px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(10px);
  transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease;

  /* 中央揃え（希望） */
  text-align:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;

  /* 高さを揃える */
  min-height:132px;
  overflow:hidden;
}

/* 上から薄い光 */
.services-section .service-item::before{
  content:"";
  position:absolute;
  inset:-2px;
  background:radial-gradient(80% 70% at 50% 0%,
    rgba(59,130,246,.18) 0%,
    rgba(59,130,246,0) 60%);
  pointer-events:none;
  opacity:.9;
}

/* hover */
.services-section .service-item:hover{
  transform:translateY(-5px);
  background:rgba(255,255,255,.07);
  border-color:rgba(59,130,246,.35);
  box-shadow:0 18px 45px rgba(0,0,0,.35);
}

/* カード内タイトル */
.services-section .service-item .wp-block-heading{
  color:#fff !important;
  font-size:22px;
  font-weight:700;
  line-height:1.25;
  margin:0 !important;
}

/* カード内説明 */
.services-section .service-item .wp-block-paragraph,
.services-section .service-item p{
  color:rgba(255,255,255,.82) !important;
  line-height:1.65;
  margin:0 !important;
  max-width:28ch;
  font-size:14px;
}

/* Contactページ========================================================================================================================
    contact-section
      section-title
      section-description
      contact-panel
        form
          label
            input[type="text"]
            input[type="email"]
            input[type="tel"]
            textarea
            input[type="submit"]
/* Contact セクション全体を中央寄せ＆幅を少し絞る */

.contact-panel {
  max-width: 560px;
  margin: 0 auto 64px; /* 中央寄せ + 下に余白 */
  padding: 28px 32px 32px;
  background: rgba(255,255,255,.05);   /* rgba(13, 23, 43, 0.88) */
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.10);
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.35);
  backdrop-filter: blur(12px);
  text-align: left;  /* ラベルや入力は左揃え */
}

/* Contact Form 7 / デフォルトフォームどちらでも効くように幅と間隔をそろえる */
.contact-panel form {
  display: grid;
  row-gap: 16px;
}

/* ラベル */
.contact-panel label {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.9);
  margin-bottom: 4px;
}

/* テキスト系の入力 */
.contact-panel input[type="text"],
.contact-panel input[type="email"],
.contact-panel input[type="tel"],
.contact-panel textarea {
  width: 100%;
  padding: 10px 12px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.25);
  background: rgba(0, 0, 0, 0.25);
  color: #fff;
  font-size: 14px;
  outline: none;
}

/* フォーカス時のアクセント（サイトのブルーに合わせる） */
.contact-panel input[type="text"]:focus,
.contact-panel input[type="email"]:focus,
.contact-panel input[type="tel"]:focus,
.contact-panel textarea:focus {
  border-color: rgba(59, 130, 246, 0.8);
  box-shadow: 0 0 0 1px rgba(59, 130, 246, 0.5);
}

/* 送信ボタン */
.contact-panel input[type="submit"],
.contact-panel button[type="submit"] {
  margin-top: 8px;
  padding: 10px 24px;
  border-radius: 999px;
  border: 1px solid rgba(13, 23, 43, 0.9); /*#0D172B rgba(13, 23, 43, 0.9)rgba(59, 130, 246, 0.9);*/
  background: rgba(13, 23, 43, 0.75);
  color: #fff;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.25s ease;
}

.contact-panel input[type="submit"]:hover,
.contact-panel button[type="submit"]:hover {
  background: rgba(13, 23, 43, 0.95);
  transform: translateY(-1px);
}

/* テキストエリアの高さ */
.contact-panel textarea {
  min-height: 140px;
  resize: vertical;
}

/* ラベル（会社名 / 氏名 / メールアドレス ...）の文字サイズを少し大きく */
.contact-panel .wpcf7-form label {
  font-size: 16px;             /* 18pxにしてもOK：好みで */
  line-height: 1.6;
  color: #ffffff;
  font-weight: 500;
  display: block;
  margin-bottom: 6px;    /* ラベルと入力欄のすき間 */
}

/* ラベルと入力欄の間隔を作る */
.contact-panel .wpcf7-form .wpcf7-form-control-wrap {
  display: block;
  margin-top: 8px;      /* 「会社名」の文字と入力欄の隙間 */
}

/* フォームの一番下の行（送信ボタンが入っている <p>）を中央寄せ */
.contact-panel .wpcf7-form p:last-of-type {
  text-align: center;
  margin-top: 24px;            /* ボタンの上に少し余白 */
}

/* 送信ボタン自体の見た目（任意：既に設定していれば不要） */
.contact-panel .wpcf7-submit {
  padding: 10px 28px;
  border-radius: 999px;
  font-size: 14px;
  border: none;
  cursor: pointer;
  display: block;      /* 行全体をボタンの行にする */
  margin-left: auto;
  margin-right: auto;  /* 中央揃え */
}

/* Other channels（ソーシャルアイコン）======================================================================================== */
.contact-social {
  text-align: center;
}

/* 見出しの余白調整 */
.contact-social h3 {
  margin-top: 0;
  margin-bottom: 16px;
}

/* アイコンの並び */
.contact-social .wp-block-social-links {
  justify-content: center;
  gap: 16px;
}

/* 丸いアイコンボタンにする */
.contact-social .wp-block-social-link a {
  width: 40px;
  height: 40px;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(13, 23, 43, 0.9);
  border: 1px solid rgba(255, 255, 255, 0.20);
  color: #ffffff;
  transition: all 0.25s ease;
}

/* ホバー時 */
.contact-social .wp-block-social-link a:hover {
  border-color: rgba(59, 130, 246, 0.8);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.35);
  transform: translateY(-2px);
}

/* About .company-profile============================================================================================== */
/* セクション全体の位置だけ管理（背景はページに馴染ませる） */
.company-profile {
  max-width: 640px;
  margin: 56px auto 88px;
  padding: 0 12px;
  color: #ffffff;
}

/* テーブル全体を“カード”にする（枠線はつけない） */
.company-profile .wp-block-table {
  background: rgba(8, 16, 32, 0.85);
  border-radius: 16px;
  border: none;                        /* 外枠の罫線を削除 */
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.38);
  overflow: hidden;
}

/* テーブル本体：スペースだけで整える */
.company-profile table {
  table-layout: fixed;                 /* 内容量に左右されないレイアウトに */
}

/* 行ごとの「うっすら段差」表現 */
.company-profile tbody tr {
  background: rgba(8, 16, 32, 0.0); /* ベースは透明寄り */
}

/* 偶数行にだけごく薄いグラデーション＋インセットシャドウ */
.company-profile tbody tr:nth-child(even) {
  background:
    linear-gradient(
      135deg,
      rgba(59, 130, 246, 0.10),
      rgba(8, 16, 32, 0.85)
    );
  box-shadow:
    inset 0 0.5px 0 rgba(255, 255, 255, 0.04),
    inset 0 -0.5px 0 rgba(0, 0, 0, 0.55);
}

/* 最初の行の上側だけ、うっすらラインを追加してカードの始まり感を出す */
.company-profile tbody tr:first-child {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.06);
}

/* セル共通：罫線なし・余白だけで読みやすく */
.company-profile th,
.company-profile td {
  padding: 10px 18px;
  border: none;                        /* 中の罫線をすべて削除 */
  font-size: 14px;
  line-height: 1.7;
}

/* 左側：項目名 */
.company-profile th {
  font-weight: 500;
  color: rgba(255, 255, 255, 0.78);
  text-align: left;
  white-space: nowrap;
}

/* 右側：内容 */
.company-profile td {
  color: rgba(255, 255, 255, 0.96);
}

/* 左列：項目名（1 : 2 くらいの比率） */
.company-profile table > tbody > tr > th:first-child,
.company-profile table > tbody > tr > td:first-child {
  width: 30% !important;
}

/* 右列：内容 */
.company-profile table > tbody > tr > th:last-child,
.company-profile table > tbody > tr > td:last-child {
  width: 70% !important;
}

/* モバイル調整 */
@media (max-width: 768px) {
  .company-profile {
    max-width: 100%;
    margin: 44px auto 72px;
    padding: 0 10px;
  }

  .company-profile th,
  .company-profile td {
    padding: 8px 12px;
    font-size: 13px;
  }
}

/* About：Member セクション================================================================================================ */  
/*  member-section > section-title > member-grid > member-card > member-photo > member-card-text 
    > member-role / member-name / member-description
======================================================================================================================== */

.member-section {
  max-width: 1100px;
  margin: 0 auto 96px;
  padding: 0 24px;
  color: #ffffff;
}

/* 見出し・リード */
.member-section .section-title {
  font-size: 48px;
  font-weight: 600;
  text-align: center;
  margin-bottom: 16px;
}

/* グリッド：PC 2列 / SP 1列 */
.member-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px 32px;
  justify-items: center;  /* カードを列の中央に */
}

/* カード全体 */
.member-card {
  width: 100%;
  max-width: 640px;
  background: radial-gradient(circle at 0% 0%,
              rgba(59,130,246,0.22),
              rgba(8,16,32,0.96));
  border-radius: 20px;
  padding: 24px 28px;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.45);
  display: grid;
  grid-template-columns: minmax(0px, 200px) minmax(0, 1fr);
  column-gap: 24px;
  align-items: center;
}

/* 左カラム：写真 */
.member-card-left {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
}

/* 3:4 比率の写真（角丸＋トリミング） */
.member-photo {
  position: relative;
  width: 100%;
  max-width: 200px;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  border-radius: 16px;
  background: rgba(15, 23, 42, 0.9);
}

.member-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* 右カラム：役職＋名前＋紹介文 */
.member-card-right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}

/* 役職など 1行だけ少し薄くしたい時用 */
.member-role {
  font-size: 14px;
  letter-spacing: 0.08em;
  color: rgba(255, 255, 255, 0.6);
  margin-bottom: 2px;
  line-height: 1.2; 
}

.member-section .member-name {
  font-size: 22px;
  color: rgba(255, 255, 255, 0.90);
  margin-bottom: 2px;
  line-height: 1.2; 
}

.member-section .member-description {
  font-size: 14px;
  color: rgba(255, 255, 255, 0.75);
  margin-bottom: 2px;
  line-height: 1.4; 
}

/* スマホ：1列＆縦並び */
@media (max-width: 768px) {
  .member-section {
    padding: 0 16px;
    margin-bottom: 72px;
  }

  .member-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .member-card {
    grid-template-columns: 1fr;
    row-gap: 12px;
  }

  .member-photo {
    max-width: 220px;
    margin: 4px auto 8px;
  }

  .member-card .wp-block-heading {
    text-align: center;
  }

  .member-card p {
    text-align: left;
  }
}

/* Worksページ================================================================================================ */  
/* Work 詳細：アイキャッチをトリミングしない（contain）
======================================== */

.work-single{
  padding-top: 120px; /* fixed header 分 */
  padding-bottom: 80px;
  color: #fff;
}

.work-single__hero{
  max-width: 1100px;
  margin: 0 auto 28px;
  padding: 0 24px;
}

.work-single__featured{
  width: 100%;
  height: clamp(280px, 42vw, 520px); /* でかすぎ防止 */
  object-fit: cover;
  object-position: center;
  border-radius: 20px;
  overflow: hidden;
}

.work-single__inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 24px;
}

/* タイトルは白固定 + 上揃え */
.work-single__title{
  color: #fff !important;
  margin: 0 0 12px;
  line-height: 1.2;
}

/* 抜粋（概要） */
.work-single__excerpt{
  color: rgba(255,255,255,.82) !important;
  margin: 14px 0 22px;
}

/* visited 紫・下線対策（Work詳細の範囲だけ） */
.work-single a,
.work-single a:link,
.work-single a:visited{
  color: #fff !important;
}

/* --- Category / Output を “チップ” 化（ラベル無し） --- */
.work-single__meta{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 8px;
  margin: 0 0 4px;
}

.work-single__terms{
  margin: 0 !important;
}

.work-single__terms a{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 28px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid rgba(148,163,184,.45);
  background: rgba(15,23,42,.55);
  color: rgba(248,250,252,.92) !important;
  text-decoration: none !important;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
}

.work-single__terms a:hover{
  border-color: rgba(59,130,246,.85);
  background: rgba(30,64,175,.55);
}

/* 本文（役割など） */
.work-single__content{
  color: rgba(255,255,255,.88) !important;
}

/* 見出しを白に */
.work-single__content h2,
.work-single__content h3{
  color: #fff !important;
  margin-top: 26px;
  margin-bottom: 10px;
}

/* リストの余白を整える */
.work-single__content ul{
  margin: 10px 0 0 1.2em;
}
.work-single__content li{
  margin: 6px 0;
}

/* 1) ブロック「投稿のアイキャッチ画像」を contain に */
.single-work .wp-block-post-featured-image img{
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* 2) もし親が固定高や cover 的な指定を持っていて切れてる場合の保険 */
.single-work .wp-block-post-featured-image{
  overflow: visible;
}

/* 3) 画像を「最大幅内で中央」に（余白が出てもOK前提） */
.single-work .wp-block-post-featured-image{
  display: flex;
  justify-content: center;
}
.single-work .wp-block-post-featured-image img{
  max-width: 1100px; /* 好みで調整 */
  border-radius: 20px; /* 既存の角丸に合わせるなら */
}