Logo now uses clamp to determine size

web/components/ui/Logo/Logo.module.scss

@@ -1,11 +1,11 @@
-.logo {
+.root {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   overflow: hidden;
-  width: 120px;
-  height: 120px;
+  width: clamp(5vw, 90px, 120px);
+  height: clamp(5vw, 90px, 120px);
   border-radius: 50%;
   border-width: 3px;
   border-style: solid;
@@ -26,4 +26,4 @@
   background-size: cover;
   background-position: center;
   overflow: hidden;
-}
+}

web/components/ui/Logo/Logo.tsx

@@ -6,7 +6,7 @@ interface Props {
 
 export default function Logo({ src }: Props) {
   return (
-    <div className={s.logo}>
+    <div className={s.root}>
       <div className={s.container}>
         <div className={s.image} style={{ backgroundImage: `url(${src})` }} />
       </div>