/*--M RAHMAN, TO, ON CA, Mar 02, Twenty26--*/

* {
    box-sizing: border-box;
    font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;
}


*, 
*::before, 
*::after {
	box-sizing: border-box;
	-webkit-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}


@font-face {
font-family: 'segoe-ui';
	src: 
	local('segoe-ui'),
		url('../segoe-ui/segoe-ui.woff2') format('woff2'),
		url('../segoe-ui/segoe-ui.woff') format('woff');
	font-weight: normal;
	font-style: normal;
	display: swap;
}





@font-face {
  font-family: "neurofont";
  src: 
  local("neurofont"),
  url("../neurofont/neurofont.woff2") format("woff2"), 
  url("../neurofont/neurofont.woff") format("woff");
  font-display: auto;
  font-style: normal;
  font-weight: normal;
}







:root {	
	--ff-primary: system-ui, -apple-system, BlinkMacSystemFont, "Segoe-ui", "Roboto", "Helvetica Neue", 
             "Noto Sans", "Liberation Sans", Arial, sans-serif;
	--ff-secondary: 'kalpurush';
	--ff-iconic: 'maplefont';
	--fw-1: 400;
	--fw-2: 500;
	--fw-3: 600;
	--fw-4: 700;
	--clr-primary: #585555;
	--clr-light: #79797a;
	--clr-black: #676668;
	--clr-white: #ffffff;
	--clr-red:  #ff7300;
    --clr-orange: #ff7b00;
	
	--clr-blue: #1537cf;
	--clr-green:#039603;
	--clr-yellow: #c0f3f7;
	--clr-turquoise: #d5eef8;
	--clr-nav: rgb(217, 243, 253);
	--clr-bg:  #f8f8f8;
	--clr-footer: #d3f2fa;	
}





html { 
	font-size:1.0125rem;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-wrap: break-word;
	word-break: break-word;
	word-wrap: break-word;
	scroll-behavior: smooth;
}



body {
	margin: 0;
	padding: 0;
	font-family: var(--ff-primary);
	font-weight: var(--fw-1);
	background: var(--clr-bg);	
	text-rendering: optimizeSpeed;
	min-height: 100svh;
	width: 100%;
	max-width: 100%;
	overflow-x: hidden;
	overflow-y: scroll;
	-webkit-text-size-adjust: 100%;
}


/*--THE MOST BASIC PRIMARY OUTLINE--*/
.the-page-wrapper {
    width: auto;
    margin: 0;
    padding: 0;
    }


.the-page-wrapper-intro {
    width: auto;
    margin: 0;
    padding-block: 2.25svh;
	padding-bottom: clamp(3.65rem, calc(3.5rem + 3.5vh), 6.65rem);
    background: rgb(217, 243, 253);
    min-height: 65svh;
    }
    
    
   
.the-page-wrapper-main,
.the-page-wrapper-yellow {
        width: auto;
        margin: 0;
		padding-block: clamp(4.25rem, calc(4.25rem + 5.5vh), 5.75rem);
		justify-content: center;
		justify-items: center;
         }
            



.the-page-wrapper-yellow {
    background: var(--clr-turquoise);
    }


.the-page-wrapper-footer {
        width: auto;
        margin: 0;
        padding-block: clamp(4.25rem, calc(4.25rem + 5.5vh), 5.75rem);
        background: var(--clr-footer);
        }




/*--page viewport width here--*/

