/* Offer details and a compact desktop header. */
.motion-handshake{transform-box:fill-box;transform-origin:center}
@keyframes nav-handshake{0%,16%,78%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-1px) rotate(-5deg)}44%{transform:translateY(1px) rotate(5deg)}58%{transform:translateY(-.5px) rotate(-3deg)}}
@media(prefers-reduced-motion:no-preference){
 #menu .nav-item:is(:hover,:focus-visible) .motion-handshake{animation:nav-handshake 2.8s ease-in-out infinite}
 @media(max-width:760px){#menu.open .motion-handshake{animation:nav-handshake 3.6s ease-in-out infinite}}
}
/* Posts uses the same animated icon and subtitle treatment as the other menu items. */
.motion-writing{stroke-dasharray:12;stroke-dashoffset:0}
@keyframes nav-writing{0%,12%{stroke-dashoffset:12;opacity:.35}45%,85%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:.5}}
@media(prefers-reduced-motion:no-preference){
 #menu .nav-item:is(:hover,:focus-visible) .motion-writing{animation:nav-writing 2.8s ease-in-out infinite}
 .motion-writing.writing-two{animation-delay:.18s!important}.motion-writing.writing-three{animation-delay:.36s!important}
 @media(max-width:760px){#menu.open .motion-writing{animation:nav-writing 3.4s ease-in-out infinite}}
}
@media(min-width:761px) and (max-width:1099px){.header-inner #menu{flex:1 0 100%}}
.service-output{padding:20px 22px;border-left:3px solid var(--yellow);background:#f0eee7;border-radius:0 10px 10px 0;max-width:650px;color:var(--ink);font-size:15px;line-height:1.7}
.service-output strong{display:block;margin-bottom:6px;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:#706039}
.scope-note{margin:0 0 38px;max-width:760px}
@media(min-width:1100px){header{display:flex;align-items:center;gap:24px;padding:0 max(24px,calc((100% - 1112px)/2))}.header-inner{flex:1;min-width:0;max-width:none;padding:20px 0;margin:0;gap:28px}.brand{gap:16px}.brand .wordmark{width:145px}.brand .name{width:145px;padding-left:16px}.header-inner nav{gap:20px}.language-switch{flex-shrink:0;margin:0;padding:0;gap:2px}.language-switch a,.language-switch button{min-width:36px;padding:4px 7px}}
@media(min-width:761px) and (max-width:1099px){.header-inner{padding-top:16px;padding-bottom:12px}.language-switch{padding-bottom:8px}}
@media(max-width:760px){.service-output{padding:17px 16px;font-size:15px}}

/* Keep the mobile header to one compact row; languages open with the menu. */
@media(max-width:760px){
 .header-inner{padding:10px 20px;gap:12px}
 .header-inner .menu-toggle{margin-left:auto;flex:0 0 44px}
 .js-menu .language-switch{display:none}
 .js-menu:has(#menu.open) .language-switch{display:flex}
 .language-switch{padding:0 20px 12px;gap:6px}
 .language-switch a,.language-switch button{min-width:44px;min-height:44px}
}
@media(max-width:350px){.header-inner{padding-inline:16px}.language-switch{padding-inline:16px}}

/* Invitations to explore, with a short preview of each destination. */
#menu .nav-item{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;column-gap:7px;position:relative;isolation:isolate}
.nav-title{grid-column:1;grid-row:1}
#menu .nav-item--featured .nav-title{color:var(--yellow)}
@media(min-width:761px){
 .header-inner #menu{gap:18px;font-size:12px}
 .nav-hint{position:absolute;top:calc(100% + 10px);left:0;width:230px;padding:14px 16px;border:1px solid #4b4536;border-radius:10px;background:#201e19;color:#e9e4d8;white-space:normal;font-size:13px;line-height:1.6;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .18s,transform .18s,visibility .18s;pointer-events:none;box-shadow:0 8px 22px #0002;z-index:30}
 #menu .nav-item:last-child .nav-hint{left:auto;right:0}
 #menu .nav-item:hover .nav-hint,#menu .nav-item:focus-visible .nav-hint{opacity:1;visibility:visible;transform:translateY(0)}
}
@media(min-width:1100px){header{gap:18px}.brand{gap:12px}.brand .wordmark{width:120px}.brand .name{width:120px;padding-left:12px}.header-inner{gap:22px}.header-inner #menu{gap:12px}}
@media(min-width:761px) and (max-width:1099px){.header-inner #menu{width:100%;justify-content:space-between;gap:14px;flex-wrap:wrap}}
@media(max-width:760px){
 .js-menu #menu.open,#menu{grid-template-columns:1fr;gap:9px}
 .js-menu #menu.open{display:grid;padding-top:12px;margin-top:2px}
 #menu .nav-item{padding:15px 16px;min-height:78px;grid-template-columns:minmax(0,1fr) 22px;column-gap:12px;row-gap:4px;white-space:normal;border:1px solid #37342c;border-radius:12px;background:#171715}
 #menu .nav-item:after{display:none}
 .nav-title{font-size:16px;line-height:1.4;font-weight:500}
 .nav-hint{grid-column:1;grid-row:2;font-size:12px;line-height:1.6;color:#bdb9b0}
 #menu .nav-item--featured{background:var(--yellow);border-color:var(--yellow)}
 #menu .nav-item--featured .nav-title{color:#151515}
 #menu .nav-item--featured .nav-hint{color:#514517}
 #menu .nav-item[aria-current]{box-shadow:inset 3px 0 0 var(--yellow)}
 #menu .nav-item--featured[aria-current]{box-shadow:inset 3px 0 0 #151515}
}
@media(prefers-reduced-motion:reduce){.nav-hint{transition:none}}

/* Four process-inspired motion motifs, drawn as SVG rather than text symbols. */
.nav-motion{grid-column:2;grid-row:1;display:block;width:22px;height:28px;color:var(--yellow);justify-self:end}
.nav-motion svg{display:block;width:100%;height:100%;overflow:visible}
.motion-thread{stroke-dasharray:36;stroke-dashoffset:0}
.motion-signal{opacity:0;transform-box:fill-box;transform-origin:center}
.motion-block{transform-box:fill-box;transform-origin:center}
.motion-route{opacity:.45}
.motion-traveller{fill:currentColor;stroke:none}
.nav-motion--journey .motion-traveller{offset-path:path('M5 25V13a6 6 0 0 1 6-6h10a6 6 0 0 1 6 6v6a6 6 0 0 1-6 6H5');cx:0;cy:0}
.motion-dot{fill:currentColor;stroke:none}
#menu .nav-item:is(:hover,:focus-visible) .motion-signal{animation:nav-signal 1.8s ease-out infinite}
#menu .nav-item:is(:hover,:focus-visible) .motion-thread{animation:nav-connect 1.8s ease-in-out infinite}
#menu .nav-item:is(:hover,:focus-visible) .motion-block{animation:nav-organise 2.2s ease-in-out infinite}
.block-one{--scatter-x:-1px;--scatter-y:5px;--scatter-rotation:-14deg}
.block-two{--scatter-x:0px;--scatter-y:-6px;--scatter-rotation:10deg;animation-delay:.1s!important}
.block-three{--scatter-x:2px;--scatter-y:3px;--scatter-rotation:-9deg;animation-delay:.2s!important}
#menu .nav-item:is(:hover,:focus-visible) .motion-traveller{animation:nav-journey 2.8s ease-in-out infinite}
#menu .nav-item:is(:hover,:focus-visible) .motion-dot{animation:nav-conversation 1.6s ease-in-out infinite}
.dot-two{animation-delay:.16s!important}.dot-three{animation-delay:.32s!important}
@keyframes nav-signal{0%{opacity:.8;transform:scale(.6)}85%,100%{opacity:0;transform:scale(1.8)}}
@keyframes nav-connect{0%,100%{stroke-dashoffset:36;opacity:.4}45%,75%{stroke-dashoffset:0;opacity:1}}
@keyframes nav-organise{0%,100%{transform:translate(var(--scatter-x),var(--scatter-y)) rotate(var(--scatter-rotation))}40%,75%{transform:translate(0,0) rotate(0)}}
@keyframes nav-journey{0%{offset-distance:0%}80%,100%{offset-distance:100%}}
@keyframes nav-conversation{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-3px);opacity:1}}
@media(min-width:1100px){.brand .wordmark{width:110px}.brand .name{width:110px}}
@media(max-width:760px){
 #menu .nav-item{grid-template-columns:minmax(0,1fr) 34px}
 .nav-motion{grid-row:1/3;width:34px;height:34px}
 #menu .nav-item--featured .nav-motion{color:#151515}
 #menu.open .motion-signal{animation:nav-signal 2.6s ease-out infinite}
 #menu.open .motion-thread{animation:nav-connect 2.6s ease-in-out infinite}
 #menu.open .motion-block{animation:nav-organise 3.2s ease-in-out infinite}
 #menu.open .motion-traveller{animation:nav-journey 3.8s ease-in-out infinite}
 #menu.open .motion-dot{animation:nav-conversation 2.2s ease-in-out infinite}
}
@media(prefers-reduced-motion:reduce){#menu .nav-motion *{animation:none!important;transition:none!important}.motion-thread{stroke-dashoffset:0}.motion-signal{opacity:0}}

/* Return to the beginning when the footer comes into view. */
.back-to-top{position:fixed;right:24px;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:40;display:grid;place-items:center;width:52px;height:52px;padding:0;border:1px solid #151515;border-radius:50%;background:var(--yellow);color:#151515;box-shadow:0 5px 20px #0002;cursor:pointer;transition:transform .2s,box-shadow .2s}
.back-to-top[hidden]{display:none}
.back-to-top svg{width:24px;height:24px;transition:transform .2s}
.back-to-top:hover{box-shadow:0 7px 24px #0003}
.back-to-top:hover svg{transform:translateY(-3px)}
.back-to-top:focus-visible{outline:3px solid #151515;outline-offset:4px}
@media(max-width:760px){.back-to-top{right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));width:48px;height:48px}footer{padding-bottom:90px}}
@media(prefers-reduced-motion:reduce){.back-to-top,.back-to-top svg{transition:none}.back-to-top:hover svg{transform:none}}

/* Analytics preferences, shown only after a real GA4 stream is configured. */
.analytics-consent{position:fixed;bottom:20px;left:20px;width:min(460px,calc(100vw - 40px));max-height:calc(100dvh - 40px);overflow:auto;z-index:60;padding:25px;background:#faf9f5;border:1px solid #c9c2af;border-radius:18px;box-shadow:0 10px 40px #0003;color:#151515}
.analytics-consent[hidden]{display:none}.analytics-consent h2{font-size:23px;letter-spacing:-.5px;margin:0 0 12px}.analytics-consent p{font-size:14px;line-height:1.7;margin-bottom:12px}.analytics-consent>a{font-size:12px;text-decoration:underline;text-underline-offset:3px}.analytics-consent-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.analytics-consent-actions button{padding:11px;border:1px solid #151515;border-radius:9px;min-height:44px;background:transparent;color:#151515;font-size:13px;cursor:pointer}.analytics-consent-actions button:first-child{background:#fac626}.analytics-settings{background:none;border:0;border-bottom:1px solid #777;color:inherit;font:inherit;padding:0;cursor:pointer;text-align:left;min-height:44px}.analytics-consent :focus-visible{outline:3px solid #a87900;outline-offset:3px}
@media(max-width:400px){.analytics-consent{left:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));width:calc(100vw - 24px);padding:20px}.analytics-consent-actions{grid-template-columns:1fr}}
