/* home.css */

/*System font stack */
    :root{
         
        --pch-font-body:"Open Sans", Arial, sans-serif;
        --pch-font-heading: "Poppins", "Times New Roman", Georgia, Helvetica;;
        --pch-blue: #0B53A7;
        --pch-blue-2:#bddaff;         /* hover/active */
        --pch-blue-3:#0e66c7;         /* subtle gradient top */
        --pch-border:#ffffffb3;       /* thin light border */
        --pch-radius:.3rem;           /* button rounding */
        --pch-height:46px;            /* button height */
        --pch-pad-x:.75rem;          /* side padding */
        --pch-btn-width:180px;        /* button Size */
        
        --footer-dark:#2f3235;   /* logo section FOOTER */
        --footer-light:#3a3d40;  /* links section FOOTER*/
        --footer-copy:#000000;   /* copywrite section*/
        
    }

/* ############################### LOGO STACK STARTS ####################################### */
        .container-fluid.logobg {
            background-color: var(--pch-blue);
            color: white;
            padding: 10px 0;
            height: 50px; /* Adjusted height */
            position:relative;
        }
        
        .logo-container {
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
        }
        
        .logoimg {
            max-width: 150px; /* Adjusted to fit better */
            margin-left: 20px;
            margin-top: 40px;
        }
        
        .contact-info {
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .phone {
            font-size: 1rem;
            color: black;
            margin-top: 5px;
        }
        
        .logotext-container {
            flex-grow: 1;
            text-align: center; /* Centered text alignment */
        }
        
        .pchlogotext {
            font-size: 1.3rem;
            font-family:'Times New Roman', Times, serif;
            
            color: white;
        }
        
        .firstLetterSpan {
            font-size: 1.6rem;
        }
        
        .slogan {
            font-size: 1rem;
            padding-left: 200px;
            color: black;
        }
        
        @media (max-width: 768px) {
            .pchlogotext {
                font-size: 1.2rem;
            }
            .firstLetterSpan {
                font-size: 1.5rem;
            }
            .phone {
                font-size: 0.9rem;
                color:black;
            }
            .slogan {
                font-size: 2vw;
                margin-top: 0;
                color: black;
                display: flex;
                padding-left: 0px;
                padding-right: 40px;
                align-items: center;
                justify-content: flex-end; /* Aligns text to the start */
            }
        }
         
        @media (max-width: 576px) {
            .container-fluid.logobg {
                display: flex;
                align-items: center;
                justify-content: space-between;
            }
        
            .logo-container {
                display: flex;
                align-items: center;
            }
        
            .pchlogotext {
                font-size: 2.6vw;
            }
        
            .firstLetterSpan {
                font-size: 3.7vw;
            }
        
            .phone {
                font-size: 0.9rem;
                margin-top: 100px;
            }
        
            .slogan {
                font-size: 1.8vw;
                margin-top: 5px;
                color: black;
                display: flex;
                padding-right: 5px;
                padding-left:100px;
                align-items: center;
                justify-content: flex-end; /* Aligns text to the start */
            }
            .logoimg {
            max-width: 150px; /* Adjusted to fit better */
            margin-left: 10px;
            margin-top: 40px;
            }
        }
        /* top-right hamburger on mobile only */
        .pch-hamburger{
          position: absolute;
          top: 50%;
          right: 12px;
          transform: translateY(-50%);
          padding: .25rem .5rem;
          background: transparent;
          border: 0;
          line-height: 1;
          z-index: 10; /* above header contents */
        }
        
        /* optional hover polish */
        .pch-hamburger:hover svg rect{ opacity:.85; }
        
        /* hide on large screens (already d-lg-none on the button) */
        @media (min-width: 992px){
          .pch-hamburger{ display:none !important; }
        }
        
        /* Remove the default focus ring for mouse clicks, keep a nice one for keyboard */
        .pch-logo-link:focus { outline: none; }
        .pch-logo-link:focus-visible {
          outline: 3px solid #fff;      /* visible on keyboard tab */
          outline-offset: 3px;
          border-radius: .25rem;
        }
        
        /* Just in case any UA adds borders to linked images */
        .pch-logo-link img { border: 0; }
        
        /* Kill the grey tap highlight on mobile Safari/Chrome */
        .pch-logo-link, .pch-logo-link img { -webkit-tap-highlight-color: transparent; }

/*  LOGO STACK ENDS */

/* ############################### NAV BAR STARTS ####################################### */
  /* Base button look */
  .pch-btn{
    background: linear-gradient(to bottom, var(--pch-blue-3), var(--pch-blue));
    color:#fff;
    text-transform:uppercase;
    font-weight:700;
    font-size: clamp(.50rem, 1vw + .5rem, .70rem); /* scales text size */
    letter-spacing:.02em;
    border:1px solid var(--pch-border);
    border-radius:var(--pch-radius);
    height:var(--pch-height);
    line-height:calc(var(--pch-height) - 2px);
    padding:0 var(--pch-pad-x);
    box-shadow:0 1px 0 rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.08);
  }
  .pch-btn:hover,
  .pch-btn:focus{
    background: var(--pch-blue-2);
    color:var(--pch-blue);
  }
  

  /* Centered row of buttons */
  .pch-menu .nav{ align-items:center; }

  /* Dropdown menu = stack of the same blue buttons */
  .pch-menu .dropdown-menu{
    background:transparent;
  }
  
  /* Make sure hover state doesn't collapse instantly */
    .pch-menu .dropdown:hover > .dropdown-menu {
      display: block;
      margin-top: 0; /* remove Bootstrap’s default offset */
    }

  .pch-menu .dropdown-toggle::after{
    margin-left:.5rem;
    vertical-align:.15em;
    display:none !important;
  }
  
  /* kill the sticky pressed/focus visuals */
    .pch-menu .dropdown-toggle:focus,
    .pch-menu .dropdown-toggle:active,
    .pch-menu .show > .dropdown-toggle {
      background: linear-gradient(to bottom, var(--pch-blue-3), var(--pch-blue));
      color:#fff;
      border-color: var(--pch-border);
      box-shadow: none !important;
      outline: 0;
    }


    .pch-menu .nav > .nav-item > .pch-btn {
      min-width: var(--pch-btn-width);
      max-width: var(--pch-btn-width);
      text-align: center;
      white-space: nowrap; /* keeps text in one line */
    }
  /* Tight gaps inside dropdown list */
  .pch-menu .dropdown-menu .pch-btn{
    display:block;
    border-radius:var(--pch-radius);
    padding:0 1rem;
  }

  /* Keep consistent widths if you want them to match visually */
  @media (min-width:992px){
    .pch-menu .nav > .nav-item > .pch-btn{
      min-width: var(--pch-btn-width); 
      text-align:center;
    }
  }

