/* =====================================================================
   "Explore further": the card that links page text to an interactive
   ([explore_further] in functions.php). The look follows Rethinking
   Endometriosis (.viz in css/rethinking-endo.css): a white card with the
   brand shadow, a small label, a framed picture and a call to action.
   Sized in px, because the theme's root font size is 22px, and it sets
   everything style.css gives links, spans and images by default.
   ===================================================================== */
.explore-further{margin:0 0 34px}   /* as much room below as the paragraph above leaves */
.explore-further .explore-further-card{
  display:block;
  background:#ffffff;
  border-radius:5px;
  box-shadow:0 2px 4px rgba(12,62,96,0.2);
  padding:24px 22px;
  color:inherit;
  text-decoration:none;
  transition:box-shadow 150ms ease;
}
.explore-further .explore-further-card:hover,
.explore-further .explore-further-card:focus-visible{box-shadow:0 4px 10px rgba(12,62,96,0.26);text-decoration:none}
.explore-further .explore-further-card:focus-visible{outline:2px solid #2e5c8a;outline-offset:3px}
.explore-further .explore-further-kicker{
  display:block;
  font-family:'Work Sans',sans-serif;
  font-size:12.5px;
  font-weight:600;
  line-height:1.3;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:#1f7a6b;
  margin:0 0 10px;
}
.explore-further .explore-further-frame{
  display:block;
  border:1px solid #e9e5de;
  border-radius:5px;
  overflow:hidden;
  line-height:0;
  margin:0 0 16px;
}
.explore-further .explore-further-frame img{display:block;width:100%;max-width:100%;height:auto}
/* a block of plain text, so on a narrow screen the arrow follows the last word */
.explore-further .explore-further-cta{
  display:block;
  font-family:'Work Sans',sans-serif;
  font-size:16px;
  font-weight:600;
  line-height:1.4;
  letter-spacing:normal;
  color:#1f7a6b;
}
@media (max-width:600px){
  .explore-further{margin-bottom:20px}
  .explore-further .explore-further-card{padding:18px 16px}
  .explore-further .explore-further-cta{font-size:15px}
}
@media (prefers-reduced-motion:reduce){
  .explore-further .explore-further-card{transition:none}
}