/* Animal Rescue Centres: the original page had no inline <style>; its stylesheet css/animal_rescue_centres.css is loaded via the design's styles. */

/* Animal Rescue Centres in the site style (Home → Territorial Overview): full width inside 5% margins, left headings
   (38px), 8px corners, 150ms motion; each block in its own form: a directory of rows, a green award panel, ruled lists,
   a strip of chips and large photos. */
html body .arc-page .arc-wrap { max-width: none; padding: 0 5%; box-sizing: border-box; }
.arc-sec { padding: 52px 0 0; }
.arc-h2 { margin: 0 0 12px; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: clamp(28px, 2.5vw, 38px); line-height: 1.05; letter-spacing: -.035em; color: #0a2e1a; }
.arc-sub { margin: 0; max-width: 72ch; font-size: 17px; line-height: 1.6; color: #4b5563; }

/* centres: directory rows */
.arc-dir { list-style: none; margin: 32px 0 0; padding: 0; border-top: 2px solid #0a2e1a; }
.arc-dir-row { display: grid; grid-template-columns: 38.2fr 61.8fr; gap: 52px; padding: 32px 20px; border-bottom: 1px solid rgba(10, 46, 26, .12); border-radius: 0;
    transition: background-color 150ms cubic-bezier(.4, 0, .2, 1); }
.arc-dir-row:hover { background: #f2ede1; }
.arc-dir-place { display: flex; gap: 20px; align-items: flex-start; }
.arc-dir-pin { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: rgba(26, 71, 42, .1); color: #1a472a;
    transition: background-color 150ms, color 150ms, transform 300ms cubic-bezier(.34, 1.56, .64, 1); }
.arc-dir-row:hover .arc-dir-pin { background: #f1c40f; color: #0a2e1a; transform: translateY(-3px); }
.arc-dir-town { display: block; margin-bottom: 4px; font-size: 14px; font-weight: 700; color: #2d6a4f; }
.arc-dir-place h3 { margin: 0; font-size: 22px; font-weight: 800; line-height: 1.25; letter-spacing: -.015em; color: #0a2e1a; }
.arc-dir-about p { margin: 0 0 12px; font-size: 16px; line-height: 1.65; color: #1f2a22; }
.arc-dir-about p:last-child { margin-bottom: 0; }
.arc-dir-spec { display: flex; flex-wrap: wrap; gap: 8px; align-items: baseline; }
.arc-dir-spec span { padding: 2px 8px; border-radius: 4px; background: #0a2e1a; color: #fff; font-size: 12px; font-weight: 700; }

/* award: green panel on the golden split */
.arc-award { display: grid; grid-template-columns: 38.2fr 61.8fr; gap: 52px; align-items: center; padding: 52px; border-radius: 8px; background: #0a2e1a; color: #fff; }
.arc-award-head { display: flex; align-items: center; gap: 20px; }
.arc-medal { flex: none; display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: #f1c40f; color: #0a2e1a; box-shadow: 0 0 0 8px rgba(241, 196, 15, .15); }
.arc-award h2 { margin: 0; font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(24px, 2.2vw, 32px); font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: #f1c40f; }
.arc-award-words p { margin: 0 0 12px; font-size: 17px; line-height: 1.7; color: rgba(255, 255, 255, .85); }
.arc-award-words p:last-child { margin-bottom: 0; }
.arc-award-words strong { color: #fff; }

/* the two crime-control lists (standard list blocks): left heading, numbered entries in two ruled columns, no tint */
html body .arc-page .dz-k-list { padding: 52px 0 0 !important; background: transparent !important; }
html body .arc-page .dz-k-list::before, html body .arc-page .dz-k-list::after { display: none !important; }
html body .arc-page .dz-k-list .dz-wrap { max-width: none; padding: 0 5%; }
html body .arc-page .dz-k-list .dz-title { margin: 0 0 20px; text-align: left; font-family: 'Plus Jakarta Sans', sans-serif; font-weight: 800; font-size: clamp(24px, 2vw, 30px); line-height: 1.1; letter-spacing: -.025em; color: #0a2e1a; }
html body .arc-page .dz-k-list .dz-underline { display: none; }
html body .arc-page .dz-k-list .dz-list { counter-reset: arc; max-width: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 52px; border-top: 2px solid #0a2e1a; }
html body .arc-page .dz-k-list .dz-list li { counter-increment: arc; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 12px; align-items: baseline; margin: 0; padding: 16px 0; border: 0; border-bottom: 1px solid rgba(10, 46, 26, .12); border-radius: 0; background: none; box-shadow: none;
    font-size: 16px; line-height: 1.5; color: #1f2a22; transition: color 150ms; }
html body .arc-page .dz-k-list .dz-list li::before { content: counter(arc, decimal-leading-zero); font: 500 15px/1 Roboto, sans-serif; font-variant-numeric: tabular-nums; color: rgba(10, 46, 26, .45); transition: color 150ms; }
html body .arc-page .dz-k-list .dz-list li:hover::before { color: #b8860b; }
html body .arc-page .dz-k-list .dz-list li:hover { color: #0a2e1a; }
html body .arc-page .dz-k-list .dz-list-mark { display: none; }

/* partners strip */
.arc-partners-strip { display: flex; align-items: center; justify-content: space-between; gap: 20px 32px; flex-wrap: wrap; padding: 24px 32px; border-radius: 8px; background: #f2ede1; }
.arc-partners-strip h3 { margin: 0; display: flex; align-items: center; gap: 12px; font-size: 17px; font-weight: 800; color: #0a2e1a; }
.arc-partners-strip h3 i { color: #2d6a4f; }
.arc-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.arc-chips li { padding: 8px 12px; border-radius: 999px; box-shadow: inset 0 0 0 1px rgba(10, 46, 26, .25); font-size: 14px; font-weight: 600; color: #0a2e1a;
    transition: background-color 150ms, color 150ms, box-shadow 150ms; }
.arc-chips li:hover { background: #0a2e1a; color: #fff; box-shadow: inset 0 0 0 1px #0a2e1a; }

/* operations photos */
.arc-photos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 32px; }
.arc-photo { margin: 0; }
.arc-photo-frame { position: relative; aspect-ratio: 3 / 2; overflow: hidden; border-radius: 8px; background: #f2ede1; }
.arc-photo-frame img { display: block; width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; transition: transform 600ms cubic-bezier(.16, 1, .3, 1); }
.arc-photo:hover .arc-photo-frame img { transform: scale(1.03); }
.arc-photo figcaption { display: flex; flex-direction: column; gap: 4px; padding: 12px 0 0; }
.arc-photo figcaption strong { font-size: 18px; font-weight: 800; color: #0a2e1a; }
.arc-photo figcaption span { font-size: 15px; line-height: 1.55; color: #4b5563; }
html body .arc-page { padding-bottom: 84px; }

@media (max-width: 1000px) {
    .arc-dir-row, .arc-award { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    html body .arc-page .dz-k-list .dz-list { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 640px) {
    html body .arc-page .arc-wrap, html body .arc-page .dz-k-list .dz-wrap { padding: 0 20px; }
    .arc-dir-row { padding: 20px 0; }
    .arc-award { padding: 24px 20px; }
    .arc-photos { grid-template-columns: minmax(0, 1fr); }
    .arc-partners-strip { padding: 20px; }
}

/* Mouse interaction on every block: a soft light follows the pointer (--gx/--gy), a gold bar grows beside a directory
   row, the medal leans toward the pointer (--mx/--my), photos tilt toward it (--rx/--ry), list entries and chips move. */
.arc-dir-row { position: relative; overflow: hidden; isolation: isolate; }
.arc-dir-row::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: #f1c40f; transform: scaleY(0); transform-origin: top; transition: transform 300ms cubic-bezier(.16, 1, .3, 1); }
.arc-dir-row::after { content: ''; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity 200ms;
    background: radial-gradient(360px circle at var(--gx, 50%) var(--gy, 50%), rgba(26, 71, 42, .1), transparent 60%); }
.arc-dir-row:hover::before { transform: scaleY(1); }
.arc-dir-row:hover::after { opacity: 1; }
.arc-dir-row > * { transition: transform 300ms cubic-bezier(.16, 1, .3, 1); }
.arc-dir-row:hover > * { transform: translateX(6px); }
.arc-award { position: relative; overflow: hidden; isolation: isolate; }
.arc-award::after { content: ''; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity 200ms;
    background: radial-gradient(420px circle at var(--gx, 50%) var(--gy, 50%), rgba(241, 196, 15, .14), transparent 60%); }
.arc-award:hover::after { opacity: 1; }
.arc-medal { transform: perspective(300px) rotateX(var(--my, 0deg)) rotateY(var(--mx, 0deg)); transition: transform 200ms cubic-bezier(.4, 0, .2, 1), box-shadow 200ms; }
.arc-award:hover .arc-medal { box-shadow: 0 0 0 12px rgba(241, 196, 15, .18); }
html body .arc-page .dz-k-list .dz-list li { padding-left: 0; transition: color 150ms, background-color 150ms, padding-left 200ms cubic-bezier(.16, 1, .3, 1); }
html body .arc-page .dz-k-list .dz-list li:hover { padding-left: 12px; background: #f2ede1; }
.arc-chips li { transition: background-color 150ms, color 150ms, box-shadow 150ms, transform 150ms cubic-bezier(.4, 0, .2, 1); }
.arc-chips li:hover { transform: translateY(-2px); }
.arc-photo-frame { transform: perspective(1000px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform 200ms cubic-bezier(.4, 0, .2, 1); }
@media (prefers-reduced-motion: reduce) { .arc-medal, .arc-photo-frame, .arc-dir-row > * { transform: none !important; } }

/* Crime-control units side by side: two sand panels; one row per member with the body's icon, the member in plain
   readable words and a small tag for the body. Pointing at a row tints it and turns its icon gold. */
.arc-units { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; align-items: start; }
.arc-unit { padding: 32px; border-radius: 8px; background: #f2ede1; }
.arc-unit-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; padding-bottom: 20px; margin-bottom: 8px; border-bottom: 2px solid #0a2e1a; }
.arc-unit-head h2 { margin: 0; font-family: 'Plus Jakarta Sans', sans-serif; font-size: clamp(20px, 1.6vw, 24px); font-weight: 800; line-height: 1.25; letter-spacing: -.015em; color: #0a2e1a; }
.arc-unit-count { flex: none; padding: 4px 12px; border-radius: 999px; background: #0a2e1a; color: #fff; font: 600 13px/1.5 'Plus Jakarta Sans', sans-serif; }
.arc-unit-list { list-style: none; margin: 0; padding: 0; }
.arc-member { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 12px 8px; border-radius: 8px;
    transition: background-color 150ms cubic-bezier(.4, 0, .2, 1); }
.arc-member + .arc-member { box-shadow: 0 -1px 0 rgba(10, 46, 26, .1); }
.arc-member:hover { background: #fffdf8; box-shadow: none; }
.arc-member:hover + .arc-member { box-shadow: none; }
.arc-member-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #fff; color: #1a472a; transition: background-color 150ms, color 150ms, transform 300ms cubic-bezier(.34, 1.56, .64, 1); }
.arc-member:hover .arc-member-icon { background: #f1c40f; color: #0a2e1a; transform: scale(1.06); }
.arc-member-name { font-size: 16px; font-weight: 600; line-height: 1.45; color: #0a2e1a; }
.arc-member-tag { padding: 2px 8px; border-radius: 4px; font-size: 12px; font-weight: 700; white-space: nowrap; background: rgba(26, 71, 42, .1); color: #1a472a; }
.arc-member.is-police .arc-member-tag { background: #e3e9f4; color: #1e3a6b; }
.arc-member.is-bsf .arc-member-tag { background: #f3e7d6; color: #7a4a12; }
.arc-member.is-customs .arc-member-tag { background: #ece6f3; color: #4b2f73; }
.arc-member.is-wccb .arc-member-tag { background: #f5e3e1; color: #8a2a20; }
@media (max-width: 1000px) { .arc-units { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .arc-unit { padding: 20px; } .arc-member { grid-template-columns: 36px minmax(0, 1fr); } .arc-member-tag { grid-column: 2; justify-self: start; } .arc-member-icon { width: 36px; height: 36px; } }