/* Hamburger CSS */
/* Offcanvas theme */
.pch-offcanvas{ width: 320px; background:#f7f9fc; border-left:1px solid #e5e9f2; }
.pch-offcanvas .offcanvas-header{ border-bottom:1px solid #e5e9f2; }
.pch-offcanvas .offcanvas-title{ color:var(--pch-blue); }

/* Accordion headers styled like your buttons (but lighter) */
.pch-acc .accordion-button.pch-acc-btn{
  background: linear-gradient(to bottom, var(--pch-blue-3), var(--pch-blue));
    color:#fff;
    text-transform:uppercase;
    font-weight:700;
    font-size: clamp(.50rem, 1vw + .5rem, .70rem); /* scales text size */
    letter-spacing:.02em;
    border:1px solid var(--pch-border);
    border-radius:var(--pch-radius);
    height:var(--pch-height);
    line-height:calc(var(--pch-height) - 2px);
    padding:0 var(--pch-pad-x);
    box-shadow:0 1px 0 rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.08);
  
}
.pch-acc .accordion-button:not(.collapsed){ background:var(--pch-blue-2); color:var(--pch-blue); }
.pch-acc .accordion-button::after{ /* remove default arrow if you want */
    color:#fff;
  /* display:none; */
  
}

/* Tighten inner spacing between stacked buttons */
.pch-offcanvas .accordion-body .pch-btn{ margin-bottom:4px; }
/*  NAV BAR ENDS */

/* ############################### BODY STARTS ####################################### */
body {
              font-family: var(--pch-font-body);
              font-size: 1rem;
              line-height: 1.2;
              background-color: #fff;
            }
            /* Fluid headings (mobile → desktop) */
            h1{ font-size: clamp(1rem, .9rem + 1.6vw, 1.75rem); line-height:1.2; }
            h2{ font-size: clamp(1rem, .9rem + 1.6vw, 1.75rem); line-height:1.25; }
            h3{ font-size: clamp(.75rem, .9rem + 1vw, 1.25rem); line-height:1.3; }


            h1, h2, h3{
              font-family: var(--pch-font-heading);
              color: var(--pch-blue);
              font-weight: 700;
              margin-bottom: .5em;
              text-wrap:balance;
            }
            
            p {
              margin-bottom: 1rem;
              font-size:1rem;
            }

/* BODY ENDS */
/* ############################### HERO CAROUSEL STARTS ####################################### */

          /* ===== Accessibility utilities ===== */
          .skip-link{
            position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden;
          }
          .skip-link:focus{
            left:12px; top:12px; width:auto; height:auto; padding:.5rem .75rem; z-index:10000;
            background:#000; color:#fff; border-radius:.25rem; text-decoration:none;
          }
          .visually-hidden{
            position:absolute!important; width:1px!important; height:1px!important; padding:0!important;
            margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; border:0!important;
          }
          

            /* ===== General helpers ===== */
          .vertical-spacer { height:20px; width:100%; }
          .lineRemove { text-decoration:none; }
        
          /* ===== Carousel / hero ===== */
              #homeslider .carousel-item {
              height: 100%; /* make it inherit from carousel-inner */
                }
    
        #homeslider .carousel-item picture,
        #homeslider .carousel-item img {
          object-fit: cover; /* keep aspect ratio, fill */
          height: 100%;
          width: 100%;
        }
        /* shrink the giant tap areas & remove the dark overlay */
        #homeslider .carousel-control-prev,
        #homeslider .carousel-control-next{
          width: 3rem;                
          background: transparent !important; /* kill gradient */
          opacity: 1;                 
          top: 50%;
          bottom: auto;
          transform: translateY(-50%);
          height: 3rem;
          display: flex;
          align-items: center;
          justify-content: center;
        }
    
        /* optional: nicer hit target */
        #homeslider .carousel-control-prev-icon,
        #homeslider .carousel-control-next-icon{
          filter: drop-shadow(0 1px 2px rgba(0,0,0,.6));
        }
        
        /* remove annoying focus ring box on the big area; keep a custom ring */
        #homeslider .carousel-control-prev:focus,
        #homeslider .carousel-control-next:focus{
          outline: none;
        }
        #homeslider .carousel-control-prev:focus-visible,
        #homeslider .carousel-control-next:focus-visible{
          outline: 3px solid #1a73e8; outline-offset: 2px;
        }

        /* Respect reduced motion: disable slide animation */
        @media (prefers-reduced-motion: reduce){
        .carousel-item{ transition:none !important; }
        }
      
        .card-title { 
        overflow-wrap: break-word;
        white-space: normal;
        }
        
        .slidercommon,
            #homeslider,
            #homeslider .carousel-inner,
            #homeslider .carousel-item {
            height: 100%;
        }
