/* Homepage-only editorial treatment. The original BAS photography, ocean blue
   and forest palette connect this visitor experience to the Society's identity. */
.site-head.home-head { background:var(--forest); }
.wild-opening { position:relative; isolation:isolate; height:116svh; min-height:820px; color:#fffef5; background:var(--forest); }
/* A real sticky image: no fixed-background mobile repainting or scroll script. */
.wild-backdrop { position:sticky; top:0; height:88svh; min-height:600px; z-index:-1; }
.wild-backdrop img { width:100%; height:100%; object-fit:cover; object-position:65% 45%; }
.wild-backdrop::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#041c3ac7 0%,#062e4855 44%,#092b3d00 74%),linear-gradient(0deg,#062b43d9,transparent 42%); }
.wild-introduction { position:absolute; top:0; left:0; width:100%; min-height:66svh; padding:clamp(42px,6vw,100px) 6vw 35px; }
.wild-introduction .eyebrow { color:#d0eeed; font-size:.72rem; letter-spacing:.15em; }
.wild-introduction h1 { font-size:clamp(4rem,7.3vw,8rem); max-width:10ch; margin:24px 0; line-height:.95; }
.wild-introduction h1 em { font-weight:400; color:#c7eeed; }
.wild-introduction>p { max-width:36ch; font-size:clamp(1rem,1.15vw,1.15rem); line-height:1.7; }
.wild-actions { display:flex; flex-wrap:wrap; align-items:center; gap:20px 27px; margin-top:30px; }
.wild-actions>a:not(.button) { color:#fff; font-size:.87rem; }
.wild-actions .button { background:#f3f4df; color:#123c43; min-height:50px; }
.wild-scroll { display:inline-flex; gap:22px; align-items:center; color:#fffef5; font-size:.72rem; margin-top:48px; letter-spacing:.05em; text-decoration:none; }
.wild-scroll span { font-size:1.5rem; }
.wild-opening a:hover { color:var(--sea-glass); }
.wild-opening .button:hover { color:#103b3c; background:#d5f2df; }
.wild-closing { position:absolute; left:6vw; right:6vw; bottom:38px; display:flex; justify-content:space-between; align-items:flex-end; gap:30px; }
.wild-closing p { font-family:var(--serif); font-size:clamp(2rem,3.5vw,3.7rem); line-height:1.08; margin:0; }
.wild-closing a { max-width:29ch; font-size:.65rem; color:#e4edef; text-align:right; }
/* A compact navigation rail follows the full-bleed image instead of floating
   controls over wildlife. Every destination is a normal shareable page. */
.wild-quicklinks { display:grid; grid-template-columns:repeat(3,1fr); padding:0 6vw; background:var(--forest); color:#f5f4e8; }
.wild-quicklinks a { display:flex; gap:18px; align-items:center; min-height:100px; padding:24px; text-decoration:none; border-left:1px solid #ffffff24; font-size:.88rem; }
.wild-quicklinks a:last-child { border-right:1px solid #ffffff24; }
.wild-quicklinks span { font-size:.65rem; color:#9acdc8; }
.wild-quicklinks b { margin-left:auto; font-weight:400; font-size:1.2rem; }
.wild-quicklinks a:hover { color:#d8f1bb; background:#ffffff09; }
/* Avoid oversized fixed/sticky imagery on small screens. The turtle's head
   remains in frame; copy follows the photograph instead of covering it. */
@media(max-width:800px) {
    .wild-opening { height:auto; min-height:0; display:flex; flex-direction:column; }
    .wild-backdrop { position:relative; top:auto; height:62vw; min-height:290px; max-height:480px; z-index:0; order:0; }
    .wild-backdrop img { object-position:70% 42%; }
    .wild-backdrop::after { background:linear-gradient(0deg,var(--forest),transparent 40%); }
    .wild-introduction { position:relative; padding:15px 7vw 35px; min-height:0; order:1; }
    .wild-introduction h1 { font-size:clamp(3.7rem,12vw,6rem); margin:22px 0; max-width:11ch; }
    .wild-introduction .eyebrow { font-size:.59rem; }
    .wild-introduction>p { max-width:45ch; }
    .wild-actions { gap:23px; }
    .wild-actions .button { width:100%; justify-content:space-between; font-size:.82rem; }
    .wild-scroll { margin-top:32px; }
    .wild-closing { position:relative; left:auto; right:auto; bottom:auto; padding:0 7vw 30px; order:2; }
    .wild-closing p { display:none; }
    .wild-closing a { text-align:left; max-width:none; font-size:.59rem; }
    .wild-quicklinks { grid-template-columns:1fr; padding:0 7vw 15px; }
    .wild-quicklinks a,.wild-quicklinks a:last-child { border:0; border-top:1px solid #ffffff30; min-height:68px; padding:17px 0; }
}
/* Respect motion preferences and short viewports without hiding any content. */
@media(prefers-reduced-motion:reduce), (min-width:801px) and (max-height:650px) {
    .wild-opening { height:auto; min-height:900px; }
    .wild-backdrop { position:absolute; inset:0; height:100%; min-height:0; }
    .wild-introduction { position:relative; min-height:0; padding-bottom:200px; }
}
@media(prefers-reduced-motion:reduce) and (max-width:800px) {
    .wild-opening { min-height:0; }
    .wild-backdrop { position:relative; inset:auto; height:62vw; min-height:290px; }
    .wild-introduction { padding-bottom:35px; }
}

/* Explicit height:auto lets the CSS ratio override intrinsic image attributes
   as columns narrow, preventing oversized images on phones.
   Seven simple, generously sized destination links sit beside one genuine BAS
   wildlife photograph. The full directory retains filters and shortlist tools. */
.home-places { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,6vw,90px); padding-block:85px; align-items:center; }
.home-places-photo { margin:0; position:relative; }
.home-places-photo>img { width:100%; height:auto; aspect-ratio:4/5; object-fit:cover; object-position:55% center; }
.home-places-photo figcaption { display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; font-size:.65rem; line-height:1.5; margin-top:14px; color:var(--muted); }
.home-places-photo figcaption a { font-size:.6rem; }
.home-places-index h2 { margin:16px 0 28px; font-size:clamp(2.8rem,3.8vw,4.5rem); }
.home-places-index nav { border-top:1px solid var(--line); }
.home-places-index nav>a { display:grid; grid-template-columns:24px 1fr 20px; gap:16px; align-items:center; min-height:73px; padding:14px 4px; border-bottom:1px solid var(--line); text-decoration:none; }
.home-places-index nav>a:hover { background:var(--coastal-soft,#e7eef2); }
.home-place-number { font-size:.62rem; color:var(--muted); }
.home-places-index strong { display:block; font-weight:500; font-size:1.03rem; line-height:1.3; }
.home-places-index small { display:block; color:var(--muted); font-size:.69rem; margin-top:3px; }
.home-places-actions { display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; padding-top:24px; font-size:.78rem; }

/* Different image scales give the people/history section an editorial rhythm
   without introducing another background theme or disconnected card system. */
.home-people { padding-block:90px; }
.home-people-heading h2 { margin:18px 0 45px; }
.home-people-grid { display:grid; grid-template-columns:minmax(0,1.65fr) minmax(0,1fr); gap:clamp(30px,5vw,75px); align-items:start; }
.home-story-photo { display:block; overflow:hidden; }
.home-story-photo img { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; }
.home-people-history { padding-top:75px; }
.home-people-history .home-story-photo img { aspect-ratio:1.45; }
.home-archive-label { display:block; color:var(--muted); font-size:.66rem; margin:13px 0 22px; }
.home-people h3 { font-family:var(--serif); font-size:clamp(2rem,2.7vw,3rem); font-weight:400; line-height:1.07; margin-bottom:18px; }
.home-people p { color:var(--muted); font-size:.94rem; margin-bottom:22px; }
.home-people .text-link { display:inline-flex; min-height:44px; align-items:center; font-size:.83rem; }
.home-people-credit { display:block; font-size:.65rem; color:var(--muted); margin-top:24px; }

/* BAS's original palm-island sunset closes the story and leads to practical
   planning. Its own colors supply warmth; the interface keeps the same ocean blue. */
.home-sunset { position:relative; isolation:isolate; min-height:640px; display:grid; align-items:center; color:var(--paper,#fffdf7); background:var(--forest); }
.home-sunset>img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 52%; z-index:-2; }
.home-sunset::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,#06283fed,#082c4480 55%,#082c441a),linear-gradient(0deg,#082c4480,transparent 65%); z-index:-1; }
.home-sunset-copy { padding-block:80px; }
.home-sunset h2 { max-width:17ch; margin:20px 0 28px; }
.home-sunset p { max-width:43ch; font-size:1rem; }
.home-sunset .eyebrow { color:var(--sea-glass,#c7e3ee); }
.home-sunset-credit { display:inline-block; color:var(--paper,#fffdf7); font-size:.65rem; margin-top:35px; }
.home-sunset a:hover { color:var(--sea-glass,#c7e3ee); }

@media(max-width:800px) {
    .home-places { grid-template-columns:1fr; gap:28px; padding-block:55px; }
    .home-places-photo>img { aspect-ratio:4/3; object-position:center 40%; }
    .home-places-index h2 { margin-bottom:25px; }
    .home-places-index nav>a { min-height:75px; }
    .home-people { padding-block:55px; }
    .home-people-grid { grid-template-columns:1fr; gap:35px; }
    .home-people-history { padding-top:0; }
    .home-people-heading h2 { margin-bottom:30px; }
    .home-archive-label { margin-bottom:17px; }
    .home-sunset { min-height:630px; }
    .home-sunset::after { background:linear-gradient(0deg,#06283fed,#082c4480); }
    .home-sunset>img { object-position:63% center; }
    .home-sunset-copy { padding-block:60px; }
    .home-sunset .eyebrow { font-size:.61rem; }
}