.nc-site-map {
    background: #f7f4ed;
}

.nc-site-map__hero {
    position: relative;
    overflow: hidden;
    color: #fff;
    background:
        radial-gradient(circle at 82% 25%, rgba(132, 165, 137, .3), transparent 27%),
        linear-gradient(125deg, #102f46 0%, #1c516f 72%, #236b78 100%);
}

.nc-site-map__hero::after {
    content: '';
    position: absolute;
    right: -6%;
    bottom: -160px;
    width: 520px;
    height: 320px;
    opacity: .22;
    border: 1px solid rgba(255,255,255,.5);
    border-radius: 50%;
    box-shadow:
        0 0 0 34px rgba(255,255,255,.08),
        0 0 0 68px rgba(255,255,255,.06),
        0 0 0 102px rgba(255,255,255,.04);
}

.nc-site-map__hero-inner {
    position: relative;
    z-index: 1;
    padding-block: clamp(70px, 9vw, 118px);
}

.nc-site-map__eyebrow,
.nc-site-map__gateway-top p,
.nc-site-map__directory-kicker,
.nc-site-map__heading span {
    margin: 0;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.nc-site-map__eyebrow {
    color: #f4a08b;
}

.nc-site-map__hero h1 {
    max-width: 760px;
    margin: 10px 0 0;
    font-family: var(--font-sans);
    font-size: clamp(2.65rem, 6vw, 5rem);
    font-weight: 800;
    letter-spacing: -.035em;
    line-height: .98;
}

.nc-site-map__hero-inner > p:last-child {
    max-width: 760px;
    margin: 23px 0 0;
    color: rgba(255,255,255,.8);
    font-size: clamp(1rem, 1.5vw, 1.16rem);
    line-height: 1.65;
}

.nc-site-map__body {
    padding: clamp(54px, 7vw, 92px) 0 clamp(70px, 9vw, 120px);
}

.nc-site-map__heading {
    display: flex;
    gap: 32px;
    align-items: flex-end;
    justify-content: space-between;
    margin-bottom: 32px;
}

.nc-site-map__heading span,
.nc-site-map__directory-kicker {
    color: var(--nc-clay);
}

.nc-site-map__heading h2,
.nc-site-map__directory-card h2 {
    margin: 7px 0 0;
    color: var(--nc-charcoal-blue);
    font-family: var(--font-sans);
    font-size: clamp(1.8rem, 3.2vw, 2.65rem);
    font-weight: 750;
    letter-spacing: -.025em;
    line-height: 1.08;
}

.nc-site-map__heading > p {
    max-width: 560px;
    margin: 0;
    color: #587081;
    line-height: 1.65;
}

.nc-site-map__gateways {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}

.nc-site-map__gateway {
    --gateway-accent: #d16f56;
    display: flex;
    min-width: 0;
    overflow: hidden;
    flex-direction: column;
    padding: clamp(24px, 3vw, 34px);
    background: #fff;
    border: 1px solid rgba(20,52,77,.12);
    border-radius: 22px;
    box-shadow: 0 15px 40px rgba(20,52,77,.08);
}

.nc-site-map__gateway--places-to-stay { --gateway-accent: #4b86a4; }
.nc-site-map__gateway--things-to-do { --gateway-accent: #648d70; }

.nc-site-map__gateway::before {
    content: '';
    display: block;
    width: 58px;
    height: 4px;
    margin: calc(clamp(24px, 3vw, 34px) * -1) 0 26px;
    background: var(--gateway-accent);
    border-radius: 0 0 3px 3px;
}

.nc-site-map__gateway-top {
    display: flex;
    gap: 15px;
    align-items: center;
}

.nc-site-map__gateway-icon {
    display: grid;
    width: 50px;
    height: 50px;
    flex: 0 0 auto;
    color: #fff;
    background: var(--gateway-accent);
    border-radius: 14px;
    place-items: center;
}

.nc-site-map__gateway-icon .nc-cat-icon {
    width: 26px;
    height: 26px;
}

.nc-site-map__gateway-top p {
    color: var(--gateway-accent);
}

.nc-site-map__gateway h3 {
    margin: 4px 0 0;
    color: var(--nc-charcoal-blue);
    font-size: clamp(1.35rem, 2vw, 1.7rem);
    font-weight: 750;
    line-height: 1.1;
}

.nc-site-map__gateway-copy {
    min-height: 75px;
    margin: 21px 0;
    color: #587081;
    font-size: .91rem;
    line-height: 1.55;
}

.nc-site-map__category-list,
.nc-site-map__directory-card ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.nc-site-map__category-list {
    border-top: 1px solid rgba(20,52,77,.1);
}

.nc-site-map__category-list li {
    border-bottom: 1px solid rgba(20,52,77,.1);
}

.nc-site-map__category-list a,
.nc-site-map__directory-card li a {
    display: flex;
    gap: 10px;
    align-items: center;
    color: #315b77;
    font-size: .9rem;
    font-weight: 650;
    text-decoration: none;
}

.nc-site-map__category-list a {
    min-height: 48px;
}

.nc-site-map__category-list .nc-cat-icon {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
    color: var(--gateway-accent);
}

.nc-site-map__category-list b,
.nc-site-map__directory-card b {
    margin-left: auto;
    color: var(--gateway-accent);
    font-size: 1.05rem;
    transition: transform 150ms ease;
}

.nc-site-map__category-list a:hover,
.nc-site-map__directory-card a:hover {
    color: var(--nc-clay);
}

.nc-site-map__category-list a:hover b,
.nc-site-map__directory-card a:hover b {
    transform: translateX(4px);
}

.nc-site-map__gateway-all {
    display: inline-flex;
    gap: 10px;
    align-items: center;
    margin-top: auto;
    padding-top: 23px;
    color: var(--nc-charcoal-blue);
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .07em;
    text-decoration: none;
    text-transform: uppercase;
}

.nc-site-map__gateway-all span {
    color: var(--gateway-accent);
    font-size: 1.1rem;
}

.nc-site-map__gateway-all:hover {
    color: var(--nc-clay);
}

.nc-site-map__directory {
    display: grid;
    grid-template-columns: 1.25fr .75fr;
    gap: 20px;
    margin-top: 20px;
}

.nc-site-map__directory-card {
    padding: clamp(27px, 4vw, 42px);
    color: #526c7d;
    background: #fff;
    border: 1px solid rgba(20,52,77,.12);
    border-radius: 22px;
}

.nc-site-map__directory-card--plan {
    background:
        radial-gradient(circle at 95% 10%, rgba(132,165,137,.18), transparent 28%),
        #fff;
}

.nc-site-map__directory-card > p {
    max-width: 650px;
    margin: 15px 0 25px;
    line-height: 1.6;
}

.nc-site-map__directory-card ul {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 24px;
}

.nc-site-map__directory-card li a {
    min-height: 45px;
    border-bottom: 1px solid rgba(20,52,77,.11);
}

.nc-site-map__directory-card b {
    color: var(--nc-clay);
}

@media (max-width: 1080px) {
    .nc-site-map__gateways {
        grid-template-columns: 1fr;
    }

    .nc-site-map__gateway-copy {
        min-height: 0;
    }
}

@media (max-width: 760px) {
    .nc-site-map__heading {
        align-items: flex-start;
        flex-direction: column;
    }

    .nc-site-map__directory {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 540px) {
    .nc-site-map__hero-inner {
        padding-block: 58px 68px;
    }

    .nc-site-map__directory-card ul {
        grid-template-columns: 1fr;
    }
}