.pws-hero { --pws-toolbar: 0px; position: relative; isolation: isolate; display: grid; margin: 0; background: #102a36; color: #fff; }
.admin-bar .pws-hero { --pws-toolbar: var(--wp-admin--admin-bar--height,32px); }
.pws-hero-slide { position: relative; display: grid; place-items: center; min-height: calc(100vh - var(--pws-open-header) - var(--pws-toolbar)); min-height: calc(100svh - var(--pws-open-header) - var(--pws-toolbar)); isolation: isolate; }
.pws-hero-slide[hidden], .pws-hero-controls[hidden] { display: none; }
.pws-hero-slide picture, .pws-hero-slide picture img, .pws-hero-slide::after { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.pws-hero-slide picture { z-index: -2; }
.pws-hero-slide picture img { object-fit: cover; }
.pws-hero-slide::after { z-index: -1; content: ''; background: linear-gradient(180deg,rgba(6,21,34,.13),rgba(6,21,34,.35) 50%,rgba(6,21,34,.7)),linear-gradient(90deg,#081a2944,#081a297a 50%,#081a2944); }
.pws-hero-copy { display: flex; flex-direction: column; align-items: center; gap: clamp(15px,2.2vh,25px); padding-block: 76px 92px; text-align: center; }
.pws-hero-copy :is(h1,h2) { max-width: 19ch; margin: 0; color: white; font: 700 clamp(2.8rem,4.1vw,4.6rem)/1.07 var(--heading); text-transform: uppercase; text-wrap: balance; overflow-wrap: anywhere; text-shadow: 0 2px 15px #08182790; }
.pws-hero-copy p { max-width: 58ch; margin: 0; color: white; font: 400 clamp(1rem,1.4vw,1.25rem)/1.5 var(--body); text-wrap: pretty; text-shadow: 0 1px 5px #061019; }
.pws-hero-cta { display: inline-flex; align-items: center; gap: .6em; min-height: 46px; padding: .62em 1.3em; border: 1px solid #afc7ff; border-radius: 999px; background: var(--blue); color: #fff; font: 700 1rem/1.3 var(--body); box-shadow: 0 3px 14px #08172d55; }
.pws-hero-cta::after { content: ''; width: .52em; height: .52em; border: solid currentColor; border-width: 2px 2px 0 0; transform: rotate(45deg); }
.pws-hero-cta:is(:hover,:focus-visible) { color: #13239c; background: white; }
.pws-hero-controls { position: absolute; z-index: 1; inset: auto 0 max(16px,env(safe-area-inset-bottom)); margin-inline: auto; width: max-content; display: flex; align-items: center; padding: 2px 4px; border: 1px solid #ffffff70; border-radius: 99px; background: #071829d9; color: white; }
.pws-hero-controls button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: inherit; cursor: pointer; }
.pws-hero-controls button:is(:hover,:focus-visible) { background: #1834c4; }
.pws-hero-controls button span { font: 400 30px/1 Arial,sans-serif; }
.pws-hero-controls [data-play] span { font-size: 15px; }
.pws-hero-count { min-width: 4ch; text-align: center; font: 700 .84rem/1 var(--body); font-variant-numeric: tabular-nums; }
.pws-hero :focus-visible { outline: 3px solid #9ee9ff; }
@media (min-width: 768px) and (max-width: 1199px) { .pws-hero-copy :is(h1,h2) { font-size: clamp(2.65rem,5.4vw,3.9rem); } }
@media (max-width: 767px) { .pws-hero-copy { padding-inline: 22px; gap: 15px; } .pws-hero-copy :is(h1,h2) { font-size: clamp(2rem,6.8vw,3.15rem); } }
@media (max-width: 412px) { .pws-hero-copy { padding: 54px 18px 76px; } .pws-hero-copy :is(h1,h2) { font-size: clamp(1.65rem,7.4vw,1.95rem); } .pws-hero-copy p { font-size: 1rem; } }
@media (max-height: 500px) { .pws-hero-copy { padding-block: 12px 60px; gap: 8px; } .pws-hero-copy :is(h1,h2) { font-size: clamp(1.45rem,4vw,2rem); } .pws-hero-controls { bottom: 5px; } }
@media (prefers-reduced-motion: no-preference) { .pws-hero-slide:not(:first-child) .pws-hero-copy { animation: pws-hero-in .3s ease-out; } @keyframes pws-hero-in { from { opacity: .25; transform: translateY(6px); } } }
