*{
    margin:0;
    padding:0;
    box-sizing: border-box;
    list-style: none !important;
    text-decoration: none !important;
}
html {
    scroll-behavior: smooth;
}
#hr-primary {
    /* background:rgb(125, 237, 14); */
    background:transparent;
    pointer-events: none;
    height: 5px;
    width:100%;
    position:fixed;
    bottom:0;
}

@font-face {
    font-family: 'Merriweather';
    src: url('./font/Merriweather-VariableFont_opsz\,wdth\,wght.ttf');
}
@font-face {
    font-family: 'Merriweather-italic';
    src: url('./font/Merriweather-Italic-VariableFont_opsz\,wdth\,wght.ttf');
}

/* background  colors */
:root{
    --bg-primary:lightblue;
    --bg-secondary:#FEDC56;
    --bg-tertiary:#f00;
    --bg-tint:#fff;
    --bg-shade:#000;
    --bg-slogan:#464f58d4;
    --bg-description:#464f5879;
    --bg-column:#464f58b7;
    --bg-services:rgba(31, 38, 135, 0.37);
    --header-primary:#F3F8f9;
}

/* colors */
:root{
    --col-primary:#000;
    --col-secondary:#fff;
    --col-tertiary:var(--bg-secondary);
    --col-subheader:#FF8DA1;
}
/* fonts */
:root {
    --font-header:'Merriweather',Arial, Helvetica, sans-serif;
    --font-header-italic:'Merriweather-italic', Arial, Helvetica, sans-serif !important;
    --font-secondary:Arial, Helvetica, sans-serif;
}
.white {
  background-color:var(--bg-tint);
}
body{
    height:100vh;
    width:100%;
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    scroll-behavior: smooth;
}
#logo-link{
    display:flex;
    align-items:center;
    justify-content: start;
    transform:Scale(.88);
    flex-direction: row;
}
#logo-link.underline{
    border-bottom:1px solid var(--bg-secondary);
}
.text-shadow-reg{
    text-shadow: .75px .75px var(--bg-description);
}
.text-shadow-max{
    text-shadow: .75px .75px var(--bg-shade);
}
#logo-link>#acro {
    margin-top:1rem;
    color:var(--col-subheader);
    font-family: var(--font-header-italic);
    font-size:32pt;
    display:flex;
    align-items:end;
    flex-direction: column;
    padding:4px;

}
#logo-link>img{
        margin-top:.5rem;
        height:80px;
        width:140px;
        /* box-shadow:0 5px 8px .014px var(--bg-secondary); */
    }
    #logo-link>em {
        font-size:21pt;
        color:var(--col-subheader);
        margin-left:.5rem;
    }

    #counsel {
        transform:translate(0,3.5px) !important;
        height:60px !important;
        width:200px !important;
}
#faq-toggle,
.disable-highlight,
.nav-mobile-list-link,
.nav-list-item > a{
      -webkit-touch-callout: none; /* iOS Safari */
  -webkit-user-select: none; /* Safari */
  -khtml-user-select: none; /* Konqueror HTML */
  -moz-user-select: none; /* Old versions of Firefox */
  -ms-user-select: none; /* Internet Explorer/Edge */
  user-select: none; /* Standard syntax */
}

main{
    height:100%;
    width:100%;
    padding: 0 1rem;
}

#home{
    display:flex;
    flex-direction:column;
    align-items: end;
    padding:0 .75rem;
    justify-content: end;
    opacity:1 !important;
    box-shadow: 0 -.25rem 12px .9px var(--bg-description);
}
#about {
    min-height:115vh;
    overflow-y: scroll;
    padding-bottom:1.5rem;

}
#about-wrapper{
    display:flex;
    flex-direction:column;
    align-items: center;
    padding:0 .75rem;
    justify-content: center;
}
#about-me-para, #contact-desc-para{
    overflow: hidden;
    display:inline;
}
#linked-in{
    border-radius: 50%;
    background:transparent;
}
#linked-in:hover,
#linked-in:active{
    cursor:pointer;
    transform:scale(.9)
}
#about-me-para-actual, #contact-para{
    text-align: left;
    padding:.25rem;
    font-size:14pt;
    font-family: var(--font-header-italic);
    letter-spacing: 1.5px;
}
#about-me-para-actual{
    color:var(--col-secondary);
}

