/* トップページ（index.html）だけの見た目（2026-11-09）
   style.css のあとに読みます。style.css は全ページ共用なので、トップだけの変更はここに足します。 */

/* ---------- ヘッダーの下のイベントの帯（中身は data/news.js） ---------- */
.ev-band{
  display:flex;align-items:center;justify-content:center;gap:.6em;
  background:var(--accent);color:var(--paper);
  font-size:.8rem;letter-spacing:.08em;line-height:1.5;
  padding:9px var(--gut);text-decoration:none;
}
.ev-band[hidden]{display:none;}
.ev-band .tx{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ev-band .ar{flex:none;}
.ev-band:hover .tx{text-decoration:underline;text-underline-offset:3px;}
.ev-band:focus-visible{outline:2px solid var(--ink);outline-offset:-4px;}

/* ---------- トップ写真のスライド（10枚。丸のかわりに「3 / 10」） ---------- */
.atelier-hero .hero-photo .hs{transition:opacity .6s ease;}
.atelier-hero .hero-count{
  position:absolute;left:50%;bottom:12px;transform:translateX(-50%);z-index:4;
  margin:0;height:36px;padding:0 14px;display:flex;align-items:center;gap:.45em;
  background:var(--ink);color:var(--paper);border-radius:2px;
  font-family:var(--latin);font-size:1rem;letter-spacing:.08em;font-variant-numeric:tabular-nums;
}
.atelier-hero .hero-count .sl{opacity:.7;}
/* スマホでも前後のボタンを出す（スワイプと両方で替えられる） */
@media(max-width:900px){
  .atelier-hero .hero-arw{display:grid;width:40px;height:40px;}
}
@media(prefers-reduced-motion:reduce){
  .atelier-hero .hero-photo .hs{transition:none;}
}

/* ---------- MADE TO MEASURE（全幅の写真） ----------
   写真全体の暗いフィルターを弱め（.45 → .12）、文字の後ろにだけ半透明の帯を敷く。
   PC は文字を右に寄せ（犬は左に置く写真を選ぶ）、スマホは写真の下に文字を出して、犬の顔にかからないようにする。 */
.band.band-bright{place-items:center end;min-height:min(72vh,620px);}
.band.band-bright>img{object-position:var(--band-pos,50% 30%);}
.band.band-bright .veil{opacity:.12;}
.band.band-bright .inner{
  margin:clamp(28px,4vw,56px) clamp(24px,6vw,96px);
  padding:clamp(24px,3vw,36px) clamp(24px,3vw,40px);
  background:rgba(70,60,52,.62);border-radius:2px;max-width:34em;
}
.band.band-bright .inner p.lead{font-size:clamp(17px,1.7vw,23px);margin-bottom:1.2em;}
/* スマホは、写真を上・文字を下に分けて、顔に文字が重ならないようにする */
@media(max-width:600px){
  .band.band-bright{display:block;min-height:0;background:var(--ink);}
  .band.band-bright>img{position:static;display:block;height:auto;aspect-ratio:4/3;
    object-position:var(--band-pos-sp,var(--band-pos,50% 30%));}
  .band.band-bright .veil{display:none;}
  .band.band-bright .inner{margin:0;max-width:none;border-radius:0;background:var(--ink);padding:30px var(--gut) 36px;}
  .band.band-bright .inner p.lead{font-size:.95rem;letter-spacing:.06em;}
}

/* 読み上げだけに出す文字 */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* 犬服についての下の「料金を見る」の入口（#price）。2026-11-10 UX-06・UX-15 */
.items-price{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px;margin-top:1.6em;padding-top:1.6em;border-top:1px solid var(--line-soft);}
.items-price .small{margin:0;flex:1 1 20em;}
@media(max-width:480px){.items-price .btn{width:100%;text-align:center;}}