/* Recent roles cards (LinkedIn-style layout) */
.bsky-roles{display:flex;flex-direction:column;gap:var(--wp--preset--spacing--medium)}
.bsky-roles > *{margin:0!important}
.bsky-role-card > *{margin:0!important}
.bsky-role-card > * + *{margin-top:12px!important}
.bsky-li-head{display:flex;gap:16px;align-items:flex-start}
.bsky-li-head > *{margin:0!important}
.bsky-li-logo{flex:none;width:56px;height:56px;border-radius:10px;overflow:hidden;background:var(--wp--preset--color--base);border:1px solid var(--wp--preset--color--border-light)}
.bsky-li-logo img{width:100%!important;height:100%!important;object-fit:cover;display:block}
.bsky-li-text > *{margin:0!important}
.bsky-li-title{font-size:var(--wp--preset--font-size--medium);line-height:1.3}
.bsky-li-title a{color:inherit;text-decoration:none}
.bsky-li-sub{margin-top:2px!important}
.bsky-li-sub a{color:inherit}
.bsky-li-meta{margin-top:2px!important;font-size:var(--wp--preset--font-size--small);color:var(--wp--preset--color--secondary)}
.bsky-li-desc{font-size:var(--wp--preset--font-size--small);line-height:1.6}
.bsky-li-sub-role{position:relative;padding-left:20px;border-left:2px solid var(--wp--preset--color--border-light)}
.bsky-li-sub-role > *{margin:0!important}
.bsky-li-sub-role > .bsky-li-desc{margin-top:8px!important}
.bsky-li-sub-role .bsky-li-title{font-size:var(--wp--preset--font-size--base)}