#contact {
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: start;
    width:100%;
    gap:2rem;
}
.contact-list-item{
    text-align: center;
}
#contact-icon-container{
    width:50%;
    text-align: center;
    display:flex;
    align-items: center;
    justify-content: space-between;
}
#contact-display-container{
    width:95%;
    height:100%;
}
#contact-info-container{
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap:.5rem;
}
.contact-answer{
    font-size:11pt;
    font-weight: bold;
}
.contact-label,.contact-answer {
    font-family: var(--font-header);
}
#contact-para{
    font-weight: bold;
    color:var(--col-primary);
    width:90%;
    line-height: 1.25rem;
    text-align: center;
    border: 2px solid var(--col-primary);
    border-top:none !important; 
    border-left:none !important; 
    border-right:none !important; 
    padding:.5rem;
    border-radius: 20px;
}
#contact-desc-para{
    display:flex;
    height:100%;
    flex-direction:column;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-height:100px;
}
.section-gen-link{
    transition:.5s;
    height:100vh !important;
    width:100%;
    overflow: hidden;
    position:relative;
    scroll-margin-top: 80px; /* Adjust this value as needed */
}
.hide-element{
    display:none !important;
}
.appear-section {
  opacity:1;
}


#cover-phrase-container{
    width:60%;
    display:flex;
    flex-direction: row;
    align-items: center;
    justify-content: end;
    padding:1rem;
    height:100%;
}
#about-phrase {
    text-align: center;
    margin:1.5rem 0;
}
#cover-phrase{
    text-align: right;
    margin-bottom:5rem;
}
#cover-phrase,#about-phrase{
    color:#fff;
    z-index: 998;
    font-size:36pt;
    min-width:300px;
    max-width:700px;
    font-family:var(--font-header);
    letter-spacing:.95px;
}
#cover-phrase>p,#about-phrase>p{
    display:inline;
}

.italic-word {
    font-size:55px;
    color:var(--col-tertiary);
    font-family: var(--font-header-italic)
}
.pink-txt{
    color:var(--col-subheader) !important;
}

header{
    background:var(--header-primary);
    box-shadow: 0 -.25rem 12px .9px #333;
    width:100%;
    height:80px;
    position:fixed;
    display:flex;
    flex-direction: row;
    align-items: start;
    justify-content: center;
    overflow:hidden;
    z-index:999;
    left:0;
}
footer{
    margin-top:1rem;
    padding:.25rem 0;
    width:100%;
    border-top:.5px solid #000;
    /* background:#000; */
}
.footer-vc{
    text-decoration: none;

    color:var(--shade);
}

#coded-by-div,
#rights-para{
    text-align: center;
    font-size:11pt;
    font-family:var(--font-header);
    letter-spacing: 1px
}

#coded-by-div>a{
    color:rgb(14, 103, 14);
}

#coded-by-div{
    width:100%;
    display:flex;
    justify-content: center;
    align-items: center;
    gap:8px;
}
/* ---------------- learn more ---------------- */
.learn-more {
    text-decoration:underline;
    text-decoration-thickness: .25px;
    text-decoration-line:underline;
    padding:.75rem 1.25rem;
    border-radius: 16px;
    background:var(--col-tertiary);
    border:none;
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-evenly;
    font-family:var(--font-header);
    font-size:21pt;
    position:absolute;
    color:var(--col-primary);
    transition:.25s;
}
.learn-more-config{
    top:75%;
    left:100px;
    display:inline;
}
.learn-more:hover{
    background:#333;
    color:var(--col-secondary)
}
/* ---------------- learn more ---------------- */



/* ---------------- header/navigation ---------------- */
#nav{
    display:flex;
    flex-direction: column;
    align-items: end;
    justify-content: start;
    padding-right:.25rem;
    margin-top:.75rem;
}
#nav-mobile {
    display:none;
}
#hamburger-container{
    display:none;
}
#nav > #nav-list-container{
    width:100%;
    display:flex;
    justify-content: end;
    align-items: end;
    padding: 0 0 .5rem 0;
}
.nav-list-item>a{
    padding:.5rem .55rem;
    margin-left:5px;
    background:transparent;
    font-family:var(--font-header-italic);
    color:var(--col-priary);
    font-weight:bold;
    font-size:12pt;
}
.target-link{
    border-bottom:5px solid var(--col-subheader);
}
/* ---------------- header/navigation ---------------- */