.the-page-container {
	width: min(55ch + 30vw, 100vw - 10.5vw);
	margin-inline: auto;
	}





    
    /*--header wrapper feb 05, 2026--*/
        header {
        background: var(--clr-bg);
        transition: background-color 0.3s ease;
        transition: transform 0.3s ease, opacity 0.3s ease;
        }
    
        .the-header-wrapper {
            height: auto;
            position: -webkit-sticky; /* Safari */
            position: sticky;
            z-index: +555;
            top: 0;
            margin: 0;
            padding-block: 0.5rem;
            display: flow-root;
            
        }
        
    /*--Header style when scrolled--*/
        header.not-display {
        background: var(--clr-bg);
        transform: translateY(-100%);
        opacity: 0;
      }
        
            
        .the-header-container {	
            margin: 0;
            padding-block: clamp(1.125rem, calc(1.25rem + 1.125vh), 2.25rem);
            display: grid;
            grid-auto-flow: column;
            justify-content: space-between;
            place-items: start;
            gap: 2.5em;
            -webkit-transition: all 0.5s ease-in-out;
            -o-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;
            }
    
        
            .the-header-container > * {
                width: auto;
                object-fit: cover;
            }
    
    
    
    /*--custom navbar menu-November2025--*/
        .the-header-container .navbar-items {
            display: grid;
            grid-auto-flow: column;
            justify-content: space-between;
            width: 100%;
        }
    
        .the-header-container .navbar-items ul li {
            list-style: none;
            outline: 0;	
        }
        
        .the-header-container .navbar-items ul {
        
            display: grid;
            grid-auto-flow: column;
            gap: 1.35rem;
            display: -moz-inline-stack;	
            justify-content: space-between;
            place-items: center;
            
            }
        
        .the-header-container .navbar-items li {
            padding: 0;
            border: 0;
            list-style: none;
            display: -moz-inline-stack;
            color: var(--clr-light);
        }
        
        .the-header-container .navbar-items li:hover {
          transform: scale(1.0);
          transition: all 0.3s ease-in-out;
        }
        
         .the-header-container .navbar-items a {
            font-size: clamp(0.95rem, calc(0.20rem + 0.75vw), 1.08rem);
            color: var(--clr-red);
            text-decoration: none;
        }
        
        
        
        
        .the-header-container .navbar-items a:hover,
        .the-header-container .navbar-items a:focus {
            text-decoration: none;
            font-weight: var(--fw-1);
            color: var(--clr-blue);
            }
        
        
        .navbar-items li:last-child::after {
                content: '';
                display: block;
                width: 100%;
                position: relative;
                height: 0.25rem;
                margin: 0;
                bottom: 1.95rem;
                background-color: var(--clr-light);
                transition: background ease-in-out 250ms linear;
                }
                
            .navbar-items li:nth-child(3):hover::after {
                background-color: var(--clr-red);
                }
        
        
    /*--header-wrapper-ended-above--*/
        
    
    #the-brand {
        font-weight: var(--fw-1);
        font-family: var(--ff-primary);
        font-size: clamp(1.275rem, 0.25rem + 1.5vw, 1.85rem);	
        margin: 0;
        padding: 0;
        display: grid;
        grid-auto-flow: column;
        grid-gap: clamp(0.0125rem, calc(0.255rem + 1.125vw), 1.125rem);
    }
    
    #the-brand a {
        color: var(--clr-light);
        text-decoration: none;
        text-transform: capitalize;
        }
        
    #the-brand :is(i) {
        color: var(--clr-red);
        text-decoration: none;
        font-size: clamp(1.5rem, calc(0.35rem + 1.75vw), 1.75rem);
        padding-block: 0.145rem;
        align-content: end;
        display: inline-block;
        transform: translateY(-5.75%);
        transition: transform 500ms ease;
    }
    
    #the-brand :is(i:hover, a:hover) {
        color: var(--clr-light);	
        }
    
    
    #contact,
    #question {
      padding-block: 0.45rem;
    }
    
    
    #question {
      border-bottom: 0.025rem dotted var(--clr-blue);    
    }
    
    #contact a,
    #question a {
      color: var(--clr-blue);
      text-decoration: none;
      font-weight: var(--fw-2);
    }
    
    #contact a:hover,
    #question a:hover {
      color: var(--clr-light);
      }
    
    



      
      /*--basic Setup above2026-*/
      
              
      .the-intro-container  {
          display: grid;
          width: 100%;
          grid-template-columns: repeat(auto-fit, minmax(min(35.5rem, 100%), 1fr));
          gap: 2.125rem;
          margin: 0;	
          padding: 0;
          }
      
      
              
      .the-main-container  {
          display: grid;
          grid-template-columns: repeat(auto-fit, minmax(min(12.5rem + 7.5vw, 100%), 1fr));
          gap: 2.125rem;
          margin-block: clamp(5.5vh, calc(1.25rem + 4.5vh), 7.5vh);
          width: 100%;
          padding: 0;
          }
      
          
               
          .the-main-container > div:nth-child(2) {
              grid-column: auto;
          }
      
      
          .the-main-container > * {
              width: 100%;
              object-fit: cover;
              }
      
          
      .the-main-container-yellow  {
              display: grid;
              grid-template-columns: repeat(auto-fit, minmax(min(15.5ch, 100%), 1fr));
              gap: 2.125rem;
              margin-block: clamp(5.5vh, calc(1.25rem + 4.5vh), 7.5vh);
              width: 100%;
              }
      
          
      
      
          .the-main-container-yellow > * {
              width: 100%;
              object-fit: cover;
              }
      
          
      
                   
      
      
      .the-child-container {
          display: grid;
          width: 100%;
          margin: 0;	
          padding-block: clamp(2.85vh, calc(0.25rem + 2.85vh), 4.5vh);
          grid-template-columns: repeat(auto-fit, minmax(min(15.85rem + 7.5vw, 100%), 1fr));
          gap: 1.125rem;	
          }
       
      
      .the-child-container > div {
          width: 100%;
          object-fit: cover;
          }
      
      
      
      
      .the-baby-container {
          display: grid;
          width: 100%;
          margin: 0;	
          padding: 0;
          grid-template-columns: repeat(auto-fit, minmax(min(9.125rem + 3.25vw, 100%), 1fr));
          gap: 1.125rem;
          }
       
      
          .the-baby-container > div {
          width: 100%;
          object-fit: cover;
          }
      
      
          .border {
            border-top: 0.125rem solid #848385;
            margin-block: 4.125svh; 
          }
      
      
      
      
      
      
      /*--footer--*/
      .the-footer-container {
          display: grid;
          width: 100%;
          margin: 0;
          padding: 0;
          grid-template-columns: repeat(auto-fit, minmax(min(15.5rem, 100%), 1fr));	
          gap: 2.5rem;	
      }

      .the-footer-container > div {
        width: 100%;
        object-fit: cover;
        }
      
      /*--FOOTER ENDED ABOVE--*/





      
      /*--the side-navbar--overlay screen--*/
      .the-sidenav {
          display: grid;
          width: 0%;
          grid: auto-flow / minmax(7.5vw, 1fr) minmax(35vw, 100%) minmax(7.5vw, 1fr);
          min-height: 85%;
          min-height: 85dvh;	
          position: fixed;
          top: 0;
          right: 0;
          background: var(--clr-nav);
          overflow: hidden;
          transition: 0.5s ease-in-out;
          padding: 2.125rem 0;
          z-index: 999;
          justify-content: space-between;
          place-items: start;
          }
      
      .the-sidenav > * {
          grid-column: 2 / 3;
          object-fit: cover;
          }
          
          
      
      .the-sidenav .the-sidenav-header :is(h2) {
          font-size: clamp(1.25em, 2.125vw + 0.65rem, 2.65em);
          padding-block: 1.25rem;
          margin: 0;
          color: var(--clr-light);
          text-decoration: none;
      }
      
      
      
      
      .the-sidenav-container {	
          width: 100%;
          min-height: 55vh;
          min-height: 55dvh;	
          padding: 0;
          display: grid;
          grid-template-columns: repeat(auto-fit, minmax(min(12.5rem, 100%), 1fr));
          gap: 2.5125rem;
          position: relative;	
          place-content: center;
          justify-content: end;
          }
      
      .the-sidenav-container :is(ul, li) {
          list-style: none;
          text-decoration: none;	
          margin: 0;
          width: 100%;
          border: 0;
          outline: 0;
          text-align: right;
              
      }
      
      
      .the-sidenav-container :is(li) {
          width: 100%;
          font-size: clamp(1.05rem, calc(0.125rem + 0.65vw), 1.35rem);
          font-weight: var(--fw-1);
          line-height: 1.45;
          padding-block: 0.45rem;
          color: var(--clr-light);
          border-top: 0.010rem solid #848385;
      }
      
      
      
      
      
      .the-sidenav  .closebtn {
        position: absolute;/*absolute/relative can be used*/  
        font-size: clamp(2.75rem, calc(2.25rem + 2.75vw), 5.5rem);
        font-weight: var(--fw-2);
        line-height: 1;
        padding: 2.25rem 0;
        text-decoration: none;
        color: var(--clr-black);
        top: 0;
        right: 0;
        z-index: 999;  
        }
        
        .the-sidenav  .closebtn::after {
        position: relative;/*absolute/relative can be used*/  
        font-size: clamp(2.75rem, calc(2.25rem + 2.75vw), 5.5rem);
        font-weight: var(--fw-2);
        content: " ";
        display: block;
        width: 4.125rem;
        height: 0.165rem;
        background-color: var(--clr-blue); 
        transform: rotate(180deg);
          margin-block: 1.85rem;
        }
        
          
      
      
      body :where(a, a:active) {
          color: var(--clr-red);
          text-decoration: none;
          }
          
      body :where(a:hover) {
          text-decoration: none;
          color: var(--clr-black);
      }
          
      
      body :where(ul, li) {
          width: 100%;
          list-style: none;
          border: 0;
          margin: 0;
      }
      
      body :where(li) {
          width: 100%;
          font-size: clamp(0.98rem, calc(0.75vw + 0.25rem), 1.6rem);	
          line-height: 1.25;
          padding-block: 0.45rem;
          color: var(--clr-light);
          border-top: 0.010rem dotted var(--clr-light);
      }
      
      * :is(p) {
          color: var(--clr-light);
          font-family: var(--ff-primary);
          font-size: clamp(1.05rem, calc(0.25rem + 0.65vw), 1.15rem);
          line-height: 1.5;
          padding-bottom: 2.65rem;
          word-spacing: 0.01em;
          letter-spacing: 0.01em;
          text-rendering: optimizeLegibility;
          }
      
          
      .bangla {
          font-family: var(--ff-secondary);
          }
      
      * :is(i) {
          display: inline-flex;
          flex-direction: row;
          flex-wrap: wrap;
          text-decoration: none;
          font-family: var(--ff-iconic);
          font-size: clamp(1.5rem, 0.15rem + 2.25vw, 2.25rem);
          margin-right: 0.75vw;
          padding-block: 0.5rem;
          border-right: 0.015rem dotted var(--clr-light);
          color: var(--clr-red)
      }
      
      * :is(i:hover) {
          color: var(--clr-light);
          -webkit-transform: translateY(-2.25rem);
          transform: translateY(-2.75rem);
          transition: transform 0.5s ease-out;
          }
          
     
      
        
        
      
        h1, h2, h3, h4, h5 {
          line-height: 1.1;
          margin-bottom: 1.5svh;
          color: var(--clr-light);
          text-rendering: optimizeLegibility;
          font-family: var(--ff-primary);
          font-weight: var(--fw-4);
      }
      
      h1 { color: var(--clr-light);
          font-size: clamp(1.75rem, 0.125rem + 3.5vw, 3.5rem);
      }
      
      h2 { font-size: clamp(1.25rem, 0.150rem + 2.5vw, 2.125rem);
      }
      
      h3 { font-size: clamp(1.15rem, 0.25rem + 3.65vw, 1.75rem);	
      }
      
      h4 { font-size: clamp(1.07rem, calc(1.07rem + 2.15vw), 1.45rem);
          letter-spacing: 0.01rem;
          }
      
      
      h5 { font-size: clamp(1.07rem, calc(1.125rem + 2.5vw), 1.35rem);
          letter-spacing: 0.02rem;
      }
      
      
      
      
      
      
      
      img,
      picture,
      video {
          width: 100%;
          max-width: 100%;
          margin-bottom: 0.25rem;
          display: block;
          object-fit: cover;
          margin-inline: auto;
          }
          
          img:hover,
          picture:hover,
          video:hover {
          transform: translateY(-2.75%);
          transition: transform 500ms ease;
          opacity: 0.7;
      
          }
      
    .service-card:hover {
              transform: scale(107%);
              transition: all linear 500ms ease-in;
              padding: 1.5rem;
               }
          
      



               
