/* Stolen Hearts — "Where we work" (homepage, after "A few of our favourites"). Scoped to #sh-where. */
#sh-where{--shw-paper:#f8f6f3;--shw-ink:#282b2b;--shw-body:#55504c;--shw-rose:#ac6965;--shw-rose-soft:#bd807b;--shw-mauve:#9d6a66;--shw-blush:#efe0db;--shw-pill:#f1e2dd;--shw-serif:"Stolen Hearts Serif","Cormorant Garamond",Georgia,serif;--shw-gap:clamp(20px,2vw,32px);position:relative;isolation:isolate;overflow:clip;background:var(--shw-paper);color:var(--shw-ink);margin:0;padding:clamp(40px,5vw,80px) 0 clamp(96px,9vw,140px);font:400 17px/1.7 Lato,Arial,sans-serif;scroll-margin-top:85px}
#sh-where *,#sh-where *::before,#sh-where *::after{box-sizing:border-box}
#sh-where::before{content:"";position:absolute;z-index:-1;left:-90px;bottom:-40px;width:clamp(240px,26vw,420px);height:520px;background:url('/wp-content/mu-plugins/stolenhearts-leaf-shadow.svg') center/contain no-repeat;opacity:.05;transform:rotate(170deg);pointer-events:none}
#sh-where .sh-where-inner{width:min(88%,1320px);margin:auto;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(48px,6vw,110px);align-items:center}

/* Copy */
#sh-where .sh-where-copy{min-width:0}
#sh-where .sh-where-eyebrow{display:flex;align-items:center;gap:18px;margin:0 0 26px;color:var(--shw-rose);font:400 12px/1.5 Lato,Arial,sans-serif;letter-spacing:.24em;text-transform:uppercase}
#sh-where .sh-where-eyebrow::before{content:"";width:46px;height:1px;background:var(--shw-rose-soft)}
#sh-where h2{font:400 clamp(40px,4.4vw,68px)/1.05 var(--shw-serif)!important;letter-spacing:-.025em;color:var(--shw-ink);margin:0;text-transform:none}
#sh-where h2 em{display:block;text-wrap:balance;font-family:inherit;font-style:italic;font-weight:400;color:var(--shw-mauve);letter-spacing:-.02em}
#sh-where .sh-where-standfirst{margin:24px 0 0;color:var(--shw-ink);font:400 clamp(19px,1.55vw,23px)/1.45 var(--shw-serif);letter-spacing:.005em}
#sh-where .sh-where-rule{display:block;width:64px;height:1px;background:var(--shw-rose-soft);margin:28px 0 30px}
#sh-where .sh-where-intro p{margin:0 0 20px;max-width:560px;color:var(--shw-body);text-wrap:pretty}

/* Location selector */
#sh-where .sh-where-selector{position:relative;margin:34px 0 0}
#sh-where .sh-where-tabs{position:relative;display:flex;align-items:center;gap:var(--shw-gap);margin:0;padding:0;scrollbar-width:none}
#sh-where .sh-where-tabs::-webkit-scrollbar{display:none}
#sh-where .sh-where-indicator{position:absolute;left:0;top:50%;height:38px;width:var(--shw-w,0);transform:translate(var(--shw-x,0),-50%);border-radius:999px;background:var(--shw-pill);opacity:0;transition:transform .45s cubic-bezier(.3,.7,.2,1),width .45s cubic-bezier(.3,.7,.2,1),opacity .3s ease;pointer-events:none}
#sh-where.is-ready .sh-where-indicator{opacity:1}
#sh-where .sh-where-tabs button{position:relative;z-index:1;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin:0;padding:0 20px;border:0!important;border-radius:999px;background:transparent!important;box-shadow:none!important;color:var(--shw-ink)!important;font:400 11.5px/1 Lato,Arial,sans-serif!important;letter-spacing:.24em;text-transform:uppercase;text-decoration:none;white-space:nowrap;cursor:pointer;transition:color .3s ease;-webkit-tap-highlight-color:transparent}
#sh-where .sh-where-tabs button::after{display:none!important}
#sh-where .sh-where-tabs button+button::before{content:"";position:absolute;left:calc(var(--shw-gap) / -2 - 1.5px);top:50%;width:3px;height:3px;margin-top:-1.5px;border-radius:50%;background:#d9b2ad;pointer-events:none}
#sh-where .sh-where-tabs button:hover{color:var(--shw-rose)!important}
#sh-where .sh-where-tabs button[aria-selected="true"]{color:var(--shw-ink)!important}
#sh-where .sh-where-tabs button:focus-visible{outline:2px solid var(--shw-rose);outline-offset:3px}

