.elementor-kit-6{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-ab46d0d:#191919;--e-global-color-61609cd:#BDAC74;--e-global-color-aca7835:#D3B574;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.phiacademyhero {
  position: relative;
  overflow: hidden;
  background: #000; /* hides seams */
}

/* Common image rules */
.hero__img {
  position: absolute;
  z-index: 1;
}
.hero__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* LEFT image — pentagon shape */
.hero__img--left {
  top: 0;
  left: 0;
  width: 50vw;
  height: 100vh;
  clip-path: polygon(
    0% 0%,    /* top left corner */
    85% 0%,   /* top horizontal edge */
    100% 0%,  /* inward angle to mid */
    85% 100%, /* outward angle toward bottom */
    0% 100%   /* bottom left corner */
  );
}

/* RIGHT image — mirrored pentagon */
.hero__img--right {
  top: 0;
  right: 0;
  width: 50vw;
  height: 100vh;
  clip-path: polygon(
    15% 0%,   /* top inward edge */
    100% 0%,  /* top right corner */
    100% 100%,/* bottom right corner */
    15% 100%, /* bottom inward edge */
    1% 50%   /* inward angle to middle */
  );
}

/* TOP CENTER — triangle pointing down */
.hero__img--top {
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 30vw;
  height: 50vh;
  z-index: 2;
  clip-path: polygon(
    0% 0%,    /* top left */
    100% 0%,  /* top right */
    50% 100%  /* bottom middle point */
  );
}

.hero__img--bottom {
  position: absolute;
  inset: 0 auto 0 0;
  width: 100vw;
  height: 100vh;
  z-index: 3;
  overflow: hidden;
  /* narrower top for start */
  clip-path: polygon(50% 40%, 50% 40%, 75% 100%, 25% 100%);
}
.hero__img--bottom img {
    
  width: 100%;
  height: 100%;
  object-fit: contain !important;
  object-position: center bottom;
}


/* Optional small overlap to avoid seams */
.hero__img--left   { margin-right: -0.5px; }
.hero__img--right  { margin-left: -0.5px; }
.hero__img--top    { margin-bottom: -0.5px; }
.hero__img--bottom { margin-top: -0.5px; }/* End custom CSS */