/*--long arrow icon--*/
    .long-arrow-right {
                   display: inline-block;
                   position: relative;
                   width: 25px;
                   height: 25px;
                   border-top: 3px solid var(--clr-red);
                   border-left: 3px solid var(--clr-red);
                   transform: rotate(+180deg); 
               }
               
               
               
    .long-arrow-right::before {
                 content: "";
                 display: block;
                 width: 2.5px;
                 height: 45px;
                 background-color: var(--clr-light);
                 transform: rotate(-45deg) translate(15px, 3px);  
               }
               
    .long-arrow-right:hover {
                   transform: translateY(-2.75%);
                   transition: transform 500ms ease;
                   }
        /*--long-arrow-right--*/




        
        /*--MEDIA QUERY BELOW--*/
        
        
 @media only screen and (max-width: 55.125rem) {
        .the-header-container .navbar-items ul li {
            display: none;
            }

                      
        .the-main-container > div:nth-child(2n + 2) {
            display: none;
            }
        
        .the-main-container-yellow > div:nth-child(2) {
                display: none;
                } 
        
        .space {
        display: none;
        }
        
           
        
        
        
        /*--hamburger icons--APR TWENTY 24-TO CA--*/
    #hamburger-icon {
            display: inline-block;
            cursor: pointer;
            justify-content: center;
            place-content: center;  
            }
        
        .bar1, .bar2, .bar3 {
            -webkit-transition: all 0.5s ease-in-out;
            -o-transition: all 0.5s ease-in-out;
            transition: all 0.5s ease-in-out;	
            height: 0.19rem;
            margin: 0.35rem 0;
            }
        
        .bar1,
        .bar3 {
            width: 2.75rem;
            background-color: var(--clr-light);
            }
            
        .bar2 {
            width: 1.85rem; 
            background: var(--clr-red);
            }	
        
