/* Site-wide polish: page heroes, reveals, cards, footer, page transitions */
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
@view-transition{navigation:auto}
::selection{background:#8CCB3F;color:#041638}
main h1,main h2{text-wrap:balance}
main p{text-wrap:pretty}
.gx-pg{position:fixed;left:0;top:0;height:3px;width:100%;z-index:200;background:linear-gradient(90deg,#2F8F3A,#8CCB3F);transform-origin:left;transform:scaleX(0);pointer-events:none}

/* page hero (shared by listing, about, contact, journal, guides) */
.ph{position:relative;margin-top:-32px;overflow:hidden;background:#041638;color:#fff;padding:6.5rem var(--pad) clamp(3rem,6vw,5.5rem);border-radius:0 0 clamp(26px,4vw,52px) clamp(26px,4vw,52px)}
@media(min-width:1280px){.ph{margin-top:-46px;padding-top:7.8rem}}
.ph::before{content:'';position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.09) 1px,transparent 1px);background-size:28px 28px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 70%);mask-image:linear-gradient(90deg,transparent,#000 70%)}
.ph-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.5;animation:ph-drift 16s ease-in-out infinite alternate}
.ph-orb.a{width:30rem;height:30rem;right:-8rem;top:-11rem;background:#1E78D0}
.ph-orb.b{width:26rem;height:26rem;left:28%;bottom:-15rem;background:#2F8F3A;animation-delay:-6s}
@keyframes ph-drift{to{transform:translate(-70px,45px) scale(1.18)}}
.ph-road{position:absolute;left:0;bottom:0;width:100%;height:120px;opacity:.55;pointer-events:none}
.ph-in{position:relative;z-index:2;max-width:1400px;margin:0 auto}
.ph-k{display:flex;align-items:center;gap:.9rem;margin:0;font-size:14px;letter-spacing:.06em;color:#8CCB3F;opacity:0;animation:hm-fade .9s .1s forwards}
.ph-k::before{content:'';width:42px;height:1px;background:#8CCB3F}
.ph h1{margin:1.1rem 0 0;max-width:16ch;font:400 clamp(2.5rem,6vw,5.4rem)/.98 'DM Serif Display',serif;letter-spacing:-.025em}
.ph h1 .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.1em}
.ph h1 .w>span{display:inline-block;transform:translateY(110%);animation:hm-up 1.1s cubic-bezier(.22,1,.36,1) forwards;animation-delay:calc(var(--i) * 80ms + 150ms)}
.ph-p{margin:1.5rem 0 0;max-width:38rem;font-size:17px;line-height:1.8;color:rgba(255,255,255,.76);opacity:0;animation:hm-fade 1s .6s forwards}

/* custom page heroes (parks, Kilimanjaro, Zanzibar, safari detail): headline rise + slow photo settle */
main:not(.hm)>section:first-of-type:not(.ph) h1{animation:gx-h1 1.2s cubic-bezier(.22,1,.36,1) both}
main:not(.hm)>section:first-of-type:not(.ph) img[data-photo]{animation:gx-kb 10s ease-out both}
@keyframes gx-h1{from{opacity:0;transform:translateY(46px)}}
@keyframes gx-kb{from{transform:scale(1.12)}}

/* scroll reveal (applied by ui.js, removed once finished so hover styles resume) */
.gx{opacity:0;transform:translateY(34px);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1);transition-delay:var(--gd,0s)}
.gx.gx-in{opacity:1;transform:none}

/* cards */
.hm-go{position:absolute;right:1rem;top:1rem;z-index:3;display:flex;width:42px;height:42px;align-items:center;justify-content:center;border-radius:50%;background:rgba(255,255,255,.95);color:#041638;transition:.5s cubic-bezier(.22,1,.36,1)}
.group:hover .hm-go{background:#8CCB3F;transform:rotate(45deg) scale(1.1)}
.grid>.hm-card{width:100%}
.hm-card:hover{box-shadow:0 44px 80px -34px rgba(4,22,56,.8)}
article.group h3 a{background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .5s}
article.group:hover h3 a{background-size:100% 1px}

/* footer */
footer nav a{transition:color .3s,transform .4s cubic-bezier(.22,1,.36,1)}
footer nav a:hover{transform:translateX(6px)}

/* destinations: rhythmic bento grid */
.hm-bento{display:grid;gap:20px;grid-template-columns:1fr}
@media(min-width:640px){.hm-bento{grid-template-columns:1fr 1fr}}
@media(min-width:1024px){.hm-bento{grid-template-columns:repeat(3,1fr);grid-auto-flow:dense}.hm-bento>div:nth-child(7n+1){grid-column:span 2}.hm-bento>div>a{min-height:430px!important}}
.hm-bento>div{display:grid}
.hm-bento>div>a{height:100%;min-height:360px;aspect-ratio:auto!important}

/* safari detail: facts band + mobile enquiry bar */
.sf-facts{background:#fff;border-bottom:1px solid rgba(11,51,128,.08)}
.sf-g{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem 1rem;padding-top:1.6rem;padding-bottom:1.6rem}
@media(min-width:900px){.sf-g{grid-template-columns:repeat(4,1fr);padding-top:2rem;padding-bottom:2rem}.sf-g>div{border-left:1px solid rgba(11,51,128,.12);padding-left:1.6rem}.sf-g>div:first-child{border:0;padding-left:0}}
.sf-g>div{display:grid;grid-template-columns:auto 1fr;column-gap:.9rem;align-items:center}
.sf-g .ic{grid-row:span 2;display:flex;width:46px;height:46px;align-items:center;justify-content:center;border-radius:50%;background:rgba(140,203,63,.25);color:#2F8F3A}
.sf-g small{font-size:12.5px;color:#5A6B85}
.sf-g strong{font:400 19px/1.2 'DM Serif Display',serif;color:#0B3380}
.sf-cta{position:fixed;z-index:90;left:12px;right:76px;bottom:12px;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.6rem .6rem .6rem 1.3rem;border-radius:999px;background:rgba(4,22,56,.9);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:#fff;box-shadow:0 20px 40px -16px rgba(4,22,56,.7)}
.sf-cta small{display:block;font-size:11px;color:rgba(255,255,255,.65)}
.sf-cta strong{font:400 24px/1 'DM Serif Display',serif;color:#8CCB3F}
.sf-cta .hm-btn{padding:.9rem 1.3rem}
@media(min-width:1024px){.sf-cta{display:none}}
details.day{transition:transform .4s cubic-bezier(.22,1,.36,1),box-shadow .4s}
details.day:hover{transform:translateY(-2px)}