/* ---------------- attention getter ---------------- */
/* profile image */

#img-pro{
    transition:.5s;
    height:350px;
    width:270px;
    z-index: 997;
    border-radius: 50%;
    box-shadow: 0 1.25px 12px .9px var(--bg-secondary);
    margin-bottom: 1.5rem;
}
#img-cert {
    /* background:var(--bg-tint); */
    width:150px;
    left:50%;
    position:absolute;
    transform:translate(-200px,200px);
}
.slogan-actual-top,
.slogan-actual-bottom{
    width:100%;
    position:absolute;
    left:0;
    padding:.75rem .5rem;
    font-size:18pt;
    letter-spacing:1.5px;
    color:#fff;
    font-weight: bold;
    /* z-index: 997; */
    border-bottom:none;
    background-image:linear-gradient(100deg,#3537435a,var(--bg-slogan),#4c575e75);
    font-family:var(--font-header-italic)
}
.slogan-actual-bottom{
    bottom:0;
    border-top:.5px solid #fff;
    text-align: left;
}
.slogan-actual-top{
    top:0;
    /* border-bottom:.5px solid #fff; */
    text-align: right;
}


/* certification */
#cert {
    color:var(--col-secondary);
    text-align: right;
    text-shadow: .25px .25px rgb(0, 0, 0);
    font-family: var(--font-header-italic);

}#certification{
    margin-bottom:3rem;
    letter-spacing: 1.15px;
    font-size:11pt;
    width:50%;
    min-width:200px;
}


/* icons */
.learn-more-config > img {
    height:25px;
    width:25px;
    float:right;
    margin-top:4px;
    margin-left:8px;
}


/* --------------------------------------- Sections in detail --------------------------------------- */

 #problem {
    display:grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    align-items: center;
    justify-content: center;
    grid-template-areas:"c a"
                        "c b";
}
.a { grid-area: a; }
.b { grid-area: b; }
.c { grid-area: c;}
.flex-method{
    align-items: start;
    justify-content: end;
}

.alone,.take-action,.servicing,.faq-subheader,.contacting{
    display:flex;
    width:100%;
    align-items: end;
    gap:1rem;
    padding:0 .75rem;
}
.mix-blend {
mix-blend-mode: difference !important;
}
.alone,.take-action,.faq-subheader{
    color:var(--col-secondary);
}

.servicing{
    color:var(--bg-slogan);
}
.contacting{
    color:var(--col-secondary);
    padding:.5rem 0;
    justify-content: center;
    text-align: center;
}
.servicing{
    padding:.5rem .75rem !important;
    justify-content: end;
}
.faq-subheader{
    text-align: left;
    padding:.5rem .75rem;
}
.alone{
    position:absolute;
    bottom:10%;
    right:5px;
    justify-content: end;
}
.take-action{
    top:0;
    left:5px;
    justify-content: start;
}

.section-subheader>h2 {
font-size:32pt;
font-family: var(--font-header);
transition: .5s;
}
.no-background{
background:none !important;
}
.border-top {
    border-top:.5px solid var(--col-secondary);
}
.b{
    border-top:.5px solid #fff;
}
.section-col{
    overflow:hidden;
    height:100%;
    width:50%;
    padding:.75rem .5rem;
    position:relative;
}

.text-align{
    text-align: center !important;
    margin-top:2rem;
}
.section-col>.description{
    height:100%;
    width:100%;
}
.section-col>.description>p {
    font-size:18pt;
    color:var(--col-secondary);
    font-family: var(--font-header-italic);
    text-align: left;
    line-height:double;
}


#problem > .section-col{
    width:100%;
    background:var(--bg-column);
}
#services{
    height: 150vh !important;
    display:flex;
    flex-direction: column;
    background-color:var(--bg-services);
}
#services-span{
    color:var(--col-primary);
    width:100%;
    font-weight: bold;
    border-bottom:4px solid #333;
    background:transparent;
    padding:.25rem .5rem 0;
    font-family:var(--font-header-italic);
    font-size:21pt;
}
#services>#column-container{
    height:100% !important;
    width:100%;
}
#services > #column-container > .section-col{
    height:inherit !important;
    overflow-y:scroll;
    width:inherit;
}

