:root {
    color-scheme: light;
    --directory-navy: #081d33;
    --directory-navy-soft: #123a63;
    --directory-turquoise: #0aa7a7;
    --directory-cyan: #08cfe0;
    --directory-bg: #f3f7fa;
    --directory-line: #d7e2ea;
    --directory-muted: #60758c;
    --directory-white: #fff;
    --directory-shadow: 0 18px 50px rgba(8, 29, 51, .1);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--directory-navy); background: var(--directory-bg); }
a { color: inherit; }

.public-directory__header {
    position: sticky;
    z-index: 10;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 76px;
    padding: 12px clamp(20px, 6vw, 88px);
    border-bottom: 1px solid rgba(215, 226, 234, .82);
    background: rgba(255, 255, 255, .92);
    backdrop-filter: blur(16px);
}

.public-directory__brand img { display: block; width: auto; height: 40px; }
.public-directory__business-link,
.public-directory__hero-action,
.public-directory-card__actions a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    font-weight: 750;
    text-decoration: none;
}
.public-directory__business-link { padding: 0 18px; border: 1px solid var(--directory-line); background: white; }

.public-directory__hero {
    position: relative;
    overflow: hidden;
    min-height: 410px;
    padding: clamp(70px, 10vw, 132px) clamp(22px, 8vw, 120px);
    color: white;
    background:
        radial-gradient(circle at 78% 20%, rgba(8, 207, 224, .34), transparent 25%),
        linear-gradient(122deg, #06192c 0%, #0a3153 57%, #087d88 130%);
}
.public-directory__hero::after {
    position: absolute;
    right: -7vw;
    bottom: -24vw;
    width: 58vw;
    height: 58vw;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 42% 58% 62% 38%;
    content: "";
    transform: rotate(24deg);
}
.public-directory__hero > * { position: relative; z-index: 1; max-width: 760px; }
.public-directory__eyebrow { margin: 0 0 10px; color: var(--directory-turquoise); font-size: 13px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.public-directory__hero .public-directory__eyebrow { color: #60edf2; }
.public-directory__hero h1 { margin: 0; max-width: 720px; font-size: clamp(42px, 6vw, 76px); line-height: .98; letter-spacing: -.045em; }
.public-directory__hero > p:not(.public-directory__eyebrow) { max-width: 610px; margin: 24px 0 30px; color: #d8e7f1; font-size: clamp(18px, 2vw, 23px); line-height: 1.5; }
.public-directory__hero-action { padding: 0 22px; color: var(--directory-navy); background: white; }

.public-directory__businesses { max-width: 1280px; margin: 0 auto; padding: clamp(48px, 7vw, 88px) clamp(20px, 5vw, 64px); }
.public-directory__section-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 26px; }
.public-directory__section-heading h2 { margin: 0; font-size: clamp(28px, 4vw, 42px); letter-spacing: -.035em; }
.public-directory__section-heading > span { padding: 8px 12px; border-radius: 999px; color: #087e86; background: #ddf5f3; font-size: 13px; font-weight: 800; }
.public-directory__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 1fr)); gap: 24px; }

.public-directory-card { overflow: hidden; border: 1px solid var(--directory-line); border-radius: 22px; background: white; box-shadow: var(--directory-shadow); }
.public-directory-card__media { position: relative; display: block; height: 270px; overflow: hidden; background: linear-gradient(135deg, #113654, #0aa7a7); }
.public-directory-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s ease; }
.public-directory-card__media:hover img { transform: scale(1.025); }
.public-directory-card__status { position: absolute; top: 16px; right: 16px; display: inline-flex; align-items: center; gap: 8px; padding: 8px 12px; border-radius: 999px; color: white; background: rgba(8,29,51,.86); font-size: 13px; font-weight: 800; backdrop-filter: blur(8px); }
.public-directory-card__status i { width: 8px; height: 8px; border-radius: 50%; background: #ffbe55; }
.public-directory-card__status.is-open i { background: #53e19a; box-shadow: 0 0 0 4px rgba(83,225,154,.17); }
.public-directory-card__body { padding: 22px; }
.public-directory-card__identity { display: flex; align-items: center; gap: 14px; }
.public-directory-card__logo { display: grid; flex: 0 0 58px; width: 58px; height: 58px; place-items: center; overflow: hidden; border: 1px solid var(--directory-line); border-radius: 15px; background: var(--directory-navy); color: white; font-size: 22px; font-weight: 850; }
.public-directory-card__logo img { width: 100%; height: 100%; object-fit: contain; }
.public-directory-card h3 { margin: 0 0 5px; font-size: 24px; }
.public-directory-card__identity p { margin: 0; color: var(--directory-muted); }
.public-directory-card__rating { margin: 18px 0; color: var(--directory-muted); font-size: 14px; font-weight: 700; }
.public-directory-card__rating span { color: #f0a92e; }
.public-directory-card__actions { display: flex; flex-wrap: wrap; gap: 9px; }
.public-directory-card__actions a { flex: 1 1 auto; padding: 0 16px; border: 1px solid var(--directory-line); background: white; }
.public-directory-card__actions a.is-primary { border-color: var(--directory-turquoise); color: white; background: var(--directory-turquoise); }
.public-directory__empty { padding: 36px; border: 1px dashed var(--directory-line); border-radius: 20px; background: white; text-align: center; }

.public-directory__footer { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding: 30px clamp(20px, 6vw, 88px); color: #d7e6f1; background: var(--directory-navy); }
.public-directory__footer div { display: grid; gap: 4px; }
.public-directory__footer span { color: #91a8ba; font-size: 14px; }
.public-directory__footer nav { display: flex; flex-wrap: wrap; gap: 20px; }
.public-directory__footer a { min-height: 44px; display: inline-flex; align-items: center; color: white; font-weight: 720; text-decoration: none; }

a:focus-visible { outline: 3px solid var(--directory-cyan); outline-offset: 3px; }
@media (max-width: 680px) {
    .public-directory__header { min-height: 66px; padding: 10px 18px; }
    .public-directory__brand img { height: 34px; }
    .public-directory__business-link { min-height: 40px; padding: 0 13px; font-size: 13px; }
    .public-directory__hero { min-height: 360px; padding: 62px 22px; }
    .public-directory__hero h1 { font-size: clamp(39px, 12vw, 56px); }
    .public-directory__section-heading { align-items: start; }
    .public-directory-card__media { height: 220px; }
    .public-directory-card__actions a { flex-basis: calc(50% - 9px); }
    .public-directory-card__actions a.is-primary { flex-basis: 100%; }
    .public-directory__footer { align-items: flex-start; flex-direction: column; }
    .public-directory__footer nav { width: 100%; flex-direction: column; gap: 0; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .public-directory-card__media img { transition: none; }
}