@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;500;600;700&display=swap');

/* reset css */
html {
  scroll-behavior: smooth;
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
    vertical-align: middle;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	margin: 0;
  font-family: 'Inter', sans-serif;
  
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

.clearfix::after {
    content: "";
    clear: both;
    display: table;
  }

  ::-webkit-input-placeholder { /* Edge */
    color: #797979;
    font-size: 15px;
    font-weight: normal;
  }
  
  :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #797979;
    font-size: 15px;
    font-weight: normal;
  }
  
  ::placeholder {
    color: #797979;
    font-size: 15px;
    font-weight: normal;
  }
.container { max-width: 1300px; margin: 0 auto;}

/* header */

header  { max-width: 1300px; width: 100%; margin: 20px auto; background: #262626; box-shadow: 0 0 40px rgba(0, 0, 0, 0.1); border-radius: 8px; display: flex; align-items: center; justify-content: space-between;}
header .left {}
header .left img { width: 170px; margin: 0.5rem;}
header .right {display: flex; align-items: center; justify-content: center;}
header .right nav {}
header .right nav a { color: #fff; text-decoration: none; margin: 0 1rem;} 
header .right span.order { background: #c00; cursor: pointer; margin-right: -1px; font-weight: bold; border-radius: 0 8px 8px 0; display: flex; color: #fff;}
header .right span.order a { color: #fff; text-decoration: none; font-size: 18px; padding: 1.4rem 2rem;}

header .call_now { color: #fff; display: flex; align-items: center; text-decoration: none; font-size: 18px; margin-left: 20px; margin-right: 15px;}
header .call_now img  {width: 25px; margin-right: 5px;}
.request_form { background: #fff; box-shadow: 0 0 30px rgba(0, 0, 0, 0.2); z-index: 9; margin-bottom: -50px; margin-left: 10px; margin-right: 10px; position: relative; padding: 2rem; border-radius: 15px;}
.request_form button[type="submit"] { width: 100%; font-weight: bold; margin-top: 1rem; border: none; background: rgb(28,67,48);
  background: linear-gradient(356deg, rgba(28,67,48,1) 0%, rgba(21,97,61,1) 100%); padding: 14px 40px; font-size: 20px; color: #fff; border-radius: 6px;}
.request_form button[type="submit"]:hover{ text-decoration: none; background: #16623d;}
.request_form .form-control { height: 50px; border-color: #333; border-radius: 6px;}
.request_form h2 {border-radius:0 30px 30px 0; margin-left: -33px; margin-bottom: 2rem; font-size: 18px; font-weight: bold; background: #000; padding: 0.8rem 1rem; color: #fff; }

.request_form .price { display: flex; font-size: 20px; flex-direction: column; justify-content: center; padding-bottom: 1.3rem; color: #666; font-weight: bold;}
.request_form .price strong  { color: #f34c4c; font-size: 19px; font-weight: 800;}



.banner { text-align: center; padding: 3rem 0; position: relative;}
.banner .container { display: flex; justify-content: space-between; }
.banner .left { width: 70%; text-align: left; position: relative;}
.banner ul { margin: 2rem 0;}
.banner ul li { display: flex; font-size: 17px; margin: 1rem 0;}
.banner ul li span { background: #d73300; padding: 0.5rem; margin-right: 1rem; display: flex; height: 40px; font-size: 25px; font-weight: bold; margin-top: 0.2rem; align-items: center; color: #fff; font-weight: bold; border-radius: 20px;}
.banner ul li article strong { font-weight:bold; color: #d73300; font-size: 25px;}

.banner .right { width: 27%;}
.banner h1 { font-size: 48px; font-weight: bold; margin:0 0 0.5rem 0;}
.banner h1 strong { font-weight: bold; color: #d73300; vertical-align:baseline;}
.banner p.subheading { font-size: 18px; font-weight: bold;}

.banner .left .medicine_box { position: absolute; bottom: -50px; right: 50px;}
.banner .left .medicine_box img { width: 235px;}

@-webkit-keyframes salePulse {
  from { background-color: #a00; }
  50% { background-color: #c00; -webkit-transform:scale(1.1); }
  to { background-color: #a00; }
  }
  
  .banner .left .medicine_box mark.sale {
  background:#c00; /* fallback for non-webkit browsers */
  display:inline-flex; /* or it wont work */
  width:80px;
  justify-content: center;
  align-items: center;
  height: 80px;
  text-align: center;
  font-size: 25px;
  position: absolute;
  right: 30px;
  text-align:center;
  border-radius:3em;
  color:#fff;
  font-weight:bold;
  -webkit-animation-name:salePulse;
  -webkit-animation-duration:1s;
  -webkit-animation-iteration-count:infinite;
  margin: 0 auto;
  }

.usps { max-width: 1300px; width: 100%; margin: 0 auto 30px; display: flex; justify-content: space-around; box-shadow: 0 0 40px rgba(0, 0, 0, 0.1); border-radius: 8px; background: #24744f; padding: 1rem; position: relative;}
.usps li { background: url('../img/point.png') left center no-repeat; list-style-type: none; padding: 0.2rem 0 0.2rem 2.5rem; font-weight: bold; color: #fff; font-size: 20px;}


.syntoms { background: #f0f5f6; padding:6rem 0 4rem 0; margin-top: -3.2rem;}
.syntoms h2 { font-weight: bold; font-size: 40px; margin-bottom: 2rem;}
.syntoms ul { padding: 0 4rem; margin-bottom: 2rem; display: flex; flex-wrap: wrap; justify-content: space-between;}
.syntoms ul li { width: 49%; list-style-type: none; font-size: 19px; font-weight: bold; margin:0.5rem 0; background: #fff; padding: 0.5rem 2rem 0.5rem 0.5rem; border-radius: 100px; display: flex; align-items: center;}
.syntoms ul li figure img { width: 90px; margin-right: 1rem; height: 90px; border-radius: 50%;}
.sub_heading { font-size: 40px; display: block; text-align: center; font-weight: bold;}
.sub_heading mark { background: transparent; color: #d73300;}


.syntoms2 { background: #d73300; padding: 5rem 0;}
.syntoms2 h2 { font-weight: bold; font-size: 40px; color: #fff; margin-bottom: 2rem;}
.syntoms2 ul { padding: 0 4rem; margin:2rem 0 4rem 0; display: flex; flex-wrap: wrap; justify-content: space-between;}
.syntoms2 ul li { width: 32%; text-align: center; list-style-type: none; font-size: 19px; font-weight: bold; background: #fff; padding: 1rem 1rem 2rem 1rem; border-radius: 15px;}
.syntoms2 ul li figure img { border-radius: 15px; max-width: 100%;}
.syntoms2 ul li strong { font-size: 32px; font-weight: bold; display: block; margin: 1rem 0;}
.syntoms2 a { background: #000; color: #fff; text-decoration: none; font-size: 20px; padding: 1rem 3rem; font-weight: bold; border-radius: 6px;}

.certified {padding: 5rem 0;}
.certified h2 { font-weight: bold; font-size: 40px; margin-bottom: 2rem;}
.certified .outer { max-width: 1100px; width: 100%; margin: 0 auto; display: flex; align-items: center; justify-content: space-around;}
.certified .left { width: 40%;}
.certified .right { width: 45%;}
.certified .right ul { display: flex; flex-direction: column;}
.certified .right ul li {  list-style-type: none; font-size: 19px; box-shadow: 0 0 20px rgba(0, 0, 0, 0.08); font-weight: bold; margin:0.8rem 0; background: #fff; padding:0.5rem 2rem; border-radius: 100px; display: flex; align-items: center;}
.certified .right ul li span { color: #fff; font-size: 60px; text-shadow: 2px 0 #d73300, -2px 0 #d73300, 0 2px #d73300, 0 -2px #d73300,
  1px 1px #fff, -1px -1px #d73300, 1px -1px #d73300, -1px 1px #d73300; margin-right: 1rem;}



  .effective {padding: 4rem 0 0 0; background: #e7ecef;}
.effective h2 { font-weight: bold; font-size: 40px; margin-bottom: 4rem;}
.effective .outer { max-width: 1000px; width: 100%; margin: 0 auto; display: flex; align-items: center; justify-content: space-around;}
.effective .left { width: 37%; text-align: center;}
.effective .left img{ max-width: 100%;}
.effective .right { width: 50%;}
.effective .right ul { display: flex; flex-direction: column; margin-bottom: 2rem;}
.effective .right ul li {  list-style-type: none; font-size: 19px; font-weight: bold; margin:0.6rem 0; background: #fff; padding:0.8rem 1.5rem 0.8rem 0.8rem; border-radius: 100px; display: flex; align-items: center;}
.effective .right ul li span { color: #000; }
.effective .right ul li span strong { font-size: 27px; margin-bottom: 0.5rem; font-weight: bold; color: #d73300; display: block;}
.effective .right ul li figure img { width: 100px; margin-right: 1rem; height: 100px; border-radius: 50%;}


.how_use { padding: 4rem 0; text-align: center;}
.how_use h2 { font-weight: bold; font-size: 40px; margin-bottom: 2rem;}
.how_use ul  { display: flex; justify-content: center; align-items: flex-start;}
.how_use ul li { list-style-type:none; width: 185px; font-weight: bold; margin: 2rem; font-size: 18px; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.how_use ul li img { width:200px; height: 200px; margin-bottom: 1rem; border-radius: 50%; border: solid 12px #d73300; list-style-type:none;}
.how_use ul li span { position: relative; margin-bottom: -25px; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%; border: solid 3px #d73300; background: #fff; color: #000; font-size: 25px; font-weight: bold;}


.benifits { background:url('../img/benefits-bg.png') center center no-repeat #086e3f; padding: 4rem 0 15rem 0 ;}
.benifits h2 { font-weight: bold; color: #fff; font-size: 40px; margin-bottom: 2rem;}
.benifits ul { padding: 0 4rem; margin-bottom: 4rem; display: flex; flex-wrap: wrap; justify-content: space-between;}
.benifits ul li { width: 49%; list-style-type: none; font-size: 18px; margin:0.5rem 0; background: #fff; padding: 2rem; border-radius: 20px; display: flex; align-items: center;}
.benifits ul li figure img {  border-radius: 20px; margin-right: 1rem;}
.benifits ul li strong { display: block; color: #d73300; font-weight: bold; font-size: 25px; margin-bottom: 0.5rem;}

.benifits a {background: rgb(188,45,0); background: linear-gradient(356deg, rgba(188,45,0,1) 0%, rgba(214,51,0,1) 100%); color: #fff; text-decoration: none; border-radius: 8px; padding: 1.2rem 3rem; font-size: 20px; }

.testimonials { max-width: 1050px; width: 100%; margin: -12rem auto 3rem; background: #fff; border-radius: 30px; padding: 4rem; box-shadow: 0 0 40px rgba(0, 0, 0, 0.08);}
.testimonials h2 { font-weight: bold; font-size: 40px; margin-bottom: 1rem;}
.testimonials article { display: flex; align-items: center;}
.testimonials article figure { margin-right: 4rem;}
.testimonials article figure img { border-radius: 10px;}
.testimonials article .contnt_panel {}
.testimonials article .contnt_panel p { line-height: 30px; font-size: 17px;}
.testimonials article .contnt_panel span { font-size: 16px; margin-top: 2rem; display: block;}
.testimonials article .contnt_panel span strong { font-size: 20px; font-weight: bold; color: #d73300; display: block; margin-bottom: 0.5rem;}


.result { background: #f2f4f5; padding: 4rem 0;}
.result h2 { font-weight: bold; font-size: 40px; margin-bottom: 2rem;}
.result .outer { display: flex; justify-content: center; margin-top: 4rem;}
.result .outer .other_medicine, .result .outer .urogen_forte { width: 435px; text-align: center; margin: 0.8rem; background: #fff; border-radius: 20px; padding:0.5rem 2.5rem; box-shadow: 0 0 20px rgba(0, 0, 0, 0.08);}
.result .outer .progress_outer  { margin: 1rem 0;}
.result .outer .other_medicine .progress_outer .progress, .result .outer .urogen_forte .progress_outer .progress { height: 18px; border-radius: 30px; background: #cecece; margin-bottom: 0.5rem;}
.result .outer .other_medicine img { margin-top: -40px;}
.result .outer .urogen_forte img { margin-top: -50px; margin-bottom: -8px;}
.result .outer .other_medicine strong { display: block; font-size: 25px; margin-top: 1.5rem; font-weight: bold; text-align: center;}
.result .outer .urogen_forte strong { display: block; background: #d70f00; text-align: center; border-radius: 50px; padding: 0.8rem 1rem; color: #fff; font-weight: bold; font-size: 22px;}

.result .outer .other_medicine .progress_outer span, .result .outer .urogen_forte .progress_outer span { display: block; text-align: left;}
.result .outer .other_medicine .progress_outer .progress .progress-bar {  background: #d73300;}
.result .outer .urogen_forte .progress_outer .progress .progress-bar {  background: #16784b;}

.tagline { background: #d73300; padding: 3rem 0; text-align: center; color: #fff;}
.tagline h2 { font-size: 40px; font-weight: bold; margin-bottom: 1rem;}
.tagline p { font-size: 17px; line-height: 30px;}


.thanks { max-width: 1000px; width: 100%; margin: 0 auto 20px; padding:3rem 5rem; box-shadow: 0 0 50px rgba(0, 0, 0, 0.08); border-radius: 10px; margin-top: 3rem;}
.thanks h2 { font-size: 25px; text-align: center;}
.thanks h2 strong { font-size: 40px; margin-bottom: 0.5rem; font-weight: bold; display: block; color: #268b1a;}
.thanks h3 { text-align: center; font-size: 18px; font-weight: bold; margin: 0.8rem 0;}



.thanks .order_detil { margin: 30px auto 40px; color: #fff; background: #24744f; padding:1rem 3rem; border-radius: 8px;}
.thanks .order_detil ul { display: flex; justify-content: center;}

.thanks .order_detil input { background: none; border: none; color: #fff;}
.thanks .order_detil  input:focus { outline: none; border: none; box-shadow: none;}
.thanks .order_detil .edit_btn { background: #fff; border-radius: 30px; padding: 0.2rem 1.5rem; display: inline-block; text-decoration: none; color: #000; font-weight: bold; font-size: 14px;}
.thanks .about_phone { display: flex; justify-content:center; align-items: flex-start; }
.thanks .about_phone li { background: url('../img/point-2.png') left 5px no-repeat; list-style-type: none; padding: 0.2rem 1rem 0.2rem 2.5rem; font-weight: bold; color: #000; font-size: 16px;}

.thanks .emailer { background: #e7e7e7; border-radius: 8px; padding:2rem 3rem; margin-top: 2rem;}
.thanks .emailer strong { display: block; font-size: 20px; text-align: center; color: #000; }
.thanks .emailer .outer { display: flex; justify-content: center; margin-top: 1rem;}
.thanks .emailer .outer input { width: 50%; height: 48px; border-color: #666;}
.thanks .emailer .outer button { background: #d73300; box-shadow: none; border: none; border-radius:0 6px 6px 0; margin-left: -3px; padding: 0.8rem 2rem; color: #fff;}
.thanks .emailer .outer button:hover { background:#cd3100 ;}

#order_popup .modal-content { padding: 0; background: transparent; border: none;}
#order_popup .modal-content .close { color: #fff; opacity: 1; box-shadow: none; background:#cd3100; width: 35px; height: 35px; position: relative; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; text-align: center; z-index: 999; margin-top: -15px; font-weight: normal;}

.whatsapp { position: fixed; right: 40px; bottom: 30px; z-index: 99;}
.whatsapp img { width: 60px;}
footer { text-align: center; color: #666; padding-bottom: 1.3rem;}
footer a { color: #666; font-weight: bold; text-decoration: none;}
footer a:hover { color: #d73300;}


/* article page css */
.product_article { padding: 3rem 0; background: #f0f5f6;}
.product_article header { width: auto; margin: 0 0 3rem 0;}
.product_article .blog_banner { display: flex; align-items: center; margin-bottom: 2rem;}
.product_article .blog_banner .request_form { margin-left: 3rem;}
.product_article h1 { font-size: 30px; font-weight: bold; margin-bottom: 1rem; line-height: 45px;}
.product_article .container { width: 90%; background: #fff; padding: 3rem; border-radius: 16px; box-shadow: 0 2px 40px rgba(0, 0, 0, 0.1);}
.product_article .date { color: #333; font-size: 14px; display: inline-block; margin-bottom: 1rem;}
.product_article .doctor_blog figure img { border-radius: 8px;}
.product_article .doctor_blog { border: solid 1px #ddd; background: #f2f2f2; display: flex; align-items: center; padding: 2rem; border-radius: 15px;}
.product_article .doctor_blog .right { padding-left: 2rem;}
.product_article .doctor_blog p { font-size: 18px; line-height: 30px;}
.product_article .author-name, .product_article .author-profession { display: block; margin: 1rem 0; font-weight: bold;}
.product_article .panel { margin-top: 2rem;}
.product_article .panel p { margin: 1rem 0; line-height: 25px;}
.product_article .panel ul li { list-style-type: none; margin: 0.8rem 0; background: url('../img/point-2.png') left center no-repeat; background-size:15px 16px; padding-left: 1.5rem;}
.product_article .panel h2 { font-weight: bold; font-size: 25px;}
.product_article .panel .request_form { width: 450px; margin: 0 auto 2rem; background: #24744f; box-shadow: none; color: #fff;}
.product_article .panel .request_form h2 { background: no-repeat; color: #fff; margin: 0; text-align: center; margin-bottom: 0; padding: 0 ;}
.product_article .panel .request_form p { text-align: center; margin-top: 0.5rem; color: #fff;}
.product_article .panel .highlit { background: #f2f2f2; padding: 2rem; border-radius: 15px;}
.product_article .panel .request_form .price { flex-direction: row; color: #fff; margin-top: 1rem;}
.product_article .panel .request_form .price strong { color: #fff;}
.product_article .panel .request_form button[type="submit"] { margin-top: 0; background: #c00;}
.product_article .panel .request_form .form-control { height: 55px;}
.product_article .panel .with_img  {display: flex; background: #f2f2f2; border-radius: 15px; align-items: center; padding: 2rem; justify-content: space-between;}
.product_article .panel .with_img .right { padding-left: 2rem;}
.product_article .panel .with_img .left { width: 20%;}
.product_article .panel .with_img .right { width: 80%;}
.product_article .panel .with_img .left img { max-width: 100%;}
.product_article .panel .card.user_review { border-radius: 15px;}
.product_article .panel .user_review .card-body { border-bottom: solid 1px #ddd;}
.product_article .panel .user_review .card-body .name { font-weight: bold; color: #24744f;}
.product_article .panel .user_review .card-body p.detail { margin: 0.4rem 0;}
.product_article .panel .user_review .card-body .date { font-size: 14px; margin-bottom: 0;}
.product_article .panel .user_review .card-body:last-child { border-bottom: none;}
.product_article .panel  .btn_action {background: #c00; padding: 1rem 3rem; display: inline-block; margin-top: 2rem; color: #fff; text-decoration: none; font-size: 20px; border-radius: 8px;}
.product_article .panel  .btn_action:hover {background: rgb(192, 7, 7); }

/* Mobile-first responsive design */
@media only screen and (max-width: 1200px) {
    .container { max-width: 100%; padding: 0 20px; }
    header { width: 100%; margin: 10px; }
    .usps { width: 100%; margin: 0 10px 20px; }
    .certified .outer, .effective .outer { width: 100%; padding: 0 20px; }
    .testimonials { width: 100%; margin: -8rem 20px 2rem; }
}

@media only screen and (max-width: 992px) {
    /* Typography improvements */
    ::-webkit-input-placeholder, :-ms-input-placeholder, ::placeholder {
        color: #797979;
        font-size: 14px;
    }
    
    .container { width: 100%; padding: 0 15px; }
    h2 { font-size: 24px !important; margin-bottom: 1.5rem !important; }
    h2 br { display: none; }
    
    /* Header improvements */
    header { 
        width: 100%; 
        height: auto; 
        margin: 10px; 
        flex-direction: column; 
        align-items: center;
        padding: 15px;
    }
    header .left { 
        text-align: center; 
        margin-bottom: 15px;
    }
    header .left img { 
        width: 140px; 
        margin: 0;
    }
    header .right { 
        flex-direction: column; 
        width: 100%;
        align-items: center;
    }
    header .right nav { display: none; }
    header .right span.order { 
        font-size: 16px; 
        height: auto; 
        text-align: center; 
        justify-content: center; 
        border-radius: 8px; 
        width: 100%;
        padding: 12px 20px;
        margin-bottom: 10px;
    }
    header .call_now { 
        margin-bottom: 0; 
        padding: 8px 0;
        font-size: 16px;
    }
    
    /* Banner section improvements */
    .banner { 
        padding: 2rem 0; 
        min-height: auto;
    }
    .banner .container { 
        flex-direction: column; 
        align-items: center;
    }
    .banner .left, .banner .right { 
        width: 100%; 
        text-align: center;
    }
    .banner h1 { 
        font-size: 28px; 
        line-height: 1.3;
        margin-bottom: 15px;
    }
    .banner p.subheading { 
        font-size: 16px; 
        margin-bottom: 20px;
    }
    .banner ul { 
        margin: 1rem 0 2rem 0; 
        padding: 0 10px;
    }
    .banner ul li { 
        margin: 0.8rem 0; 
        padding: 0 10px;
    }
    .banner ul li article strong { 
        font-size: 18px; 
        display: block;
        margin-bottom: 5px;
    }
    .banner ul li span { 
        font-size: 16px; 
        width: 35px; 
        height: 35px;
        margin-right: 10px;
    }
    .banner ul li article p { 
        font-size: 14px; 
        line-height: 1.4;
    }
    .banner .left .medicine_box { 
        position: relative; 
        right: auto; 
        bottom: auto; 
        text-align: center;
        margin: 20px 0;
    }
    .banner .left .medicine_box img { 
        width: 180px; 
        max-width: 100%;
    }
    
    /* Form improvements */
    .request_form { 
        margin: 20px 10px 0; 
        padding: 25px 20px;
        border-radius: 12px;
    }
    .request_form h2 { 
        font-size: 18px; 
        margin-bottom: 20px;
        padding: 10px 15px;
        margin-left: -20px;
        margin-right: -20px;
    }
    .request_form .form-control { 
        height: 50px; 
        font-size: 16px;
        margin-bottom: 15px;
    }
    .request_form button[type="submit"] { 
        font-size: 16px; 
        padding: 15px 20px;
        margin-top: 15px;
    }
    .request_form .price { 
        font-size: 16px; 
        margin: 15px 0;
    }
    .request_form .price strong { 
        font-size: 18px; 
        margin-top: 5px;
    }
    
    /* USP section */
    .usps { 
        width: 100%; 
        border-radius: 8px; 
        margin: 0 10px 20px; 
        padding: 15px;
        flex-direction: column;
    }
    .usps li { 
        font-size: 14px; 
        background-size: 18px 20px; 
        padding-left: 25px;
        margin: 8px 0;
    }
    
    /* Symptoms section */
    .syntoms { 
        padding: 2rem 0; 
        margin: 0;
    }
    .syntoms h2 { 
        font-size: 24px; 
        margin-bottom: 1.5rem;
        padding: 0 15px;
    }
    .syntoms ul { 
        padding: 0 15px; 
        margin-bottom: 0;
        flex-direction: column;
    }
    .syntoms ul li { 
        width: 100%; 
        font-size: 14px; 
        margin: 8px 0;
        padding: 12px 15px;
        border-radius: 8px;
    }
    .syntoms ul li figure img { 
        width: 60px; 
        height: 60px;
        margin-right: 12px;
    }
    
    /* Symptoms 2 section */
    .syntoms2 { 
        padding: 2rem 0;
    }
    .syntoms2 h2 { 
        font-size: 24px; 
        margin-bottom: 1.5rem;
        padding: 0 15px;
    }
    .syntoms2 ul { 
        padding: 0 15px; 
        margin: 0 0 2rem 0;
        flex-direction: column;
    }
    .syntoms2 ul li { 
        width: 100%; 
        margin-bottom: 15px; 
        font-size: 14px;
        padding: 15px;
    }
    .syntoms2 ul li strong { 
        font-size: 20px; 
        margin-bottom: 8px;
    }
    .syntoms2 a { 
        display: inline-block; 
        font-size: 16px;
        padding: 12px 25px;
    }
    
    /* Certified section */
    .certified { 
        padding: 2rem 0;
    }
    .certified h2 { 
        font-size: 24px; 
        margin-bottom: 1.5rem;
        padding: 0 15px;
    }
    .certified .outer { 
        width: 100%; 
        flex-direction: column;
        padding: 0 15px;
    }
    .certified .left, .certified .right { 
        width: 100%;
    }
    .certified .left { 
        text-align: center; 
        margin-bottom: 20px;
    }
    .certified .left img { 
        max-width: 80%; 
        height: auto;
    }
    .certified .right ul li { 
        font-size: 14px; 
        margin: 10px 0;
        padding: 12px 15px;
    }
    .certified .right ul li span { 
        font-size: 35px;
        margin-right: 12px;
    }
    
    /* Effective section */
    .effective { 
        padding: 2rem 0;
    }
    .effective h2 { 
        font-size: 24px; 
        margin-bottom: 1.5rem;
        padding: 0 15px;
    }
    .effective .outer { 
        width: 100%; 
        flex-direction: column;
        padding: 0 15px;
    }
    .effective .left { 
        display: none;
    }
    .effective .right { 
        width: 100%;
    }
    .effective .right ul { 
        margin-bottom: 0;
    }
    .effective .right ul li { 
        font-size: 14px; 
        margin: 10px 0;
        padding: 12px 15px;
    }
    .effective .right ul li span strong { 
        font-size: 18px;
        margin-bottom: 5px;
    }
    .effective .right ul li figure img { 
        width: 70px; 
        height: 70px;
        margin-right: 12px;
    }
    
    /* How to use section */
    .how_use { 
        padding: 2rem 0;
    }
    .how_use h2 { 
        font-size: 24px; 
        margin-bottom: 1.5rem;
        padding: 0 15px;
    }
    .how_use ul { 
        flex-wrap: wrap; 
        align-items: center;
        justify-content: center;
        padding: 0 15px;
    }
    .how_use ul li { 
        margin: 15px 10px; 
        font-size: 14px;
        width: 45%;
        min-width: 150px;
    }
    .how_use ul li img { 
        width: 120px; 
        height: 120px; 
        border-width: 6px;
    }
    .how_use ul li span { 
        width: 40px; 
        height: 40px;
        font-size: 20px;
    }
    
    /* Benefits section */
    .benifits { 
        padding: 2rem 0;
    }
    .benifits h2 { 
        font-size: 24px; 
        margin-bottom: 1.5rem;
        padding: 0 15px;
    }
    .benifits ul { 
        padding: 0 15px;
        flex-direction: column;
    }
    .benifits ul li { 
        width: 100%; 
        padding: 15px; 
        border-radius: 12px; 
        font-size: 14px; 
        align-items: flex-start;
        margin: 8px 0;
    }
    .benifits ul li strong { 
        font-size: 16px;
        margin-bottom: 8px;
    }
    .benifits ul li figure img { 
        width: 60px;
        margin-right: 12px;
    }
    .benifits a { 
        font-size: 16px;
        padding: 12px 25px;
        margin: 20px 15px;
        display: inline-block;
    }
    
    /* Testimonials section */
    .testimonials { 
        width: 100%; 
        margin: -8rem 15px 2rem; 
        padding: 20px;
        border-radius: 15px;
    }
    .testimonials h2 { 
        font-size: 24px; 
        margin-bottom: 1.5rem;
    }
    .testimonials article { 
        flex-direction: column;
        text-align: center;
    }
    .testimonials article figure { 
        margin: 0 0 15px 0; 
        text-align: center; 
        display: block;
    }
    .testimonials article figure img { 
        max-width: 80%; 
        height: auto;
    }
    .testimonials article .contnt_panel p { 
        font-size: 14px; 
        line-height: 1.5;
    }
    .testimonials article .contnt_panel span strong { 
        font-size: 16px;
    }
    .testimonials article .contnt_panel span { 
        font-size: 13px; 
        margin-top: 10px;
    }
    
    /* Results section */
    .result { 
        padding: 2rem 0;
    }
    .result h2 { 
        font-size: 24px; 
        margin-bottom: 1.5rem;
        padding: 0 15px;
    }
    .result .outer { 
        flex-direction: column-reverse;
        padding: 0 15px;
    }
    .result .outer .other_medicine, .result .outer .urogen_forte { 
        width: 100%; 
        margin: 0 0 20px 0;
        padding: 20px 15px;
    }
    .result .outer .urogen_forte { 
        margin-bottom: 20px;
    }
    .result .outer .other_medicine strong { 
        font-size: 18px;
    }
    .result .outer .other_medicine img { 
        width: 80px;
        height: auto;
    }
    .result .outer .other_medicine .progress_outer span, 
    .result .outer .urogen_forte .progress_outer span { 
        font-size: 13px;
    }
    .result .outer .urogen_forte strong { 
        font-size: 16px;
        padding: 10px 15px;
    }
    
    /* Tagline section */
    .tagline { 
        padding: 2rem 0;
    }
    .tagline h2 { 
        font-size: 24px; 
        margin-bottom: 1rem;
        padding: 0 15px;
    }
    .tagline p { 
        font-size: 14px; 
        line-height: 1.5;
        padding: 0 15px;
    }
    
    /* Thanks page */
    .thanks { 
        width: 100%; 
        padding: 20px; 
        margin: 20px 15px;
    }
    .thanks h2 strong { 
        font-size: 20px;
    }
    .thanks h2 { 
        font-size: 16px !important;
    }
    .thanks h3 { 
        font-size: 15px;
    }
    .thanks .about_phone { 
        flex-wrap: wrap; 
        justify-content: flex-start;
    }
    .thanks .about_phone li { 
        width: 100%; 
        font-size: 13px; 
        background-position: 0 8px; 
        padding: 8px 15px 8px 25px; 
        background-size: 12px;
        margin: 5px 0;
    }
    .thanks .emailer .outer { 
        flex-wrap: wrap;
    }
    .thanks .emailer .outer input { 
        width: 100%;
        margin-bottom: 10px;
    }
    .thanks .emailer .outer button { 
        border-radius: 6px; 
        margin-top: 0;
        width: 100%;
    }
    .thanks .order_detil { 
        padding: 15px; 
        margin: 15px 0;
    }
    .thanks .order_detil ul { 
        flex-wrap: wrap; 
        align-items: center; 
        justify-content: center;
    }
    .thanks .order_detil ul li { 
        text-align: center; 
        margin: 8px 0;
        width: 100%;
    }
    .thanks .order_detil ul li input { 
        text-align: center;
        width: 100%;
    }
    .thanks .emailer strong { 
        font-size: 16px; 
        font-weight: bold;
    }
    
    /* Article page */
    .product_article { 
        padding: 15px;
    }
    .product_article header { 
        margin-bottom: 15px;
    }
    .product_article .panel p { 
        font-size: 14px;
        line-height: 1.5;
    }
    .product_article .container { 
        width: 100%; 
        padding: 20px;
    }
    .product_article .blog_banner { 
        flex-direction: column;
    }
    .product_article h1 { 
        font-size: 20px; 
        line-height: 1.4;
    }
    .product_article .blog_banner .request_form { 
        margin: 20px 0 0 0;
    }
    .product_article .doctor_blog figure { 
        margin-bottom: 15px;
    }
    .product_article .doctor_blog { 
        flex-direction: column; 
        text-align: center; 
        padding: 20px;
    }
    .product_article .doctor_blog .right { 
        padding-left: 0; 
        padding-top: 0;
    }
    .product_article header .right span.order { 
        height: auto;
    }
    .product_article img { 
        max-width: 100%;
    }
    .product_article .panel .request_form { 
        width: 100%;
    }
    .product_article .panel .request_form button[type="submit"] { 
        font-size: 14px;
    }
    .product_article .panel .request_form h2 { 
        margin-bottom: 0 !important;
    }
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
    .container { padding: 0 10px; }
    
    .banner h1 { font-size: 24px; }
    .banner .subheading { font-size: 14px; }
    .banner .left .medicine_box img { width: 150px; }
    
    .request_form { 
        margin: 15px 5px 0; 
        padding: 20px 15px;
    }
    .request_form h2 { 
        font-size: 16px;
        margin-left: -15px;
        margin-right: -15px;
        padding: 8px 12px;
    }
    
    .usps { margin: 0 5px 15px; padding: 12px; }
    .usps li { font-size: 13px; }
    
    .syntoms ul, .syntoms2 ul, .benifits ul { padding: 0 10px; }
    .certified .outer, .effective .outer { padding: 0 10px; }
    .testimonials { margin: -6rem 10px 2rem; padding: 15px; }
    .result .outer { padding: 0 10px; }
    
    .how_use ul li { width: 100%; margin: 10px 0; }
    .how_use ul li img { width: 100px; height: 100px; }
    
    .thanks { margin: 15px 10px; padding: 15px; }
    .product_article .container { padding: 15px; }
}

/* Additional mobile fixes for common issues */
@media only screen and (max-width: 480px) {
    /* Prevent horizontal scrolling */
    body { overflow-x: hidden; }
    
    /* Fix any elements that might cause overflow */
    .container, header, .usps, .testimonials, .thanks { 
        max-width: 100%; 
        width: 100%; 
        margin-left: 0; 
        margin-right: 0; 
    }
    
    /* Ensure all images are responsive */
    img { 
        max-width: 100%; 
        height: auto; 
    }
    
    /* Fix form inputs on mobile */
    .form-control { 
        font-size: 16px; /* Prevents zoom on iOS */
        width: 100%;
        box-sizing: border-box;
    }
    
    /* Fix button touch targets */
    button, .btn, a[role="button"] { 
        min-height: 44px; 
        min-width: 44px; 
    }
    
    /* Fix text overflow */
    h1, h2, h3, p, li { 
        word-wrap: break-word; 
        overflow-wrap: break-word; 
    }
    
    /* Fix flexbox issues on very small screens */
    .banner .container, 
    .certified .outer, 
    .effective .outer { 
        flex-direction: column; 
        align-items: center; 
    }
    
    /* Fix testimonial layout */
    .testimonials article { 
        flex-direction: column; 
        text-align: center; 
    }
    
    /* Fix result comparison */
    .result .outer { 
        flex-direction: column; 
        gap: 20px; 
    }
}