/*--hamburger--*/		
        }
/*--Media Query ended--*/







        
/*cursor effects*/
        #cursor {
            width: 20px;
            height: 20px;
            background-color: var(--clr-blue);
            border-radius: 50%;
            position: fixed;
            pointer-events: none;
            transform: translate(-50%, -50%);
            transition: opacity 0.2s;
            z-index: 9999;
        }
        
        #cursor.hide {
        opacity: 0;
        }





/*--outline ended--*/
















/*--SEARCH BOX--*/

.search-card {
    width: 100%;  
    overflow: hidden;
    transition: all 0.2s ease;
}

.search-header {
    padding: 0;
    margin: 0;
}



.search-box {
    display: flex;
    flex: 1;
    gap: 0.25rem;
    align-items: left;    
    border: 1px solid #515152;
    border-radius: 60px;
    padding: 4px 4px 4px 24px;
    margin-block: 3.5svh;
    transition: 0.15s;
}

.search-box:focus-within {
    border-color: var(--clr-light);
    
}

.search-box input {
    flex: 1;
    border: none;
    padding: 13px 0px 13px 0;
    font-size: 0.99rem;
    background: transparent;
    outline: none;
    color: var(--clr-blue);
}

.search-box input::placeholder {
    color: var(--clr-light);
    font-weight: 400;
    font-size: 0.85rem;
}

