diff --git a/apps/portal/src/features/services/components/sim/MnpForm.tsx b/apps/portal/src/features/services/components/sim/MnpForm.tsx
index 4b06541f..63e69486 100644
--- a/apps/portal/src/features/services/components/sim/MnpForm.tsx
+++ b/apps/portal/src/features/services/components/sim/MnpForm.tsx
@@ -43,9 +43,9 @@ function MnpField({
 }: MnpFieldProps) {
   return (
     <div>
-      <label htmlFor={id} className={LABEL_CLASS}>
+      <Label htmlFor={id} className={LABEL_CLASS}>
         {label}
-      </label>
+      </Label>
       <input
         type={type}
         id={id}
diff --git a/apps/portal/src/features/services/views/PublicInternetPlans.tsx b/apps/portal/src/features/services/views/PublicInternetPlans.tsx
index 1bbcf9e9..28c29295 100644
--- a/apps/portal/src/features/services/views/PublicInternetPlans.tsx
+++ b/apps/portal/src/features/services/views/PublicInternetPlans.tsx
@@ -652,16 +652,17 @@ function FaqItem({ question, answer }: { question: string; answer: string }) {
 
   return (
     <div className="border border-border rounded-xl overflow-hidden bg-card">
-      <button
+      <Button
+        variant="ghost"
         type="button"
         onClick={() => setIsOpen(!isOpen)}
-        className="w-full flex items-start justify-between gap-3 p-4 text-left hover:bg-muted/50 transition-colors"
+        className="w-full flex items-start justify-between gap-3 p-4 text-left hover:bg-muted/50 transition-colors h-auto whitespace-normal rounded-none"
       >
         <span className="font-medium text-foreground">{question}</span>
         <motion.div animate={{ rotate: isOpen ? 180 : 0 }} transition={{ duration: 0.2 }}>
           <ChevronDown className="w-5 h-5 text-muted-foreground flex-shrink-0 mt-0.5" />
         </motion.div>
-      </button>
+      </Button>
       <AnimatePresence initial={false}>
         {isOpen && (
           <motion.div