/* Rolodex (added by rolodex.js; without JS the cards just stack) */
.bsky-roles.is-rolodex{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;outline:none}
.bsky-rolodex-stage{display:grid;perspective:1400px;padding-bottom:34px}
.bsky-rolodex-stage > .bsky-role-card{grid-area:1/1;align-self:start;margin:0!important;transform-origin:50% 100%;transition:transform .55s cubic-bezier(.2,.75,.25,1),opacity .4s ease,filter .4s ease;box-shadow:0 1px 2px rgba(30,30,38,.04)}
.bsky-rolodex-stage > [data-pos="0"]{z-index:4}
.bsky-rolodex-stage > .bsky-role-card{height:var(--card-h,auto);overflow:hidden;padding:var(--wp--preset--spacing--medium) var(--wp--preset--spacing--large)!important}
.bsky-rolodex-stage > .bsky-role-card > *{transition:opacity .3s ease}
.bsky-rolodex-stage > :not([data-pos="0"]):not([data-pos="-1"]) > *{opacity:0}
.bsky-rolodex-stage > [data-pos="1"]{z-index:3;transform:translateY(14px) scale(.95);filter:brightness(.965)}
.bsky-rolodex-stage > [data-pos="2"]{z-index:2;transform:translateY(28px) scale(.9);filter:brightness(.93)}
.bsky-rolodex-stage > [data-pos="3"]{z-index:1;transform:translateY(28px) scale(.9);opacity:0}
.bsky-rolodex-stage > [data-pos="-1"]{z-index:5;transform-origin:50% 0;transform:translateY(-24px) rotateX(80deg);opacity:0;pointer-events:none}
.bsky-rolodex-nav{display:flex;flex-direction:column;align-items:center;gap:10px}
.bsky-rolodex-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--wp--preset--color--border-light);background:var(--wp--preset--color--base);color:var(--wp--preset--color--main);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:border-color .2s,color .2s,transform .2s}
.bsky-rolodex-btn svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.bsky-rolodex-btn:hover:not(:disabled){border-color:var(--wp--preset--color--primary);color:var(--wp--preset--color--primary);transform:translateY(-1px)}
.bsky-rolodex-btn:disabled{opacity:.35;cursor:default}
.bsky-rolodex-btn:focus-visible,.bsky-roles.is-rolodex:focus-visible{outline:2px solid var(--wp--preset--color--primary);outline-offset:3px}
.bsky-rolodex-count{font-size:var(--wp--preset--font-size--small);color:var(--wp--preset--color--secondary);font-variant-numeric:tabular-nums}
@media (max-width:700px){
	.bsky-roles.is-rolodex{grid-template-columns:minmax(0,1fr)}
	.bsky-rolodex-nav{flex-direction:row;justify-content:center}
	.bsky-rolodex-nav .bsky-rolodex-btn:first-child svg{transform:rotate(-90deg)}
	.bsky-rolodex-nav .bsky-rolodex-btn:last-child svg{transform:rotate(-90deg)}
}
@media (prefers-reduced-motion:reduce){.bsky-rolodex-stage > .bsky-role-card{transition:opacity .2s ease}}
@media print{.bsky-rolodex-nav{display:none}.bsky-rolodex-stage > .bsky-role-card{position:static;transform:none!important;opacity:1!important;filter:none!important}.bsky-rolodex-stage{display:block}}
.bsky-pill{display:inline-block;vertical-align:middle;margin-left:8px;padding:2px 10px;border-radius:999px;background:#E1F5E9;color:#0F7440;font-size:12px;font-weight:600;line-height:1.5;letter-spacing:0;position:relative;top:-2px}
/* Social icons under the About page's "On this page" menu */
.bsky-toc .bsky-toc-social{margin:0!important;padding:10px 0 0 14px!important;gap:12px!important}
.bsky-toc .bsky-toc-social .wp-social-link{transition:color .2s}
.bsky-toc .bsky-toc-social .wp-social-link:hover{color:var(--wp--preset--color--primary)!important}

/* Testimonials carousel (added by rolodex.js; without JS the quotes just stack) */
.bsky-carousel{display:flex;flex-direction:column;gap:var(--wp--preset--spacing--small)}
.bsky-carousel > *{margin:0!important}
.bsky-carousel.is-carousel{flex-direction:row;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;gap:16px;outline:none}
.bsky-carousel.is-carousel::-webkit-scrollbar{display:none}
.bsky-carousel.is-carousel > *{flex:0 0 100%;scroll-snap-align:start;display:flex;flex-direction:column}
.bsky-carousel.is-carousel > * > .wp-block-group:first-child{flex:1}
.bsky-carousel.is-carousel:focus-visible{outline:2px solid var(--wp--preset--color--primary);outline-offset:3px}
.bsky-carousel-nav{display:flex;align-items:center;gap:14px;margin-top:var(--wp--preset--spacing--small)!important}
.bsky-carousel-dots{display:flex;gap:8px}
.bsky-carousel-dots button{width:8px;height:8px;padding:0;border:0;border-radius:50%;background:var(--wp--preset--color--border-light);cursor:pointer;transition:background .2s,width .2s}
.bsky-carousel-dots button[aria-current="true"]{background:var(--wp--preset--color--primary);width:22px;border-radius:999px}

.bsky-carousel > * > *{margin-left:0!important;margin-right:0!important;max-width:none!important}
.bsky-carousel.is-carousel{cursor:grab}
.bsky-carousel.is-carousel.is-dragging{cursor:grabbing;scroll-snap-type:none;user-select:none}
.bsky-carousel.is-carousel.is-dragging *{pointer-events:none}
/* Homepage: one row of testimonials, three in view on desktop */
.bsky-carousel--wide.is-carousel > *{flex:0 0 calc((100% - 32px) / 3);min-height:0!important}
@media (max-width:1000px){.bsky-carousel--wide.is-carousel > *{flex-basis:calc((100% - 16px) / 2)}}
@media (max-width:700px){.bsky-carousel--wide.is-carousel > *{flex-basis:88%}}
.bsky-testimonials .bsky-carousel-nav{max-width:var(--wp--style--global--wide-size);margin-left:auto!important;margin-right:auto!important;width:100%}
/* Homepage slider keeps the original masonry rhythm: quote-mark cards are two columns wide */
.bsky-carousel--wide.is-carousel > .is-wide{flex-basis:calc((100% - 32px) / 3 * 2 + 16px)}
@media (max-width:1000px){.bsky-carousel--wide.is-carousel > .is-wide{flex-basis:calc((100% - 16px) / 2)}}
@media (max-width:700px){.bsky-carousel--wide.is-carousel > .is-wide{flex-basis:88%}}
/* Desktop: the homepage slider moves a full row at a time (Phil + Michelle, then Lance + Carole), so it never rests on half a card */
@media (min-width:1001px){
	.bsky-carousel--wide.is-carousel > *{scroll-snap-align:none}
	.bsky-carousel--wide.is-carousel > :nth-child(odd){scroll-snap-align:start}
}
.bsky-hero-hello{margin-bottom:-10px!important;line-height:1.4;font-weight:700;font-size:1.3rem}
/* Hero text column: extra gap from the memoji on desktop only */
@media (max-width:781px){.wp-block-column:has(.bsky-hero-sub) > .wp-block-group{padding-left:var(--wp--preset--spacing--small)!important}}
/* About: Andorra video and the countries map side by side, same height (16:9 next to a square needs 16:9 widths) */
.bsky-media-pair{display:grid;grid-template-columns:16fr 9fr;gap:16px;align-items:start}
.bsky-media-pair > *,.bsky-about .bsky-media-pair > .wp-block-embed{margin:0!important}
/* Countries map card: our own SVG map on a dark square, with the count as real text */
.bsky-map-card{position:relative;aspect-ratio:1;background:#140330;border-radius:4px;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:8% 4% 6%;box-sizing:border-box;color:#fff}
.bsky-map-card > *{margin:0!important}
.bsky-map-card .bsky-map-svg img{width:100%;height:auto;display:block}
.bsky-map-stat{display:flex;flex-direction:column;gap:2px;line-height:1.2;padding-left:2%}
.bsky-map-label{font-size:.8em;opacity:.9}
.bsky-map-stat strong{font-size:1.15em;font-weight:600}
.bsky-map-sub{font-size:.8em;color:#b4aed6}
.bsky-media-pair .wp-block-embed iframe{border-radius:4px!important}
@media (max-width:600px){.bsky-media-pair{grid-template-columns:1fr}}
/* Click-to-load YouTube thumbnail and player (no YouTube UI) */
.bsky-yt,.bsky-yt-layer{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:transparent;cursor:pointer;display:block}
.bsky-yt{background:#000;border-radius:14px;overflow:hidden}
.bsky-yt img{width:100%;height:100%;object-fit:cover;display:block}
.bsky-yt-play{position:absolute;left:50%;top:50%;width:64px;height:64px;translate:-50% -50%;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 6px 20px rgba(0,0,0,.25);display:flex;align-items:center;justify-content:center;transition:scale .2s,opacity .2s}
.bsky-yt-play svg{width:26px;height:26px;margin-left:3px;fill:var(--wp--preset--color--main)}
.bsky-yt:hover .bsky-yt-play,.bsky-yt:focus-visible .bsky-yt-play{scale:1.06}
.bsky-yt:focus-visible,.bsky-yt-layer:focus-visible{outline:3px solid var(--wp--preset--color--primary);outline-offset:3px}
.wp-block-embed__wrapper.has-yt-frame{overflow:hidden;border-radius:14px;background:#000}
.wp-block-embed__wrapper .bsky-yt-frame{position:absolute!important;inset:0!important;width:100%!important;height:100%!important;border:0;pointer-events:none;border-radius:0!important;dynamic-range-limit:standard}
.bsky-yt-layer .bsky-yt-play{opacity:0}
.bsky-yt-layer.is-paused .bsky-yt-play,.bsky-yt-layer:focus-visible .bsky-yt-play{opacity:1}
.bsky-media-pair .bsky-yt,.bsky-media-pair .wp-block-embed__wrapper.has-yt-frame{border-radius:4px}
.bsky-yt{z-index:2;transition:opacity .25s ease}
.bsky-yt.is-loading{cursor:progress}
.bsky-yt.is-loading .bsky-yt-play{opacity:.6}
.bsky-yt.is-gone{opacity:0}
.bsky-yt-layer{z-index:3}
.has-yt-frame .bsky-yt-layer:not(.is-paused){cursor:pointer}
/* Keep HDR footage at normal brightness where the browser supports it */
.bsky-yt img,.has-yt-frame{dynamic-range-limit:standard}
/* About: social icons under the intro photos */
.bsky-about-social .wp-social-link{transition:color .2s}
.bsky-about-social .wp-social-link:hover{color:var(--wp--preset--color--primary)!important}
.bsky-about-social{gap:12px!important}
.bsky-about-intro .bsky-about-connect + *{margin-top:32px!important}
.bsky-about-connect > *{margin:0!important}
/* "Full history on [LinkedIn logo]": the word stays for screen readers, the logo shows instead */
.bsky-li-mark{display:inline-block;width:1.05em;height:1.05em;vertical-align:-0.15em;margin:0 .1em;overflow:hidden;text-indent:200%;white-space:nowrap;border-radius:3px;background:#0A66C2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M6.9 9.4H4.2V19h2.7V9.4zM5.6 8.1a1.55 1.55 0 1 0 0-3.1 1.55 1.55 0 0 0 0 3.1zM19.8 19h-2.7v-4.7c0-1.3-.5-2.1-1.6-2.1-1.2 0-1.8.8-1.8 2.1V19H11V9.4h2.6v1.2s.8-1.4 2.7-1.4c1.9 0 3.5 1.2 3.5 3.6V19z'/%3E%3C/svg%3E") center/80% no-repeat}
/* "Connect with me" + icons as one outline pill */
.bsky-about-connect{display:inline-flex!important;width:auto!important;max-width:max-content;padding:6px 8px 6px 16px;border:1px solid var(--wp--preset--color--border-light);border-radius:999px;transition:border-color .2s}
.bsky-about-connect:hover{border-color:var(--wp--preset--color--primary)}
.bsky-about-connect .bsky-about-social{padding-left:12px!important;border-left:1px solid var(--wp--preset--color--border-light)}
.bsky-about-intro > .wp-block-columns + *{margin-top:40px!important}
/* About: more room above section headings (interactive page, not a blog post) */
.bsky-about .bsky-wwm-main h2#experience,.bsky-about .bsky-wwm-main h2#working-remotely,.bsky-about .bsky-wwm-main h2#testimonials{margin-top:72px!important}
/* Hero chat bubbles: text is left-aligned in every bubble, like iMessage (only the bubbles sit left or right) */
.bsky-msg-them{text-align:left!important}
.bsky-msg-me{text-align:left!important}