/* Savuti Gallery: front end */
.sg{--sg-gold:#DBBC12;--sg-char:#3A352C;--sg-cream:#EDEEDB;--sg-off:#FAFAFA;--sg-slate:#3B3C3C;--sg-grey:#8C8A8D;--sg-gap:14px;font-family:Arial,Helvetica,sans-serif;color:var(--sg-slate);width:100%;box-sizing:border-box}
.sg *,.sg *::before,.sg *::after{box-sizing:border-box}
.sg-filters{display:flex;flex-wrap:wrap;gap:var(--sg-gap);justify-content:stretch;margin:0 0 2rem}
.sg-filters button{flex:1 1 auto;text-align:center;font:600 10px/1 "Montserrat",Arial,sans-serif;letter-spacing:1.4px;text-transform:uppercase;padding:13px 15px;min-height:45px;border:0;background:var(--sg-cream);color:var(--sg-char);cursor:pointer;border-radius:0;box-shadow:none;transition:background .2s,color .2s}
.sg-filters .sg-select{display:none}
.sg-filters button em{font-style:normal;color:var(--sg-grey);margin-left:6px}
.sg-filters button:hover,.sg-filters button:focus-visible,.sg-filters button[aria-pressed=true]{background:var(--sg-char);color:var(--sg-gold)}
.sg-filters button[aria-pressed=true] em,.sg-filters button:hover em{color:var(--sg-cream)}

/* Before the script runs (or without it) the photos sit in a simple even grid */
.sg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--sg-gap);align-items:start}
.sg-tile{position:relative;display:block;overflow:hidden;background:var(--sg-slate);cursor:zoom-in;aspect-ratio:var(--r,1.33);text-decoration:none;color:inherit;border:0;--h:1}
.sg-tile:hover,.sg-tile:focus-visible{--h:1.06}
.sg-tile:focus-visible{outline:3px solid var(--sg-gold);outline-offset:2px}
.sg-img{position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:var(--x,50%) var(--y,50%);transform-origin:var(--x,50%) var(--y,50%);transform:scale(calc(var(--z,1) * var(--h,1)));transition:transform .8s cubic-bezier(.2,.7,.2,1);display:block;margin:0}

/* Mosaic: columns of natural-shaped photos that all finish on the same bottom line */
.sg-grid.sg-mos{display:flex;align-items:flex-start}
.sg-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:var(--sg-gap)}
.sg-mos .sg-tile{aspect-ratio:auto;flex:1 1 0;min-height:0}

