.Three_Wrapper .contanier .Images li .UserButtons {
    width: auto;
    top: 14px;
    left: 14px;
    background: transparent;
}

.Three_Wrapper .contanier .Images li .UserButtons .Seen,
.Three_Wrapper .contanier .Images li .UserButtons .NotSeen {
    width: auto;
    margin: 0;
    padding: 0;
    font: inherit;
}

.Three_Wrapper .contanier .Images li .UserButtons .place-action {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 8px 13px;
    border: 1px solid rgba(255, 255, 255, .55);
    border-radius: 999px;
    background: rgba(12, 20, 27, .82);
    box-shadow: 0 5px 18px rgba(0, 0, 0, .32);
    color: #fff;
    font: 700 13px/1 "Roboto", sans-serif;
    letter-spacing: .04em;
    text-transform: uppercase;
    backdrop-filter: blur(7px);
    transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.Three_Wrapper .contanier .Images li .UserButtons .place-action:hover,
.Three_Wrapper .contanier .Images li .UserButtons .place-action:focus {
    border-color: #f2c66d;
    background: rgba(20, 31, 40, .96);
    color: #f2c66d;
    outline: none;
    transform: translateY(-1px);
}

.Three_Wrapper .contanier .Images li .UserButtons .place-action:focus-visible {
    outline: 3px solid rgba(242, 198, 109, .45);
    outline-offset: 2px;
}

.Three_Wrapper .contanier .Images li .UserButtons .place-action--seen {
    border-color: rgba(123, 211, 158, .7);
    background: rgba(25, 91, 59, .9);
}

.Three_Wrapper .contanier .Images li.Seen {
    border: 3px solid #58a97a;
}

/* Place listing cards use one database-authored highlight instead of a
   category-specific call to action. The anchor is the card's single primary
   interaction and retains the shared hover treatment. */
#place-list .Images li > .place-card-link:not(.place-card-link--animal)::after {
    content: none;
}

#place-list .Images li > .place-card-link:focus-visible {
    outline: 3px solid #f2c66d;
    outline-offset: -3px;
}

.place-card-highlight {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 24px;
    min-width: 0;
    margin-top: auto;
    padding: 8px 24px 25px;
    color: #f2c66d;
    font: 500 14px/1.45 "Lato", sans-serif;
}

.place-card-highlight > span {
    min-width: 0;
    overflow-wrap: anywhere;
}

.place-card-highlight__value {
    margin-left: auto;
    color: #f2c66d;
    text-align: right;
}

.place-card-highlight--fallback {
    justify-content: flex-end;
    color: #f2c66d;
    font: 700 13px/1.2 "Montserrat", sans-serif;
    letter-spacing: .06em;
    text-align: right;
    text-transform: uppercase;
}

/* Icelandic place names are often long compounds without spaces. Let the
   browser hyphenate them where it can and always keep the fallback break
   inside the card rather than clipping the title at the card edge. */
.Three_Wrapper .contanier .Images li a h2 {
    max-width: 100%;
    padding-right: 20px;
    padding-left: 20px;
    font: 700 24px/1.2 "Montserrat", sans-serif;
    letter-spacing: -.025em;
    text-align: center;
    overflow-wrap: anywhere;
    hyphens: auto;
}

.Three_Wrapper .contanier .Images li a img {
    aspect-ratio: 18/9;
}

.Three_Wrapper .contanier .Images li a h2 .animal-card-scientific {
    display: block;
    margin-top: 5px;
    font-size: .55em;
    font-weight: 400;
    line-height: 1.25;
}

.AnimalSubCategories {
    max-width: 1130px;
    margin: 0 auto;
    padding: 28px 24px 0;
    text-align: center;
}

.AnimalSubCategories h2 {
    margin: 0 0 17px;
    color: #fff;
    font: 600 24px/1.25 Georgia, serif;
}

.AnimalSubCategories__filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
}

.AnimalSubCategories__filters button {
    min-height: 42px;
    margin: 0;
    padding: 9px 16px;
    border: 1px solid rgba(255, 255, 255, .38);
    border-radius: 999px;
    background: #293238;
    color: #fff;
    font: 700 14px/1.2 "Roboto", sans-serif;
    cursor: pointer;
    transition: border-color .2s ease, background .2s ease, color .2s ease;
}

.AnimalSubCategories__filters button:hover,
.AnimalSubCategories__filters button:focus-visible,
.AnimalSubCategories__filters button.is-active {
    border-color: #f2c66d;
    background: #f2c66d;
    color: #111b21;
}

.AnimalSubCategories__filters button:focus-visible { outline: 3px solid rgba(242, 198, 109, .38); outline-offset: 3px; }
.AnimalSubCategories__filters button span { margin-left: 5px; opacity: .72; }
.AnimalSubCategories + .Images { padding-top: 24px; }
.Three_Wrapper .contanier .Images li[hidden] { display: none !important; }
.SeoIntro--bottom { margin-top: 36px; }