.cta-mail,.cta-phone{
    position:absolute;
    top:25%;
    left:50%;
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap:.5rem;
    text-align: center;
    width:100%;
    color:var(--col-primary);
    z-index: 998;
}
#cta-label {
    font-family: var(--font-header-italic);
}
.cta-mail{
    transform:translateX(-50%) translateY(-25%);
}
.cta-phone{
    transform:translateX(-50%) translateY(110%);
}
.cta-mail>img,.cta-phone>img{
    transition: .25s;
    transform:scale(.88)
}
.cta-mail>img:hover,.cta-mail>img:active,
.cta-phone>img:hover,.cta-mail>img:active{
    transform:scale(1.05);
    box-shadow: 0 12px 12px .9px rgba(0, 0, 0, 0.8); /* Optional: Add a subtle shadow */
}

#mail-container{
    height:100%;
    width:100%;
    position:relative;
}


.hands > div{
    height:100%;
    display:flex;
    flex-direction: column-reverse;
}

/* --------------------------------------- Sections in detail --------------------------------------- */







/* --------------------------------------- cloud --------------------------------------- */

.cloud-container {
  position: relative; /* Essential for positioning the cloud parts */
  border-bottom:.25px solid var(--bg-description);
  padding:.75rem 0 1.5rem;
  width:100%;
  display:flex;
  align-items: center;
  flex-wrap:wrap;
  justify-content: center;
  overflow-x:scroll;
  overflow-y:hidden;
  gap:.5rem;
}
.cloud>p {
  font-family: var(--font-header-italic);
    z-index:999;
    width:185px;
    display:flex;
    align-items: center;
    justify-content: center;
    overflow-x:scroll;
    overflow-y:hidden;
    height:100%;
}

.no-scrollbar::-webkit-scrollbar {
  display: none; /* Hides the scrollbar */
}
.cloud {
border-bottom: .75rem solid white;
border-left: .75vw solid transparent;
border-right: .75vw solid transparent;
background-image: linear-gradient(180deg,transparent 25%, white );
border-radius:75px; /* Creates the main rounded base */
box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); /* Optional: Add a subtle shadow */
display:flex;
align-items: center;
text-align: center;
justify-content: center;
font-family: var(--font-header);
height: 80px;
}

 .cloud-hidden{
    opacity:0;
 }
.cloud::before,
.cloud::after {
  content: '';
  position:absolute;
  background-color: white;
  z-index: 1; /* Ensure they appear above the main cloud body */
}


/* --------------------------------------- cloud --------------------------------------- */


/* --------------------------------------- faq area --------------------------------------- */
#faq{
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-bottom:1rem;
    background-color:var(--bg-description);
    height:100%;
}
.rates-list-container{
    height:100%;
    flex-direction: column;
    display:flex;
    align-items: center;
    gap:1.25rem;
    justify-content: center;
}
.deal-icon{
    float:right;
    background:var(--col-secondary);
    box-shadow: inset 0 0 5px .9px var(--bg-secondary);
    border-radius: 2px;
}

.faq-container { 
    margin:.25rem .05rem auto;
    background-color:#fff;
    padding: 0 .25rem .75rem;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
    width: 100%;
    overflow:hidden;
    transition:.5s !important;
}
#faq-toggle:hover{
    cursor:pointer;
    background-color:var(--bg-tint);
    color:var(--col-subheader);
}
#faq-toggle{
    border-top:none !important;
    z-index: 999;
    background-color:var(--bg-description);
    color: var(--col-primary);
    position:absolute;
    left:50%;
    transform:translate(-50%,0);
    width:150px;
    height:30px;
    border-radius: 0 0 12px 12px;
    border:.75px solid #000;
    padding:.25rem;
    text-align: center;

}
.faq-close{
    height:0 !important;
}

h2 {
    text-align: center;
    color: #333;
    margin-bottom: 30px;
}

.faq-item {
    border-bottom: 1px solid #eee;
}

.enlarge-div {
    height:160vh !important;
}
.faq-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
    display:flex;
    height:100%;
    width:100%;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    cursor: pointer;
    padding: 10px 0;
}

.faq-question h3 {
    width:100%;
    margin: 0;
    color: var(--bg-shade);
    font-size: 18pt;
    padding:.25rem .5rem;
}
.faq-question h3:hover {
    background:rgba(204, 198, 191, 0.517);
    color:var(--bg-shade);
}