/* HERO CAROUSEL ENDS */
/* ############################### HOUSING FORM STARTS ####################################### */
.bg-form{background:var(--pch-blue-2);}      
          .pch-form{ background:var(--pch-blue-2); border-radius:.5rem; }
          .pch-form .form-label{ font-weight:600; }
          .pch-form .btn-primary{
            background: linear-gradient(to bottom, #0e66c7, var(--pch-blue));
            border-color: var(--pch-blue);
            box-shadow: 0 1px 0 rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.08);
            text-transform: uppercase;
            letter-spacing:.01em;
          }
          .pch-form .btn-primary:hover{ 
              background:var(--pch-blue-2);
              color:var(--pch-blue);
              border-color:var(--pch-blue);
              box-shadow: 0 1px 0 rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.08);
              
          }
/* HOUSING FORM ENDS */
/* ############################### BLOG SECTION STARTS ####################################### */
/* equal-height cards + bottom-pinned "More" links */
                .feature-card h3{
                  font-size: 1rem;
                  font-weight: 700;
                  color: var(--pch-blue, #0B53A7);
                }
                .feature-card a.stretched-link{
                  text-decoration: underline;
                  padding: .25rem 0; /* helps touch-target size */
                }
                /* center the card and cap its width */
                .feature-card{
                  max-width: 22rem;       /* ~352px; tweak to taste */
                  margin-inline: auto;
                }
                .feature-card img{ display:block; margin-inline:auto; } /* belt & suspenders */
/* BLOG SECTION ENDS */
/* ############################### PARTNERS SECTION STARTS ####################################### */
            .footer-partners img{
              max-height: 56px;       /* keeps logos visually even */
              width: auto;
            }
            .footer-partners .carousel-item .row{
              align-items: center;
              justify-content: center;
            }

/*PARTNERS SECTION ENDS */
/* ############################### FOOTER SECTION STARTS ####################################### */

  /* -------- Base footer -------- */
  .site-footer{ background:var(--footer-light); color:#fff; }

  /* Mobile/tablet: hero on top with center chevron */
  .site-footer .footer-hero{
    position:relative;
    background:var(--footer-dark);
    text-align:center;
    padding:32px 0 28px;     /* room above the chevron */
    overflow:visible;
  }
  .site-footer .footer-hero::after{
    content:"";
    position:absolute;
    left:50%;
    bottom:-40px;            /* chevron height */
    transform:translateX(-50%);
    width:0; height:0;
    border-left:50vw solid transparent;
    border-right:50vw solid transparent;
    border-top:40px solid var(--footer-dark);
    pointer-events:none;
  }

  /* Links section below the chevron */
  .site-footer .footer-links{
    padding-top:56px;        /* chevron height + breathing room */
  }

  /* Tap targets / link styles (Lighthouse) */
  .site-footer .list-unstyled{
    margin:0; padding:0;
    display:flex; flex-direction:column;
  }
  .site-footer .list-unstyled a,
  .site-footer a.link-light{
    
    padding:.55rem 0;
    min-height:44px;
    line-height:1.8;
    text-decoration:none;
    color:#e9eef4;
  }
  .site-footer a.link-light:hover{ text-decoration:underline; }

  /* Small screens: a touch more spacing */
  @media (max-width:576px){
    .site-footer .list-unstyled{ row-gap:.1rem; }
    .site-footer .list-unstyled a,
    .site-footer a.link-light{ padding:.1rem 0; }
  }

  /* -------- Desktop (lg+): right-side panel with a POINT -------- */
  @media (min-width:992px){
    .site-footer{ position:relative; }

    /* If you had a previous diagonal band, nuke it */
    .site-footer::before{ content:none; }

    /* Make room for the panel on the right */
    .site-footer .footer-links{
      position:relative; z-index:2;
      padding-top:40px;
      padding-bottom:40px;
      padding-right:420px;         /* = panel width + ~40px buffer */
    }

    /* Panel on the right */
    .site-footer .footer-hero{
      position:absolute;
      top:0; right:0; bottom:0;
      width:30%;                 /* tweak 340–420px to taste */
      display:flex; align-items:center; justify-content:center;
      background:var(--footer-dark);
      text-align:center;
      z-index:2;
      overflow:visible;            /* let the point extend left */
    }

    /* Kill the mobile chevron when panelized */
    .site-footer .footer-hero::after{ display:none; }

    /* Create the left-facing “point” that cuts into the panel */
    .site-footer .footer-hero::before{
      content:"";
      position:absolute;
      left:-35%;                 /* how far the point reaches into links */
      top:0; bottom:0;
      width:200px;                 /* width of the triangular wedge */
      background:var(--footer-dark);   /* same color as links side */
      clip-path: polygon(100% 0px, 0px 50%, 100% 100%);

      pointer-events:none;
    }
  }

  /* Very wide screens: slightly lighter type in panel */
  @media (min-width:1200px){
    .site-footer .footer-hero .small{ font-size:.9rem; }
  }
  
  /* Copyright strip */
.footer-copy{
  background: var(--footer-copy);
  color:#fff;
}

/* Make it full-bleed on desktop even if it's inside a .container/.footer-links */
@media (min-width: 992px){
  .footer-copy{

    
   }
}

/* Optional: comfy vertical padding for the text */
.footer-copy .container{ padding: .5rem 1rem; }


/*FOOTER ENDS