/* "Who's Your Side Guy?" (Food article 03). Loud on purpose: the story is a comedy bit.
   Pictures are floated into the text so the words wrap around them. */

.sg-prose{max-width:780px;}
.sg-prose::after{content:"";display:block;clear:both;}

/* All-bold lines in Kim's text read as shouts. */
.sg-prose p.sg-shout{
  font-family:var(--display-heavy,'Archivo Black'),sans-serif;font-weight:400;text-transform:uppercase;
  font-size:clamp(22px,2.7vw,31px);line-height:1.05;letter-spacing:.005em;margin:24px 0 20px;
}
.sg-prose p.sg-shout strong{font-weight:400;}
.sg-prose p.sg-shout::before{content:"";display:inline-block;width:.5em;height:.5em;background:#FB8322;border-radius:50%;margin-right:.45em;vertical-align:.08em;}

/* Closing link line */
.sg-prose p.sg-end{margin:30px 0 4px;font-family:var(--display-heavy,'Archivo Black'),sans-serif;text-transform:uppercase;font-size:20px;letter-spacing:.02em;}
.sg-prose p.sg-end strong{font-weight:400;}
.sg-prose p.sg-end a{color:#030303;text-decoration:underline;text-decoration-color:#FB8322;text-decoration-thickness:3px;text-underline-offset:4px;}

/* Inline links inside the story */
.sg-prose p a{color:inherit;text-decoration:underline;text-decoration-color:#FB8322;text-decoration-thickness:2px;text-underline-offset:3px;}
.sg-prose p a:hover,.sg-prose p a:focus-visible{background:#FB8322;color:#030303;text-decoration-color:transparent;}

/* Picture floated into the text */
.sg-fig{margin:6px 0 16px;}
.sg-fig img{display:block;width:100%;height:auto;border:3px solid #030303;box-shadow:6px 6px 0 #030303;}
.sg-fig--right{float:right;width:min(300px,44%);margin:8px 12px 18px 30px;transform:rotate(1.4deg);shape-margin:14px;}

.sg-fig--small{width:min(190px,34%);transform:rotate(-1.6deg);}
.sg-fig--small img{box-shadow:5px 5px 0 #FB8322;}

/* The advertisement: a half-page ad that the story wraps around. Over the top on purpose. */
.sg-ad{
  float:left;position:relative;width:min(340px,46%);margin:10px 30px 20px 6px;transform:rotate(-1.6deg);
  border:3px solid #030303;box-shadow:9px 9px 0 #FB8322;background:#fff;
}
.sg-ad .mag-ad__label{background:#030303;color:#FDF9EE;border-bottom:0;font-size:11px;}
.sg-ad .mag-ad__cta{flex-direction:column;align-items:flex-start;gap:4px;background:#FFD23F;border-top:3px solid #030303;font-weight:700;}
.sg-ad .mag-ad__cta span{font-family:'Brush Script MT','Segoe Script',cursive;font-size:20px;font-weight:400;}
.sg-ad .mag-ad__cta a{text-decoration:underline;text-underline-offset:3px;}
.sg-ad__burst{
  position:absolute;top:44px;right:-26px;width:96px;height:96px;display:flex;align-items:center;justify-content:center;text-align:center;
  background:#E8341C;color:#fff;transform:rotate(14deg);
  font-family:var(--display,'Anton'),sans-serif;text-transform:uppercase;font-size:21px;line-height:.95;padding:12px;
  clip-path:polygon(50.0% 0.0%,58.5% 13.0%,71.7% 5.0%,73.7% 20.3%,89.1% 18.8%,84.2% 33.5%,98.7% 38.9%,88.0% 50.0%,98.7% 61.1%,84.2% 66.5%,89.1% 81.2%,73.7% 79.7%,71.7% 95.0%,58.5% 87.0%,50.0% 100.0%,41.5% 87.0%,28.3% 95.0%,26.3% 79.7%,10.9% 81.2%,15.8% 66.5%,1.3% 61.1%,12.0% 50.0%,1.3% 38.9%,15.8% 33.5%,10.9% 18.8%,26.3% 20.3%,28.3% 5.0%,41.5% 13.0%);
}

@media (max-width:640px){
  .sg-fig--right,.sg-ad{float:none;width:auto;max-width:420px;margin:22px auto 26px;}
  .sg-fig--right{transform:none;}
  .sg-fig--small{max-width:200px;float:right;margin:8px 4px 12px 18px;transform:rotate(-1.6deg);}
  .sg-ad{transform:rotate(-1deg);margin-right:auto;margin-left:auto;}
  .sg-ad__burst{top:-22px;right:-10px;}
}