/* Experience Serendipity v3.8 -- mobile-first routes + soulful touches. */
.mobile-primary-nav{display:none}
.home-pathways{padding:75px 0 90px;background:#f5f0e6}
.pathways-heading{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:28px}
.pathways-heading h2{font:500 clamp(36px,5vw,58px)/1.08 var(--serif);margin:9px 0}
.pathways-heading p{color:var(--muted);margin:0}
.pathways-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.pathway-card{min-width:0;background:#123b4d;position:relative;min-height:330px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;border-radius:5px;isolation:isolate}
.pathway-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .65s ease}
.pathway-card:before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(7,41,48,.89),rgba(7,41,48,.04) 70%);z-index:1}
.pathway-card:focus-visible{outline:3px solid #cb9c46;outline-offset:3px}
.pathway-card:hover img{transform:scale(1.045)}
.pathway-label{z-index:2;position:relative;color:#fff;display:grid;padding:22px 16px 20px;gap:3px}
.pathway-label strong{font:500 31px/1 var(--serif)}
.pathway-label small{font-size:12px;line-height:1.45;min-height:34px;color:#f3f1e9}
.pathway-label>span{font-size:17px;margin-top:6px;opacity:.85}
.related-discover{background:#f5f0e6}
.related-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.related-card{display:grid;grid-template-columns:44% 56%;min-height:150px;background:#fff;overflow:hidden;border:1px solid rgba(18,59,77,.12);border-radius:5px}
.related-card img{height:100%;object-fit:cover}
.related-card span{padding:18px;display:flex;flex-direction:column;justify-content:center;gap:12px}
.related-card strong{font:500 27px/1 var(--serif)}
.related-card small{font:500 11px/1.5 var(--sans);letter-spacing:.03em;color:#456b70}
.related-card:hover,.related-card:focus-visible{outline:2px solid #bf9b55;outline-offset:2px}
.hero-location-lockup{display:flex;flex-direction:column;gap:3px;align-items:flex-start}
.hero-location-lockup span:last-child{white-space:nowrap}
/* Live companion: travel over the upper edge before resting at a quiet page corner */
.serendipity-bird-figure{animation:none!important;transform:scale(.72);opacity:.82;filter:drop-shadow(0 2px 4px rgba(7,43,44,.45)) saturate(1.18) contrast(1.13)}
.bird-wing-back,.bird-wing-front{animation-iteration-count:infinite;animation-duration:.48s}
/* Bee: a true entrance across its own decoration area, then a quiet landing */
.js-motifs .motif-events-bee:not(.is-revealed){opacity:0!important;transform:translate(75px,-25px) rotate(12deg) scale(.8)!important}
.motif-events-bee.is-revealed{animation:bee-v38-visit 4.5s cubic-bezier(.24,.42,.4,1) both!important}
@keyframes bee-v38-visit{0%{opacity:0;transform:translate(78px,-25px) rotate(16deg) scale(.76)}20%{opacity:.85;transform:translate(12px,-30px) rotate(-8deg) scale(.9)}52%{opacity:.95;transform:translate(-22px,6px) rotate(4deg) scale(1)}76%{opacity:.91;transform:translate(7px,-6px) rotate(-4deg) scale(.95)}100%{opacity:.82;transform:translate(0,0) rotate(0) scale(.93)}}
/* Real growth is visible: a bamboo shoot progressively reveals from roots to leaves */
.motif-river-intro{overflow:hidden;min-height:450px}
.motif-river-intro .motif-bamboo-grow{left:auto;right:1%;bottom:4%;width:clamp(135px,15vw,220px);opacity:.83;transform:translateX(4%);transform-origin:bottom center;clip-path:inset(0 0 0 0)}
.js-motifs .motif-bamboo-grow:not(.is-revealed){opacity:0!important;clip-path:inset(100% 0 0 0)!important;transform:translate(4%,10px) scale(.9)!important}
.motif-bamboo-grow.is-revealed{animation:bamboo-v38-grow 4.1s cubic-bezier(.22,.66,.31,1) both!important}
@keyframes bamboo-v38-grow{0%{opacity:0;clip-path:inset(100% 0 0 0);transform:translate(4%,10px) scale(.9)}15%{opacity:.82}60%{clip-path:inset(35% 0 0 0)}100%{clip-path:inset(0 0 0 0);opacity:.82;transform:translate(4%,0) scale(1)}}
.motif-river-intro>.container{padding-right:clamp(50px,9vw,120px)}
@media (max-width:900px){
  /* A reliable always-visible route instead of a hidden-only hamburger menu. */
  .site-header,.site-header.inner{position:sticky;top:0;left:auto;right:auto;background:#0b425b;color:#fff;z-index:100;border-bottom:0;box-shadow:0 3px 9px rgba(0,0,0,.08)}
  .site-header .nav{min-height:60px}
  .nav-toggle{display:inline-flex;align-items:center;gap:7px;font-size:16px;font-weight:500;min-height:44px}
  .nav-toggle .menu-label{font-size:12px;letter-spacing:.045em}
  .nav-links,.site-header.inner .nav-links{position:absolute;top:100%;left:0;right:0;bottom:auto;inset:auto 0 auto 0;display:none;margin:0;background:#0b425b;max-height:calc(100dvh - 115px);overflow-y:auto;padding:25px 25px 30px;box-shadow:0 12px 15px rgba(0,0,0,.21)}
  .nav-links.open{display:flex}
  .mobile-primary-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3px;padding:0 10px 9px;max-width:680px;margin:0 auto}
  .mobile-primary-nav a{min-height:43px;display:flex;align-items:center;justify-content:center;background:#205569;color:white;text-transform:none;letter-spacing:0;border-radius:3px;font-size:12px;font-weight:600;padding:3px 2px;text-align:center}
  .mobile-primary-nav a[aria-current=page]{background:#f5f0e6;color:#174657}
  .mobile-primary-nav a:focus-visible{outline:3px solid #e1c185;outline-offset:-3px}
  .hero{min-height:650px}
  .pathways-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pathway-card{min-height:260px}
}
@media (max-width:600px){
  .site-header .nav{min-height:57px;gap:5px;width:calc(100% - 28px)}
  .site-header .brand{min-width:0}
  .site-header .brand b{font-size:26px}
  .site-header .brand small{font-size:7px;letter-spacing:.15em}
  .mobile-primary-nav{max-width:none;padding:0 9px 8px;gap:3px}
  .mobile-primary-nav a{font-size:11px;min-height:44px}
  .hero-content{padding-top:45px}
  .hero-location-lockup{gap:3px}
  .hero-location-lockup span{font-size:10px}
  .home-pathways{padding:50px 0 60px}
  .pathways-heading{display:block;margin-bottom:20px}
  .pathways-heading h2{font-size:39px}
  .pathways-heading .text-link{display:inline-block;margin-top:8px}
  .pathways-grid{gap:10px}
  .pathway-card{min-height:220px}
  .pathway-label{padding:17px 11px 13px}
  .pathway-label strong{font-size:27px}
  .pathway-label small{font-size:10px;min-height:30px}
  .related-grid{grid-template-columns:1fr}
  .related-card{min-height:125px}
  .motif-events-bee{width:82px!important;right:6px;top:16px;opacity:.85}
  .connection-intro.motif-host>.container{padding-right:85px}
  .motif-river-intro{padding-bottom:95px;min-height:500px}
  .motif-river-intro .motif-bamboo-grow{width:125px!important;right:0;bottom:0;opacity:.85}
  .motif-river-intro>.container{padding-right:0}
  .serendipity-bird-figure{width:82px}
}
@media (max-width:365px){.mobile-primary-nav a{font-size:10px}.pathway-label strong{font-size:24px}}
@media (prefers-reduced-motion:reduce){
 .serendipity-bird-figure{animation:none!important;opacity:.78!important;transform:scale(.72)!important}
 .bird-wing-back,.bird-wing-front{animation:none!important;transform:none!important}
 .motif-events-bee.is-revealed,.motif-bamboo-grow.is-revealed{animation:none!important;clip-path:none!important;opacity:.82!important;transform:none!important}
 .pathway-card img{transition:none}
}
/* Keep the footer wordmark and emblem inside the narrowest phone screens. */
@media(max-width:365px){
  .site-footer .footer-grid{grid-template-columns:minmax(0,1fr)}
  .site-footer .footer-grid>div{min-width:0}
  .site-footer .brand.brand-with-mark{max-width:100%;width:100%;padding-right:50px}
  .site-footer .brand.brand-with-mark b{font-size:41px;letter-spacing:0}
  .site-footer .brand.brand-with-mark .brand-mark{width:50px}
}