/* Location copy: stacked in one grid cell so the height never jumps */
#sh-where .sh-where-panels{display:grid;margin:26px 0 0;max-width:580px}
#sh-where .sh-where-panel{grid-area:1/1;min-width:0;padding:2px 0 0 26px;border-left:1px solid #e3c6c1}
#sh-where .sh-where-panel p{margin:0;color:var(--shw-body);text-wrap:pretty}
#sh-where .sh-where-panel a{color:var(--shw-rose);text-decoration:underline;text-decoration-color:#d9b2ad;text-underline-offset:4px;text-decoration-thickness:1px}
#sh-where .sh-where-panel a:hover{color:var(--shw-ink);text-decoration-color:currentColor}
#sh-where .sh-where-panel-title{margin:0 0 8px;color:var(--shw-rose);font:400 12px/1.5 Lato,Arial,sans-serif!important;letter-spacing:.2em;text-transform:uppercase}
#sh-where .sh-where-links{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;margin-top:14px!important;font-size:15px}
#sh-where .sh-where-links span{font:italic 400 17px/1.4 var(--shw-serif);color:var(--shw-body)}
#sh-where .sh-where-links i{font-style:normal;color:#d9b2ad}

/* Without JavaScript every location stays readable; the selector appears once it can work. */
#sh-where:not(.is-enhanced) .sh-where-selector{display:none}
#sh-where:not(.is-enhanced) .sh-where-panels{gap:22px;margin-top:30px}
#sh-where:not(.is-enhanced) .sh-where-panel{grid-area:auto}
#sh-where.is-enhanced .sh-where-panel-title{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
#sh-where.is-enhanced .sh-where-panel{opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .35s ease,transform .35s ease,visibility 0s linear .35s}
#sh-where.is-enhanced .sh-where-panel.is-active{opacity:1;visibility:visible;transform:none;transition:opacity .55s ease .12s,transform .55s cubic-bezier(.3,.7,.2,1) .12s,visibility 0s}

/* Photograph */
#sh-where .sh-where-figure{position:relative;margin:0;padding:clamp(22px,2.4vw,38px) clamp(22px,2.4vw,38px) 0 0;min-width:0;max-width:600px;justify-self:center;width:100%}
#sh-where .sh-where-panel-bg{position:absolute;z-index:-1;top:0;right:0;width:84%;height:84%;background:var(--shw-blush)}
#sh-where .sh-where-photo{position:relative;margin:0;line-height:0;box-shadow:0 22px 50px -28px #5a3d3266}
#sh-where .sh-where-photo img{display:block;width:100%;height:auto;max-width:none;aspect-ratio:860/1024;object-fit:cover;margin:0;border:0;border-radius:0}
#sh-where figcaption{position:absolute;left:clamp(14px,1.6vw,22px);bottom:clamp(14px,1.6vw,22px);margin:0;padding:11px 18px 10px;background:#f8f6f3eb;color:var(--shw-ink);font:400 10px/1.4 Lato,Arial,sans-serif;letter-spacing:.24em;text-transform:uppercase;white-space:nowrap}
#sh-where .sh-where-note{position:absolute;top:clamp(56px,7vw,110px);right:clamp(-150px,-9vw,-60px);width:clamp(110px,9vw,150px);margin:0;text-align:center;color:#c0857f;font:400 clamp(22px,2vw,30px)/1.05 "Dancing Script","Segoe Script",cursive;transform:rotate(-9deg);pointer-events:none}
#sh-where .sh-where-note svg{display:block;width:24px;height:22px;margin:8px auto 0;fill:none;stroke:currentColor;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}
#sh-where .sh-where-sprig{position:absolute;z-index:-1;right:clamp(-120px,-6.5vw,-50px);bottom:-18px;width:clamp(70px,6.5vw,110px);height:auto;fill:none;stroke:#d9b2ad;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;opacity:.85;pointer-events:none}