.toggle-icon {
    font-size: 1.5em;
    color: #888;
    transition: transform 0.3s ease;
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    overflow-y:scroll;
}
.faq-question p,.faq-answer p, .rates-list-item>p {
    font-family: var(--font-header) !important;
}
.faq-answer p {
    margin-top: 10px;
    color: var(--bg-shade);
    line-height: 1.6;
    font-size:12pt;
}

/* Styles for when an FAQ item is active/expanded (requires JavaScript to toggle a class like 'active') */
.faq-item.active .faq-answer {
    max-height: 200px; /* Adjust as needed for content height */
    transition: max-height 0.5s ease-in;
}
.faq-item.active:last-child .faq-answer {
    max-height: 475px; /* Adjust as needed for content height */
    transition: max-height 0.5s ease-in;
}

.faq-item.active .toggle-icon {
    transform: rotate(45deg);
}


/* rates */
.rates-list-container{
    padding:.25rem;
    border-radius: 12px;
    width:100%;
}
.rates-list-container>li:not(.rates-list-container>li:first-child){
    margin-left:1rem;
}


.rates-basic > .rates-col > h3 {
    border-bottom: 4px solid var(--bg-shade);
}

.rates-basic > .rates-list-item {
    border:4px solid #000;
    border-radius: 12px;
    padding:.25rem;
    background:var(--bg-slogan);
}
.rates-basic{
    width:100%
}
.rates-title-h2{
    margin-top:1rem;
    border-bottom: .5px solid #000;;
    margin-bottom:1rem;
    text-align: left;
}
.rates-special{
    float:right;
    border:4px solid var(--col-subheader);
    background:var(--bg-slogan);
    width:100%;
    display:flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.rates-special > li > p,
.rates-special > li > h3,
.rates-basic > li > p {
    color:var(--col-secondary);
}
.rates-list-container > li > h3{
    font-size:18pt;
}
.bold-text{
    font-weight:bold
}
.rates-col>h3{
    padding:.5rem 0;
}
/* --------------------------------------- faq area --------------------------------------- */


/* --------------------------------------- media query --------------------------------------- */
/* media query portrait mobile (width) */
@media screen and (max-width:1010px) {
    #about {
    min-height:125vh;
    overflow-y: scroll;
    padding-bottom:1.5rem;

}
    .alone,.faq-subheader{
        text-align: center;
        align-items: center;
    }
    .cta-mail > img,.cta-phone>img {
        height:88px;
    }
    .section-gen-link{
    scroll-margin-top: 65px; /* Adjust this value as needed */
    }

    .hands>div {
        margin-top:1.5rem;
    }
    .hands {
        background-size:cover;
        background-position:unset;
        justify-content: start;
    }
    .faq-question h3{
        font-size:16pt;
    }
    .faq-answer p{
        font-size:11pt;
    }
    .justify-content-important {
        justify-content: center !important;
    }
    .section-subheader>h2{
        font-size:24pt
    }
    #home{
    display:flex;
    flex-direction:column;
    align-items: end;
    padding:0 .75rem;
    justify-content: end;
    opacity:1 !important;
    /* margin-top:7.25rem; */
}