.search-box button {
    background: var(--clr-red);
   border: none;
   width: max-content;
    color: var(--clr-white);
    font-weight: var(--fw-1);
    padding: 1.25svh 2.125vw;
    border-radius: 40px;
    font-size: 0.99rem;
    cursor: pointer;
    transition: 0.1s;
    align-items: center;
}

.search-box button:hover {
    background: var(--clr-primary);
    border-color: var(--clr-primary);
}

.stats {
    padding: 0;
    font-size: 0.9rem;
    color: var(--clr-primary);
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.clear-btn {
    background: var(--clr-light);
    border: none;
    color: #f3f5f8;
    font-size: 0.9rem;
    cursor: pointer;
    padding: 1.25svh 1.85vw;
    border-radius: 20vw;
}

.clear-btn:hover {
    background: var(--clr-blue);
}

.results-area {
    padding-block: 2.5svh;
    margin-block: 2.5svh;
}

.result-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
}

.result-card {
    background: transparent;   
    padding-block: 2.25svh;
    transition: 0.1s;
}

.result-card.match-title {
    border-left-color: var(--clr-blue);
    background: transparent;
}

.result-card a {
    text-decoration: none;
    font-weight: var(--fw-1);
    font-size: 1.25rem;
    color: var(--clr-blue);
    display: inline-flex;
    flex-wrap:wrap;
    align-items: center;
    gap: 8px;
}

.result-card a:hover {
    color: var(--clr-orange);
    text-decoration: none;
}

.url-badge {
    font-size: 0.99rem;
    background: var(--clr-blue);
    color: var(--clr-white);
    padding: 3px 10px;
    margin: 0;
}

.snippet {
    margin: 0;
    color: var(--clr-primary);
    line-height: 1.5;
    font-size: 0.96rem;
    word-break: break-word;
}

.highlight {
    color: var(--clr-blue);
    font-weight: var(--fw-3);
    text-decoration: underline;
    
}

.no-results {
    padding: 0;
    color: var(--clr-red);       
    font-size: 1.1rem;
}

.footer-note {
    
    padding: 0;
    font-size: 0.8rem;
    color: var(--clr-blue);
}

.footer-note p {
    margin: 0;
}
/*--ended--*/