/* shop/base.css — the "Shop Florals / Shop Customs" section: two links and
   the artist in the middle. Each option's css paints the look. */
.shp{ position:relative; padding:clamp(28px,4vw,56px) 0 clamp(48px,6vw,90px) }
.shp-stage{ position:relative; display:grid; grid-template-columns:1fr auto 1fr; grid-template-rows:auto 1fr auto; align-items:center; gap:clamp(10px,1.6vw,22px) clamp(14px,2vw,30px); min-height:clamp(420px,52vw,760px) }
.shp-me{ grid-column:2; grid-row:1/4; margin:0; justify-self:center; width:clamp(240px,34vw,520px) }
.shp-me img{ display:block; width:100%; height:auto }
.shp-link{ white-space:nowrap; display:inline-flex; align-items:center; gap:14px; text-decoration:none; color:var(--ink); font-family:'Fraunces',Georgia,serif; font-weight:400; font-variation-settings:'SOFT' 60,'opsz' 72; font-size:clamp(1.6rem,3.6vw,3.1rem); letter-spacing:.14em; line-height:1.1 }
.shp-link--florals{ grid-column:1; grid-row:1; justify-self:start; align-self:start }
.shp-link--customs{ grid-column:3; grid-row:3; justify-self:end; align-self:end }
.shp-link:hover, .shp-link:focus-visible{ text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:8px }
.shp-bag{ width:1.1em; height:1.1em; flex:none; display:grid; place-items:center; border-radius:50%; background:#EAF6F0; color:#2E6B4E }
.shp-bag svg{ width:56%; height:56%; display:block }
.shp-note{ font-size:var(--fs-sm); color:var(--ink-faint); max-width:none; margin:0 }
.fable-brand__name{ font-family:'Fraunces',Georgia,serif; font-weight:600; font-variation-settings:'SOFT' 30,'WONK' 1,'opsz' 24; font-size:1.2rem; letter-spacing:-.005em }
@media (max-width:760px){
  .shp-stage{ grid-template-columns:1fr; grid-template-rows:auto auto auto; min-height:0 }
  .shp-me{ grid-column:1; grid-row:2; width:min(78vw,360px) }
  .shp-link--florals{ grid-column:1; grid-row:1; justify-self:start } .shp-link--customs{ grid-column:1; grid-row:3; justify-self:end }
  .shp-link{ letter-spacing:.1em }
}
.shp-copy, .shp-go{ white-space:normal }