#problem {
    height:100vh !important;
    display:grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    align-items: center;
    justify-content: center;
    grid-template-areas:"c a"
                        "b b";
}

 .section-col>.description>p {
    text-align: left;
    font-size:16pt;
}
.section-col{
    height:100%;
    padding:.75rem .5rem;
    width:100% !important;
}
#counsel {
    transform:translate(0,13.5px) !important;
}

    .target-link{
        /* color: var(--col-primary) !important; */
        color: var(--col-subheader) !important;
        border-bottom:4.5px solid var(--col-subheader);
        /* background:var(--bg-tint) !important; */
    }

    body {
        padding:0 .5rem;
    }
    .learn-more-config{
        left:unset;
        right:25px;
        bottom: 50px;
        top:unset;
    }
    .learn-more {
    padding:.75rem .88rem;
    border-radius: 16px;
    border:none;
    font-family:var(--font-header);
    font-size:16pt;
}
    #nav{
        display:none;
    }
    #nav-mobile{
        display:block;
        width:100%;
        top:80px;
        z-index:999;
        border:2px solid var(--bg-tint)
    }
    .relative-nav{
        position:relative;
    }
    .fixed-nav{
        position:fixed;
        left:0;
    }
    #nav-mobile>#nav-mobile-list-container{
        display:flex;
        flex-direction:column;
        width:100%;
        gap:1.75px;
        background:#fff;
    }

    .nav-mobile-list-link {
        transition:.25s;
        width:100%;
        text-align: center;
        font-family:var(--font-header-italic);
        font-size:12pt;
        background:var(--bg-shade);
        color:var(--col-secondary);
        font-weight:400;
        padding:16px 0;
        color:silver;
    }
    .squish-link {
        padding:.75rem 0 !important;
    }
    .nav-mobile-list-link:hover{
        cursor:pointer;
        background:var(--bg-tint);
        color:var(--col-primary);
    }

    #hamburger-container{
        display:block;
        position:absolute;
        top:15px;
        right:15px;
        background:transparent;
        height:50px;
        width:50px;
        display:flex;
        flex-direction: column;
        align-items:center;
        justify-content: center;
        gap:5px;
        transition: .2s;
    }
    #hamburger-container:hover{
        cursor:pointer;
        transform:scale(.97)
    }
    .hamburger-span{
        width:66%;
        height:5px;
        transition: .25s;
    }
    .disabled{
        background:var(--col-subheader);
    }
    .enabled {
        background:var(--col-subheader);
    }

    .s1-rotate{
        transform:translate(0,10px) rotate(-45deg);
    }
    .s2-disappear{
        opacity:0;
        pointer-events: none;
        transform:translate(-100px,0);
    }
    .s3-rotate{
        transform:translate(0,-10px) rotate(45deg);
    }

    .slogan-actual-top,
    .slogan-actual-bottom{
        font-size:12pt;
    }
    #home{
        align-items: start;
        justify-content:end;
    }
     #cover-phrase-container{
        width:66%;
        margin-bottom:2.25rem;
        align-items:end;
     }
    #cover-phrase{
        text-align:start;
        font-size:32pt;
        margin-bottom:3rem;
    }
    .italic-word {
        font-size:45px;
    }
    #cert{
        text-align: left;
    }
}
@media screen and (max-width: 695px) {
    #about-me-para-actual,#contact-para{
        font-size:11pt;
    }
    .cta-mail>img,.cta-phone>img{
        height:77px
    }

    #img-pro{
    transition:.5s;
    height:225px;
    width:170px;
    z-index: 997;
    border-radius: 50%;
    box-shadow: 0 1.25px 12px .9px var(--bg-secondary);
    margin-bottom: 1.5rem;
}
    #img-cert {
    transform:translate(-135%,100%);
    width:110px;
}
    .italic-word {
        font-size:35px;
    }
    #mail-container {
        max-height:350px !important;
        /* border:2px solid green; */
    }
    .hands {
        background-size: cover;
    }
    #about-phrase {
        text-align: center;
        margin-bottom:1.5rem;
        line-height:1.5rem;
    }
   
    #about-phrase>p,.faq-question h3 {
        font-size:16pt !important;
    }
    .rates-list-container > li > h3{
    font-size:14pt !important;
    }
    .rates-special{
    float:unset;
    width:100% !important;
    }
    .rates-col{
        text-align: center;
    }
    #about {
        min-height:100vh !important;
    }
    
    #nav-mobile{
        top:80px;
    }
    #logo-link{
        /* border:2px solid red; */
        padding:0;
        justify-content: start;
        align-items: center;
        transform:scale(.78) translate(-30px,-15px);
    }
    .faq-subheader{
        justify-content: center;
    }
    
    .section-subheader>h2{
        font-size:21pt;
    }
    #services > .section-subheader{
        display:block;
    }
   #services{
    height: 100% !important;
    }
    .section-col>.description>p {
        text-align: left;
    }
    #services > #column-container {
        grid-template-columns: 1fr;
    }
    .alone,.take-action,.contacting{
        flex-direction: row;
        align-items: center;
        gap:.6rem;
    }
    .servicing,.faq-subheader{
        justify-content: center;
        align-items: center;
    }
    .text-align{
        text-align: left !important;
        margin-top:2rem;
    }
    .alone{
        justify-content: start;
    }
    .take-action{
        justify-content: end;
    }

    .section-gen-link{
        scroll-margin-top:80px !important;
    }
    .cloud {
        border-bottom: .75rem solid white;
        border-left: .75vw solid transparent;
        border-right: .75vw solid transparent;
        background-image: linear-gradient(180deg,transparent 25%, white );
        border-radius:75px; /* Creates the main rounded base */
        box-shadow: 0 0 15px rgba(0, 0, 0, 0.2); /* Optional: Add a subtle shadow */
        font-size:9pt;
        padding:.25rem .05rem;
        font-family: var(--font-header);
        height: 50px;
    }
   
}
@media screen and (max-width: 565px) {
    #services{
        height: 140vh !important;
    }
    .section-col>.description>p {
        font-size:12pt;
    }   
    .faq-subheader{
        font-size: 18pt !important;
    }
    .cta-mail{
        top:30%;
    }
    
    #certification{
    font-family: var(--font-header);
    letter-spacing: 1.15px;
    font-size:9pt;
    width:50%;
    min-width:200px;
    position:absolute;
    top:88px;
    left:5px;
    }
    #problem{
        height:150vh !important;
        display:Flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }
    .problem-col{
        width:98%;
    }
    .about-bg{
        background-size:85%;
        background-attachment:relative !important;
    }
    .learn-more-config{
        right:unset;
        bottom:100px;
        left:25%;
    }
    #home {
        justify-content: center;
        align-items:center;
        width:100%;
    }
    #cover-phrase{
        text-align:center;
        font-size:16pt !important;
        margin-bottom:3rem;
    }
    #cover-phrase-container{
        width:100%;
        align-items: center;
        margin-bottom:unset;
        margin-top:2.25rem;
    }
  
    .fixed-nav{
        position:fixed;
        left:0;
    }
    .servicing{
        gap:8px;
    }
    .cloud {
    width:68%;
}
}
@media screen and (max-width: 390px) {

    #about {
        min-height:115vh !important;
    }