.sg-cap{position:absolute;inset:auto 0 0 0;padding:2.4rem 1rem .9rem;background:linear-gradient(180deg,rgba(58,53,44,0),rgba(58,53,44,.92));color:var(--sg-off);transform:translateY(100%);transition:transform .35s;text-align:left;pointer-events:none}
.sg-tile:hover .sg-cap,.sg-tile:focus-visible .sg-cap{transform:none}
.sg-cap b{display:block;font:600 .9rem/1.3 "Montserrat",Arial,sans-serif}
.sg-cap small{display:block;font:700 10px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--sg-gold)}
.sg-ex{position:absolute;top:10px;right:10px;width:34px;height:34px;background:var(--sg-gold);display:grid;place-items:center;opacity:0;transition:opacity .25s;pointer-events:none}
.sg-tile:hover .sg-ex,.sg-tile:focus-visible .sg-ex{opacity:1}
.sg-ex svg{width:16px;height:16px}
.sg-count{text-align:center;color:var(--sg-grey);font:700 11px/1 Arial,Helvetica,sans-serif;letter-spacing:.25em;text-transform:uppercase;margin-top:1.6rem}
.sg-pager{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:1.6rem}
.sg-pager button{font:600 10px/1 "Montserrat",Arial,sans-serif;letter-spacing:1.4px;text-transform:uppercase;min-width:44px;height:44px;padding:0 14px;border:0;background:var(--sg-cream);color:var(--sg-char);cursor:pointer;border-radius:0;box-shadow:none;transition:background .2s,color .2s}
.sg-pager button:hover:not([disabled]),.sg-pager button:focus-visible,.sg-pager button[aria-current=page]{background:var(--sg-char);color:var(--sg-gold)}
.sg-pager button[disabled]{opacity:.4;cursor:not-allowed}
@media(max-width:980px){
.sg-filters{display:block}
.sg-filters button{display:none}
.sg-filters .sg-select{display:block;width:100%;height:45px;margin:0;padding:0 48px 0 18px;font:600 11px/1 "Montserrat",Arial,sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:var(--sg-char);background-color:var(--sg-cream);border:0;border-radius:0;box-shadow:none;-webkit-appearance:none;appearance:none;cursor:pointer;background-image:url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233A352C' stroke-width='2'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");background-repeat:no-repeat;background-position:right 18px center;background-size:18px}
.sg-filters .sg-select:focus{outline:none;box-shadow:0 0 0 2px var(--sg-gold)}
}
@media(max-width:520px){.sg{--sg-gap:10px}}
@media(hover:none){.sg-cap{transform:none;padding-top:1.6rem}.sg-ex{display:none}}
@media(prefers-reduced-motion:reduce){.sg-img,.sg-cap,.sg-ex{transition:none}.sg-tile:hover,.sg-tile:focus-visible{--h:1}}

/* Lightbox */
.sg-lb{position:fixed;inset:0;z-index:2147483000;background:rgba(58,53,44,.97);display:none;grid-template-rows:auto 1fr auto auto;color:var(--sg-off,#FAFAFA);font-family:Arial,Helvetica,sans-serif;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);--sg-gold:#DBBC12;--sg-char:#3A352C;--sg-off:#FAFAFA}
.sg-lb *{box-sizing:border-box}
.sg-lb.on{display:grid;animation:sglb .3s}
@keyframes sglb{from{opacity:0}to{opacity:1}}
.sg-lb-top{display:flex;justify-content:space-between;align-items:center;padding:14px clamp(16px,3vw,32px)}
.sg-lb-count{font:700 11px/1 Arial,Helvetica,sans-serif;letter-spacing:.25em;text-transform:uppercase;color:var(--sg-gold)}
.sg-lb button{border-radius:0;box-shadow:none}
.sg-lb-x{width:44px;height:44px;border:0;background:transparent;color:var(--sg-off);cursor:pointer;display:grid;place-items:center;padding:0}
.sg-lb-x:hover{color:var(--sg-gold);background:transparent}
.sg-lb-x svg{width:24px;height:24px}
.sg-lb-stage{position:relative;min-height:0;display:flex;align-items:center;justify-content:center;padding:0 clamp(52px,7vw,96px)}
.sg-lb-stage img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block;animation:sgpop .35s;touch-action:pan-y}
@keyframes sgpop{from{opacity:.2;transform:scale(.97)}to{opacity:1;transform:none}}
.sg-lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:64px;border:0;background:rgba(58,53,44,.6);color:var(--sg-off);cursor:pointer;display:grid;place-items:center;padding:0}
.sg-lb-nav:hover,.sg-lb-nav:focus-visible{background:var(--sg-gold);color:var(--sg-char)}
.sg-lb-nav svg{width:22px;height:22px}
.sg-lb-prev{left:clamp(0px,1vw,12px)}.sg-lb-next{right:clamp(0px,1vw,12px)}
.sg-lb-info{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:14px clamp(16px,3vw,32px)}
.sg-lb-info small{display:block;font:700 10px/1.6 Arial,Helvetica,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--sg-gold)}
.sg-lb-info h3{margin:0;padding:0;color:var(--sg-off);font:600 1.1rem/1.3 "Montserrat",Arial,sans-serif;text-transform:none;letter-spacing:0}
.sg-lb-enq{display:inline-flex;align-items:center;justify-content:center;width:200px;height:45px;padding:0;background:var(--sg-gold);color:var(--sg-char);border:0;font:600 10px/1 "Montserrat",Arial,sans-serif;letter-spacing:1px;text-transform:uppercase;text-decoration:none;transition:background .2s,color .2s,box-shadow .2s}
.sg-lb-enq:hover,.sg-lb-enq:focus-visible{background:var(--sg-char);color:var(--sg-gold);box-shadow:inset 0 0 0 1.5px var(--sg-gold)}
.sg-lb-thumbs{display:flex;gap:8px;overflow-x:auto;padding:0 clamp(16px,3vw,32px) 14px;scrollbar-width:thin}
.sg-lb-thumbs button{flex:none;width:76px;height:52px;padding:0;border:0;opacity:.5;cursor:pointer;background:#3B3C3C;outline-offset:2px;overflow:hidden}
.sg-lb-thumbs button.on{opacity:1;outline:2px solid var(--sg-gold)}
.sg-lb-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:560px){.sg-lb-nav{width:40px;height:52px}.sg-lb-stage{padding:0 8px}.sg-lb-enq{width:100%}}

/* Showcase: [savuti_gallery showcase="yes"] hides the count and page buttons and tightens the gaps */
.sg-show{--sg-gap:12px}.sg-show .sg-count,.sg-show .sg-pager{display:none!important}@media(max-width:520px){.sg-show{--sg-gap:8px}}
.sg-cap b:empty,.sg-lb-info h3:empty{display:none}
