body {
background: #f2f2f2;
font-family: Arial, Helvetica, sans-serif;
color: #333;
} .ph-header {
background: #c62706;
border-bottom: 8px solid #222;
}
.ph-logo img {
max-height: 116px;
height: auto;
}
.header-inner {
display: flex;
align-items: center;
justify-content: space-between;
gap: 3rem;
position: relative;
}
.pharos-brand-link {
color: #fff;
font-weight: 600;
font-size: 1.4rem;
text-decoration: none;
}
.pharos-brand-link:hover {
text-decoration: underline;
} .ph-header .primary-nav .menu {
display: flex;
align-items: center;
gap: 1.5rem;
list-style: none;
margin: 0;
padding: 0;
}
.ph-header .primary-nav .menu > li {
position: relative;
list-style: none;
}
@media (min-width: 769px) and (max-width: 1400px) {
.header-inner {
gap: 2.5rem;
}
.ph-header .primary-nav .menu {
gap: 1rem;
}
} .ph-header .primary-nav .ph-menu-link {
display: block;
color: #ffffff;
text-decoration: none;
font-weight: 500;
white-space: nowrap;
}
.ph-header .primary-nav .ph-menu-link:hover,
.ph-header .primary-nav .ph-menu-link:focus-visible {
color: #ffffff;
text-decoration: none;
} .ph-menu-parent-row {
display: flex;
align-items: center;
gap: 0.4rem;
position: relative;
z-index: 1001;
border-radius: 8px 8px 0 0;
transition:
background-color 0.15s ease,
color 0.15s ease;
}
.ph-menu-parent-link {
padding: 0.75rem 0 0.75rem 0.875rem;
}
.ph-submenu-toggle {
display: flex;
align-items: center;
justify-content: center;
width: 2rem;
height: 2rem;
flex: 0 0 2rem;
margin-right: 0.5rem;
padding: 0;
border: 0;
border-radius: 50%;
background: rgba(255, 255, 255, 0.12);
color: #ffffff;
cursor: pointer;
transition:
background-color 0.15s ease,
color 0.15s ease;
}
.ph-submenu-toggle i {
font-size: 0.7rem;
transition:
transform 0.15s ease,
color 0.15s ease;
} .ph-menu-parent.is-open > .ph-menu-parent-row,
.ph-menu-parent:hover > .ph-menu-parent-row {
background: var(--pharos-light-orange);
}
.ph-menu-parent.is-open > .ph-menu-parent-row .ph-menu-link,
.ph-menu-parent.is-open > .ph-menu-parent-row .ph-submenu-toggle,
.ph-menu-parent:hover > .ph-menu-parent-row .ph-menu-link,
.ph-menu-parent:hover > .ph-menu-parent-row .ph-submenu-toggle {
color: var(--pharos-black);
}
.ph-menu-parent.is-open > .ph-menu-parent-row .ph-submenu-toggle,
.ph-menu-parent:hover > .ph-menu-parent-row .ph-submenu-toggle {
background: rgba(236, 67, 11, 0.10);
color: var(--pharos-dark-orange);
}
.ph-submenu-toggle:focus-visible {
outline: 2px solid #ffffff;
outline-offset: 2px;
}
.ph-menu-parent.is-open .ph-submenu-toggle:focus-visible {
outline-color: var(--pharos-dark-orange);
} .ph-dropdown {
display: none;
position: absolute;
top: 100%;
left: 0;
width: 360px;
min-width: 100%;
margin: 0;
padding: 0.75rem;
list-style: none;
background: var(--pharos-light-orange);
border: 1px solid #e2d6c5;
border-top: 0;
border-radius: 0 8px 8px 8px;
box-shadow: 0 10px 24px rgba(0, 0, 0, 0.14);
z-index: 1000;
} .ph-menu-parent.is-open > .ph-dropdown,
.ph-menu-parent:hover > .ph-dropdown {
display: block;
} .ph-dropdown > li {
margin: 0;
padding: 0;
list-style: none;
}
.ph-dropdown-link {
display: block;
padding: 0.85rem 0.75rem;
border-radius: 6px;
color: var(--pharos-black);
text-decoration: none;
}
.ph-dropdown-link:hover,
.ph-dropdown-link:focus-visible,
.ph-dropdown .current-menu-item > .ph-dropdown-link {
background: #ffffff;
color: var(--pharos-dark-orange);
text-decoration: none;
} .ph-menu-title {
display: block;
font-size: 0.95rem;
font-weight: 600;
line-height: 1.3;
} .ph-menu-description {
display: block;
margin-top: 0.25rem;
font-size: 0.8rem;
line-height: 1.4;
color: var(--pharos-medium-gray);
} .ph-header .primary-nav .menu > .current-menu-item > .ph-menu-link,
.ph-header .primary-nav .current-menu-ancestor > .ph-menu-parent-row > .ph-menu-link {
text-decoration: underline;
text-underline-offset: 4px;
}
.ph-dropdown > li + li {
border-top: 1px solid rgba(198, 39, 6, 0.18);
} .mobile-toggle {
display: none;
background: none;
border: none;
color: #fff;
font-size: 1.6rem;
cursor: pointer;
} @media (max-width: 768px) {
.mobile-toggle {
display: block;
}
.ph-header {
padding: 0;
}
.ph-header .container {
padding-left: 0;
padding-right: 0;
}
.header-inner {
align-items: flex-end;
}
.primary-nav {
display: none;
position: absolute;
top: 100%;
left: 0;
right: 0;
padding: 1rem;
background: var(--pharos-black);
z-index: 1000;
}
.primary-nav.open {
display: block;
}
.ph-header .primary-nav .menu {
flex-direction: column;
align-items: stretch;
gap: 0.25rem;
}
.ph-header .primary-nav .menu > li {
width: 100%;
}
.ph-menu-link {
width: 100%;
padding-left: 1rem;
padding-right: 1rem;
} .ph-menu-parent-row {
align-items: center;
}
.ph-submenu-toggle {
width: 2.5rem;
height: 2.5rem;
flex: 0 0 2.5rem;
margin-right: 0.75rem;
}
.ph-submenu-toggle i {
font-size: 1rem;
}
.ph-menu-parent-link {
flex: 1 1 auto;
padding: 0.75rem 1rem;
} .ph-menu-parent:hover > .ph-dropdown {
display: none;
}
.ph-menu-parent:hover > .ph-menu-parent-row {
background: transparent;
}
.ph-menu-parent:hover > .ph-menu-parent-row .ph-menu-link,
.ph-menu-parent:hover > .ph-menu-parent-row .ph-submenu-toggle {
color: #ffffff;
} .ph-menu-parent.is-open > .ph-menu-parent-row {
background: var(--pharos-light-orange);
}
.ph-menu-parent.is-open > .ph-menu-parent-row .ph-menu-link,
.ph-menu-parent.is-open > .ph-menu-parent-row .ph-submenu-toggle {
color: var(--pharos-black);
}
.ph-menu-parent.is-open > .ph-dropdown {
display: block;
} .ph-dropdown {
position: static;
width: 100%;
min-width: 0;
padding: 0.35rem 0.5rem 0.75rem;
border: 0;
border-radius: 0;
box-shadow: none;
}
.ph-dropdown-link {
padding: 0.65rem 0.75rem 0.65rem 1.5rem;
}
.ph-menu-description {
display: none;
}
.ph-logo img {
max-height: 80px;
}
} .ph-banner {
background-color: var(--pharos-light-orange);
color: #ffffff;
padding: 2.5rem 1rem;
border-bottom: .5rem solid var(--pharos-orange)
}
.ph-banner-inner {
max-width: 900px;
}
.ph-banner h2 {
font-size: 1.4rem;
margin-bottom: 0.75rem;
}
.ph-banner p {
margin: 0;
font-size: 1rem;
line-height: 1.6;
} .ph-main {
padding: 2rem 0 2.5rem 0;
}
.ph-card {
border-radius: 0.35rem;
border: 1px solid #dddddd;
background-color: #ffffff;
box-shadow: 0 2px 4px rgba(0,0,0,0.04);
padding: 1.25rem 1.25rem;
height: 100%;
}
.ph-card h3 {
font-size: 1.3rem;
margin-bottom: 0.5rem;
}
.ph-card-icon {
flex: 0 0 auto;
margin-right: 1rem;
}
.ph-card-icon img {
width: 48px;
height: auto;
}
.ph-card-body {
flex: 1 1 auto;
} .ph-next-steps {
background: #ffffff;
border: 1px solid #dddddd;
border-radius: 0.35rem;
padding: 1.25rem;
} .ph-footer-top {
background: #ebebeb;
padding: 1.75rem 0;
border-top: 1px solid #d4d4d4;
border-bottom: 1px solid #d4d4d4;
color: #333;
}
.ph-footer-logo img {
max-width: 216px;
height: auto;
}
.ph-footer-bottom {
background: #e1e1e1;
padding: 1rem 0;
font-size: 0.85rem;
color: #444;
}
.ph-footer-bottom a {
color: var(--pharos-orange);
text-decoration: none;
}
.ph-footer-bottom a:hover {
text-decoration: underline;
} h2 { font-size: 1.6rem; }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.2rem; } .ph-main a:not(.btn),
.ph-banner a:not(.btn),
.ph-footer-top a:not(.btn) {
color: var(--pharos-orange);
text-decoration: underline;
text-decoration-thickness: 1.5px;
text-underline-offset: 3px;
transition: color 0.2s ease, text-decoration-thickness 0.2s ease;
}
.ph-main a:not(.btn):hover,
.ph-banner a:not(.btn):hover,
.ph-footer-top a:not(.btn):hover {
color: var(--pharos-black);
text-decoration-thickness: 2px;
}
.ph-main a:not(.btn):focus-visible,
.ph-banner a:not(.btn):focus-visible,
.ph-footer-top a:not(.btn):focus-visible {
outline: 2px solid var(--pharos-orange);
outline-offset: 3px;
border-radius: 2px;
}
@media (max-width: 767.98px) {
.ph-header .container {
padding-left: 0;
padding-right: 0;
}
.ph-banner h2 { font-size: 1.4rem; }
.ph-banner p { font-size: 0.95rem; }
.ph-card { padding: 1rem; }
.ph-logo img { max-height: 80px; }
}