.section-gen-link{
    scroll-margin-top: 80px !important;
}
#problem>.section-col{
        width:100% !important;
    }
.servicing,.faq-subheader{
    font-size:16pt !important;
}

}


/* landscape phone */
@media screen and (max-width:1000px) and (max-height:500px){
    #img-cert {
        transform:translate(-130%,100%);
        width:110px;
    }
    #services{
        height:180vh !important;
    }
    #contact{
        height:185vh !important;
    }
    #img-pro{
        transition:.5s;
        height:225px;
        width:170px;
        z-index: 997;
        border-radius: 50%;
        box-shadow: 0 1.25px 12px .9px var(--bg-secondary);
        margin-bottom: 1.5rem;
    }
    .cta-mail > img {
        height:88px;
        transform:scale(.88);
    }
    #about {
        min-height:215vh
    }
    #about-phrase>p,.faq-question h3 {
        font-size:16pt !important;
    }
    #cover-phrase{
        text-align:left;
        font-size:21pt !important;
        margin-bottom:3rem;
    }
    .cloud-container{
        flex-wrap: nowrap;
        padding:12px;
         justify-content: start;
        /* height:125px */
    }
    .section-gen-link{
        scroll-margin-top: 70px;
    }
    .cloud{
        height:50px;
        padding:.15rem;
        justify-content: end;
        align-items: center;
        border-bottom:.25rem white;
    }
    .cloud>p{
        font-size:11pt;
    }
    .hands {
        background-size: cover;
        background-position: 0;
    }
    .alone {
        transform: translate(0,15px);
    }
    .section-col>.description>p {
        font-size:14pt;
    }
    .landscape-height{
        min-height:125vh !important;
    }
    #nav-mobile{
        top:85.5px;
    }
    .fixed-nav {
        top:78px !important;
    }

    #problem {
        margin-top:6rem;
        min-height:125vh !important;
    }
    header {
        min-height:70px !important;
        max-height:70px !important;
        height:70px !important;
    }
     #logo-link{
        flex-direction: row;
        justify-content: start;
        /* border:2px solid red; */
    }
    #logo-link>em{
        font-size:16pt;
    }
    #logo-link>img{
        height:50px;
        width:80px;
    }
    .nav-mobile-list-link {
        padding:12px 0;
    }
}

/* --------------------------------------- media query --------------------------------------- */