/* ---- トップページ専用スタイル ----
   Gemini案（見出しoverlay非表示・hero全幅フラット構成）＋種別スポットライト演出。
   ブランド色（--accent）やbadge等の共通トークンはbase.cssを継続利用し、
   ここではトップページに固有のレイアウト・部品のみを定義する。 */

.home-hero-card{ margin:0 0 14px; }

/* hero: 種別スポットライト演出。4枚の画像は実サイズの縦横比(約2.95:1)そのままで、
   切り取らずに全幅表示する（aspect-ratioをその比率に合わせているため object-fit:cover でも
   実質クロップは発生しない）。 */
.home-hero{
  position:relative;
  width:100%;
  aspect-ratio:1600/543;
  overflow:hidden;
  border-radius:var(--radius);
  background-color:#64748b;
}
.home-hero-spotlight{ position:absolute; inset:0; }
.home-hero-spotlight-layer{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; opacity:0;
  transition:opacity .45s ease;
}
.home-hero-spotlight-layer.is-active{ opacity:1; }

/* Gemini案：hero上の装飾見出しは表示しない。ページの実h1は .sr-only-heading が担う。
   admin側の動的hero文言・画像設定（home_dynamic_hero.js）は当面この構造の外側にあり、
   見た目には反映されない（3.3の合意事項）。 */
.home-hero-inner{ display:none; }

/* 検索カード：カード枠・影なしのフラット構成 */
.home-search-card{
  padding:18px 0 4px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.field-label{
  display:block;
  font-size:13px;
  font-weight:700;
  color:var(--muted);
  margin-bottom:6px;
  letter-spacing:.02em;
}

/* 種別セグメント（すべて／駐車場／バイク／駐輪場） */
.type-seg{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border:1.5px solid #adbaca;
  border-radius:16px;
  overflow:hidden;
  background:#fff;
  margin:0;
  padding:0;
}
.type-seg-item{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:64px;
  padding:8px 6px;
  cursor:pointer;
  font-size:23.25px;
  font-weight:700;
  color:var(--text);
  text-align:center;
  border-left:1.5px solid #adbaca;
  transition:background .15s ease, color .15s ease;
}
.type-seg-item:first-child{ border-left:none; }
.type-seg-item input{ position:absolute; opacity:0; pointer-events:none; }
.type-seg-item:hover{ background:#f8fafc; }
.type-seg-item:has(input:checked){
  background:color-mix(in srgb, var(--cta) 10%, white);
  color:var(--cta);
  box-shadow:inset 0 0 0 2px var(--cta);
}
.type-seg-item:has(input:focus-visible){
  outline:2px solid var(--cta);
  outline-offset:-4px;
}
@media (max-width:600px){
  .type-seg-item{
    font-size:15.75px;
    min-height:60px;
    padding:8px 2px;
    white-space:nowrap;
  }
}

/* 掲載者向けボタン：PCのみ表示（スマホは検索導線を優先し非表示。フッターの「掲載者の方へ」は維持） */
.pub-cta{
  margin-top:14px;
  display:flex;
  justify-content:center;
}
@media (max-width:767px){
  .pub-cta{ display:none; }
}