.PlaceFilters {
    display: grid;
    grid-template-columns: minmax(220px, .8fr) minmax(280px, 1.2fr) auto;
    align-items: end;
    gap: 16px;
    max-width: 1130px;
    margin: 0 auto;
    padding: 30px 24px 4px;
}
.CategoryHero .Inner { justify-content: flex-start; }
.CategoryHero .CategoryHero__content { width: 100%; min-width: 0; }
.CategoryHero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 22px; }
.CategoryHero__actions .CategoryHero__action { height: 38px; margin-top: 0; }
.PlaceFilters--hero {
    display: flex;
    flex: 0 1 auto;
    gap: 12px;
    max-width: none;
    margin: 0;
    padding: 0;
}
.PlaceFilters--hero .PlaceFilters__field:first-of-type { width: 190px; }
.PlaceFilters--hero .PlaceFilters__field--search { width: min(250px, 32vw); }
.PlaceFilters--hero .PlaceFilters__control input,
.PlaceFilters--hero .PlaceFilters__control select { border-color: rgba(255, 255, 255, .48); background: rgba(16, 27, 32, .9); }
.PlaceFilters__field label { display: block; margin: 0 0 8px; color: #dce2e3; font: 700 13px/1.2 "Roboto", sans-serif; letter-spacing: .05em; text-transform: uppercase; }
.PlaceFilters__control { position: relative; }
.PlaceFilters__control i { position: absolute; top: 50%; left: 16px; z-index: 1; color: #f2c66d; font-size: 16px; transform: translateY(-50%); pointer-events: none; }
.PlaceFilters__control input,
.PlaceFilters__control select { box-sizing: border-box; width: 100%; height: 50px; padding: 0 44px; border: 1px solid #536064; border-radius: 7px; outline: 0; background: #293238; color: #fff; font: 400 16px "Roboto", sans-serif; }
.PlaceFilters__control select { padding-right: 42px; cursor: pointer; appearance: none; }
.PlaceFilters--hero .PlaceFilters__control input,
.PlaceFilters--hero .PlaceFilters__control select { height: 38px; font-size: 14px; }
.PlaceFilters__control--select::after { content: ""; position: absolute; top: 50%; right: 17px; width: 8px; height: 8px; border-right: 2px solid #f2c66d; border-bottom: 2px solid #f2c66d; transform: translateY(-70%) rotate(45deg); pointer-events: none; }
.PlaceFilters__control input::placeholder { color: #aeb8ba; }
.PlaceFilters__control input:focus,
.PlaceFilters__control select:focus { border-color: #f2c66d; box-shadow: 0 0 0 3px rgba(242, 198, 109, .18); }
.PlaceFilters__status { min-width: 82px; margin: 0 0 15px; color: #bfc8ca; font: 600 14px/1.3 "Roboto", sans-serif; text-align: right; }
.PlaceFilters__empty { margin: 55px auto 80px; color: #dce2e3; font: 500 18px/1.5 "Roboto", sans-serif; text-align: center; }
.PlaceFilters__empty i { margin-right: 9px; color: #f2c66d; }
.PlaceFilters__empty[hidden] { display: none; }

@media (max-width: 900px) {
    .CategoryHero__actions { align-items: stretch; }
    .PlaceFilters--hero { flex: 1 1 440px; }
    .PlaceFilters--hero .PlaceFilters__field:first-of-type { flex: 0 1 190px; width: auto; }
    .PlaceFilters--hero .PlaceFilters__field--search { flex: 1 1 230px; width: auto; }
}

@media (max-width: 600px) {
    .place-card-highlight { gap: 16px; padding: 8px 20px 22px; }
    .AnimalSubCategories { padding: 22px 12px 0; }
    .AnimalSubCategories__filters { gap: 8px; }
    .AnimalSubCategories__filters button { flex: 1 1 calc(50% - 8px); }
    .CategoryHero { height: 520px; }
    .CategoryHero .Inner { gap: 20px; padding-top: 82px; padding-bottom: 24px; }
    .PlaceFilters { grid-template-columns: 1fr; gap: 14px; }
    .CategoryHero__actions { flex-direction: column; }
    .CategoryHero__actions .CategoryHero__action { align-self: flex-start; }
    .PlaceFilters--hero { flex: 0 0 auto; width: 100%; }
    .PlaceFilters--hero .PlaceFilters__field:first-of-type,
    .PlaceFilters--hero .PlaceFilters__field--search { flex: 1 1 0; min-width: 0; }
    .PlaceFilters__status { grid-column: auto; min-width: 0; margin: 0; text-align: left; }
}

.site-notice {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 10000;
    display: flex;
    align-items: flex-start;
    gap: 14px;
    width: min(430px, calc(100vw - 32px));
    padding: 18px;
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 16px;
    background: rgba(15, 24, 32, .97);
    box-shadow: 0 18px 55px rgba(0, 0, 0, .48);
    color: #fff;
    font-family: "Roboto", sans-serif;
    opacity: 0;
    transform: translateY(18px);
    transition: opacity .25s ease, transform .25s ease;
}

.site-notice--visible { opacity: 1; transform: translateY(0); }
.site-notice__icon { display: grid; flex: 0 0 44px; width: 44px; height: 44px; place-items: center; border-radius: 50%; background: #f2c66d; color: #101820; font-size: 19px; }
.site-notice__content { flex: 1 1 auto; min-width: 0; }
.site-notice__title { display: block; margin: 1px 26px 5px 0; font-size: 17px; line-height: 1.25; }
.site-notice__message { margin: 0 0 13px; color: #d9dee3; font-size: 14px; line-height: 1.45; }
.site-notice__login { display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px; border-radius: 7px; background: #d9a441; color: #101820; font-size: 13px; font-weight: 700; }
.site-notice__login:hover, .site-notice__login:focus { background: #f2c66d; color: #101820; }
.site-notice__close { position: absolute; top: 10px; right: 8px; width: 34px; height: 34px; margin: 0; color: #b9c1c8; cursor: pointer; font-size: 20px; }
.site-notice__close:hover, .site-notice__close:focus { color: #fff; }

@media (max-width: 600px) {
    .site-notice { right: 16px; bottom: 16px; left: 16px; width: auto; }
}

@media (prefers-reduced-motion: reduce) {
    .place-action, .site-notice { transition: none !important; }
}