@media(min-width:1600px){#sh-where{font-size:18px}#sh-where .sh-where-inner{max-width:1450px}#sh-where .sh-where-figure{max-width:640px}}
@media(max-width:1280px){#sh-where .sh-where-note{right:-14px;top:auto;bottom:-70px;transform:rotate(-6deg)}#sh-where .sh-where-sprig{display:none}#sh-where{padding-bottom:150px}}
@media(max-width:1100px){#sh-where{font-size:16px}#sh-where .sh-where-inner{width:90%;gap:44px}#sh-where .sh-where-tabs{--shw-gap:14px}#sh-where .sh-where-tabs button{padding:0 14px;letter-spacing:.2em}}

/* Tablet + mobile: stack, image below the copy, selector scrolls sideways */
@media(max-width:900px){
  #sh-where{padding:28px 0 90px}
  #sh-where .sh-where-inner{display:block;width:90%;max-width:620px}
  #sh-where h2{font-size:clamp(38px,7.4vw,56px)!important}
  #sh-where .sh-where-selector{margin:30px 0 0}
  #sh-where .sh-where-tabs{overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;padding:4px 5vw;margin:0 -5vw;-webkit-mask:linear-gradient(90deg,transparent 0,#000 4vw,#000 calc(100% - 9vw),transparent);mask:linear-gradient(90deg,transparent 0,#000 4vw,#000 calc(100% - 9vw),transparent)}
  #sh-where .sh-where-tabs button{scroll-snap-align:center}
  #sh-where .sh-where-panels{max-width:none}
  #sh-where .sh-where-figure{margin:56px auto 0;max-width:520px}
  #sh-where .sh-where-note{position:relative;right:auto;bottom:auto;top:auto;width:auto;margin:28px 0 0;transform:rotate(-4deg);font-size:28px}
  #sh-where .sh-where-note svg{display:inline-block;vertical-align:-3px;margin:0 0 0 10px}
}
@media(max-width:480px){
  #sh-where{font-size:16px;line-height:1.68}
  #sh-where .sh-where-eyebrow{font-size:10px;letter-spacing:.2em;gap:14px;margin-bottom:20px}
  #sh-where .sh-where-eyebrow::before{width:32px}
  #sh-where h2{font-size:clamp(34px,10vw,42px)!important}
  #sh-where .sh-where-standfirst{font-size:19px;margin-top:18px}
  #sh-where .sh-where-rule{margin:22px 0 24px}
  #sh-where .sh-where-panel{padding-left:18px}
  #sh-where .sh-where-tabs button{font-size:11px!important;padding:0 15px}
  #sh-where .sh-where-indicator{height:36px}
  #sh-where .sh-where-figure{padding:16px 16px 0 0;margin-top:46px}
  #sh-where figcaption{font-size:9px;letter-spacing:.2em;padding:9px 13px 8px}
}
@media(prefers-reduced-motion:reduce){#sh-where .sh-where-indicator,#sh-where.is-enhanced .sh-where-panel,#sh-where.is-enhanced .sh-where-panel.is-active{transition:none!important;transform:none}}
