/* 実際の沢（写真・動画ギャラリー） 2026-10-13 b — トップの現地確認の1件目の直前 */
.sawa-gallery{background:var(--granite);padding:clamp(40px,5.4vw,66px) 0 clamp(36px,4.8vw,58px)}
.sg-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:20px 48px;margin-bottom:clamp(14px,1.8vw,22px)}
.sg-head .eyebrow{margin-bottom:10px}
.sg-head h2.sec{margin:0 0 14px}
.sg-head .sec-lead{margin:0;max-width:40ch;font-size:14.5px;line-height:1.85}

/* 動画 */
.sg-videos{--h:clamp(300px,31vw,430px);display:flex;gap:clamp(8px,1.1vw,14px)}
.sg-video{margin:0;flex:none;width:calc(var(--h) * var(--ar))}
.sg-frame{position:relative;height:var(--h);border-radius:var(--r);overflow:hidden;background:var(--abyss);box-shadow:var(--shadow)}
.sg-frame video{display:block;width:100%;height:100%;object-fit:cover}
.sg-ctrl{position:absolute;right:10px;bottom:10px;display:flex;gap:8px}
.sg-ctrl button{width:40px;height:40px;padding:0;border:0;border-radius:50%;background:rgba(11,36,41,.62);color:#fff;display:grid;place-items:center;cursor:pointer;transition:background .2s}
.sg-ctrl button:hover{background:rgba(11,36,41,.85)}
.sg-ctrl button:focus-visible{outline:3px solid var(--water-lt);outline-offset:2px}
.sg-ctrl svg{width:18px;height:18px;fill:currentColor}
.sg-video figcaption,.sg-item figcaption{margin-top:9px;font-size:12.5px;line-height:1.7;color:var(--stone)}

/* 写真 */
.sg-grid{display:flex;gap:clamp(8px,1.1vw,14px);align-items:flex-start}
.sg-item{margin:0;min-width:0;flex:var(--ar) 1 0}
.sg-item a{display:block;aspect-ratio:var(--ar);border-radius:var(--r);overflow:hidden;background:var(--line);box-shadow:var(--shadow)}
.sg-item img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.sg-item a:hover img,.sg-item a:focus-visible img{transform:scale(1.035)}
.sg-item a:focus-visible{outline:3px solid var(--water);outline-offset:3px}

@media (max-width:860px){
  .sg-top{grid-template-columns:1fr;align-items:start}
  .sg-head .sec-lead{max-width:none}
  .sg-videos{display:grid;grid-template-columns:.75fr .5625fr;max-width:600px}
  .sg-video{width:auto;min-width:0}
  .sg-frame{height:auto;aspect-ratio:var(--ar)}
}
@media (max-width:640px){
  .sg-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 8px}
  .sg-item--wide{grid-column:1 / -1;order:3}
  .sg-video figcaption,.sg-item figcaption{font-size:11.5px;margin-top:6px}
  .sg-ctrl{right:8px;bottom:8px;gap:6px}
}

/* 写真の拡大表示 */
.sg-dialog{padding:0;border:0;background:transparent;overflow:visible;max-width:96vw;max-height:94vh}
.sg-dialog::backdrop{background:rgba(11,36,41,.9)}
.sg-dialog img{display:block;width:auto;height:auto;max-width:min(96vw,1100px);max-height:82vh;border-radius:var(--r)}
.sg-dialog .sg-cap{margin:10px 2px 0;color:#CFE0DE;font-size:13px;line-height:1.7}
.sg-dialog .sg-close{position:absolute;top:-48px;right:0;width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;font-size:26px;line-height:42px;text-align:center;cursor:pointer}
.sg-dialog .sg-close:focus-visible{outline:3px solid var(--water-lt);outline-offset:2px}
@media (prefers-reduced-motion:reduce){.sg-item img{transition:none}.sg-item a:hover img,.sg-item a:focus-visible img{transform:none}}