/*
Theme Name: MAGDUM
Theme URI: http://magdum.art
Description: Bespoke black & white portfolio theme for Someone Creative. Mobile-first. (Standalone — no parent.)
Author: MAGDUM
Version: 0.9.101-magdum-white
Requires at least: 6.7
Tested up to: 7.0
Text Domain: someone
*/

@font-face {
  font-family: "Mango Grotesque";
  src: url("assets/fonts/mango-grotesque-bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ---- Wordmark ---- */
.someone-wordmark a,
.someone-wordmark .wp-block-site-title { letter-spacing: .22em; font-weight: 500; text-decoration: none; text-transform: uppercase; }
.someone-site-logo { line-height: 0; }
.someone-site-logo a { display: inline-flex; align-items: center; }
.someone-site-logo-img { display: block; width: auto; height: clamp(24px, 3.1vw, 38px); max-width: min(34vw, 128px); object-fit: contain; }

/* ---- Header bar ---- */
/* Keep logo-left / nav-right on EVERY template. Block templates get this from
   WP's auto-generated per-instance flex rule, but the custom PHP templates
   (portfolio/authors/locations) render the header after wp_head() prints those
   rules, so we set the flex layout explicitly here for consistency everywhere. */
.someone-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1.5rem; }

/* ---- Top navigation ---- */
.someone-nav { display: flex; align-items: center; justify-content: flex-end; flex-wrap: nowrap; gap: clamp(1rem, 2.2vw, 1.5rem); }
.someone-nav a { display: inline-flex; align-items: center; text-decoration: none; letter-spacing: .08em; font-size: .8rem; line-height: 1; text-transform: uppercase; color: inherit; opacity: .65; transition: opacity .2s ease; }
.someone-nav a:hover { opacity: 1; }

/* ---- Footer: contact buttons (Email + WeChat) + QR popup (CSS-only toggle) ---- */
.sw-wechat { display: inline-flex; }
/* shared button base so Email + WeChat match in size/shape */
.sw-cbtn { display: inline-flex; align-items: center; justify-content: center; gap: .45em; min-width: 5.75rem; padding: .5rem .7rem; border-radius: 6px; border: 1px solid transparent; font-size: .8rem; letter-spacing: .04em; line-height: 1; text-decoration: none; cursor: pointer; -webkit-user-select: none; user-select: none; transition: background-color .2s ease, border-color .2s ease, color .2s ease; }
.sw-cbtn svg { width: 1.2em; height: 1.2em; fill: currentColor; }
.sw-cbtn-email { color: #050505; border-color: rgba(5, 5, 5, .36); background: transparent; }
.sw-cbtn-email:hover { background: rgba(5, 5, 5, .06); border-color: rgba(5, 5, 5, .7); }
.sw-cbtn-wechat { color: #050505; background: transparent; border-color: rgba(5, 5, 5, .36); }
.sw-cbtn-wechat:hover { background: rgba(5, 5, 5, .06); border-color: rgba(5, 5, 5, .7); }
/* WeChat checkbox visually hidden but still focusable (Tab to it, Space opens popup) */
.sw-wechat-cb { position: absolute; width: 1px; height: 1px; opacity: 0; margin: 0; pointer-events: none; }
.sw-cbtn-email:focus-visible,
.sw-wechat-cb:focus-visible ~ .sw-cbtn-wechat { outline: 2px solid #050505; outline-offset: 2px; }
.sw-wechat-modal { display: none; position: fixed; inset: 0; z-index: 10000; align-items: center; justify-content: center; padding: 1.5rem; background: rgba(0, 0, 0, .72); cursor: zoom-out; }
.sw-wechat-cb:checked ~ .sw-wechat-modal { display: flex; }
.sw-wechat-modal img { display: block; width: auto; height: auto; max-width: min(84vw, 340px); max-height: 82vh; border-radius: 10px; background: #fff; }

/* ---- Hero ---- */
.someone-hero { overflow: hidden; }
.someone-hero .wp-block-heading { letter-spacing: .2em; }
.someone-hero > .wp-block-cover__inner-container { padding-inline: clamp(1.25rem, 4vw, 4rem); }
/* Keep these single lines on ONE line at any width — scale the font down to fit, never wrap. */
.someone-hero-sub { white-space: nowrap; font-size: clamp(.72rem, 3.4vw, 1.2rem); }
/* Cities line: never wrap (iOS) — shrink the font to fit; letter-spacing is em-based so it scales too. */
.someone-hero .someone-hero-cities { white-space: nowrap; font-size: clamp(.5rem, 2.5vw, var(--wp--preset--font-size--small, .8rem)); }
.someone-copyright { white-space: nowrap; font-size: clamp(.6rem, 2.85vw, .8rem); }
/* ICP 备案 (粤ICP备2026083396号) — required footer link to beian.miit.gov.cn */
.someone-beian { white-space: nowrap; font-size: clamp(.58rem, 2.6vw, .76rem); letter-spacing: .02em; }
.someone-beian a { color: inherit; text-decoration: none; opacity: .82; transition: opacity .2s ease, color .2s ease; }
.someone-beian a:hover { color: #050505; opacity: 1; }
.someone-gongan { display: inline-flex; align-items: center; gap: .25rem; }
.someone-gongan img { display: inline-block; width: 1em; height: 1em; object-fit: contain; flex: 0 0 auto; }

/* Links on dark sections inherit the light text colour */
.has-noir-background-color a, .someone-hero a { color: inherit; }\n.has-noir-background-color { background-color: #fff !important; color: #050505 !important; }

/* ---- Logo (site-logo block) ---- */
/* Header: black logo on white bar */
.someone-logo { margin: 0; }
.someone-logo img { display: block; height: auto; }
/* Hero: same logo inverted to white on the black hero, responsive */
.someone-hero .hero-logo { text-align: center; margin: 0 auto; }
.someone-hero .hero-logo img { filter: invert(1); width: min(82vw, 600px); height: auto; max-width: 100%; display: inline-block; margin: 0 auto; }
@media (max-width: 600px) {
  .someone-logo img { width: 140px; }
}

/* ---- Work grid: responsive, cover-fit thumbs, subtle zoom + label reveal ---- */
.work-grid .wp-block-post-template { gap: clamp(8px, 1.5vw, 14px); }
.work-grid .wp-block-post-featured-image { overflow: hidden; background: #1c1c1c; margin: 0; }
.work-grid .wp-block-post-featured-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; display: block; }
.work-grid li:hover .wp-block-post-featured-image img { transform: scale(1.045); }
.work-grid .wp-block-post-title { margin-top: .5rem; letter-spacing: .04em; font-weight: 400; }
.work-grid .wp-block-post-title a { text-decoration: none; }
.work-grid .wp-block-post-title a:hover { opacity: .55; }

/* ---- Single work ---- */
.single-work .wp-block-post-featured-image { margin-bottom: 1.25rem; }
.single-work .wp-block-post-featured-image img { width: 100%; height: auto; display: block; }
.single-work .wp-block-image { margin-bottom: 12px; }
.single-work .wp-block-image img { width: 100%; height: auto; }

/* ---- Mobile polish (phone viewing is the majority) ---- */
@media (max-width: 600px) {
  .someone-header {
    flex-wrap: nowrap;
    gap: .85rem;
  }
  .someone-logo img { width: 132px; }
  .someone-nav {
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-end;
  }
  .someone-nav .wp-block-navigation__container {
    flex-wrap: nowrap;
    gap: .72rem !important;
  }
  .someone-nav a {
    font-size: .68rem;
    letter-spacing: .06em;
    white-space: nowrap;
  }
  .someone-wordmark a, .someone-wordmark .wp-block-site-title { letter-spacing: .16em; }
  .someone-hero .wp-block-heading { letter-spacing: .12em; }
  .work-grid .wp-block-post-title { margin-top: .4rem; }
}

/* ---- Hero logo effect: random colour-block halo behind the logo ---- */
/* assets/hero-fx.js injects a <canvas> behind the crisp logo; only the soft
   colour bleeding past the letter edges shows (a halo, never over the text). */
.someone-hero .hero-logo { position: relative; }
.someone-hero .hero-logo.hero-fx-on .custom-logo-link,
.someone-hero .hero-logo.hero-fx-on img.custom-logo { position: relative; z-index: 1; }
.someone-hero .hero-logo .hero-fx-canvas { position: absolute; z-index: 0; pointer-events: none; mix-blend-mode: screen; transform-origin: center center; will-change: transform; }

/* ---- Front-page "boom" hero (assets/boom.js): pinned stage; covers fly out of the
   depth, weave past the camera and exit; the logo fades then re-emerges. ---- */
.someone-boom-top { position: absolute; top: 0; left: 0; right: 0; z-index: 40; }   /* header floats over the stage */
.someone-boom .someone-header { border-bottom: 0 !important; }
.boom { position: relative; height: 440vh; background: #07070a; }
.boom__stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden;
  background: radial-gradient(85% 55% at 50% 50%, #14141a 0%, #0a0a0d 54%, #07070a 100%); }   /* glow centred on the logo; top (menu) stays dark */
.boom__halo { position: absolute; pointer-events: none; mix-blend-mode: screen; transform-origin: 50% 50%; will-change: transform; z-index: 1; }
.boom__scene { position: absolute; inset: 0; z-index: 2; perspective: 1400px; perspective-origin: 50% 46%; }   /* perspective here, NOT on the overflow:hidden stage — WebKit/iOS flattens 3D otherwise */
.boom__grid { position: absolute; inset: 0; transform-style: preserve-3d; }
.boom__cell { position: absolute; left: 50%; top: 50%; width: clamp(180px, 26vw, 360px); aspect-ratio: 3 / 2;
  transform-style: preserve-3d; will-change: transform, opacity; transform: translate(-50%, -50%); opacity: 0; }
.boom__cell img { width: 100%; height: 100%; object-fit: cover; border-radius: 9px; display: block; box-shadow: 0 16px 50px rgba(0, 0, 0, .55); }
.boom__head { position: absolute; left: 0; right: 0; top: 46%; transform: translateY(-50%); z-index: 10;
  display: flex; flex-direction: column; align-items: center; text-align: center; pointer-events: none; }
.boom__logo { width: min(82vw, 600px); height: auto; display: block; filter: invert(1) drop-shadow(0 0 30px rgba(120, 110, 255, .42)); will-change: opacity; }
.boom__sub { margin: 18px 0 0; letter-spacing: .1em; font-size: clamp(.8rem, 2.4vw, 1.15rem); color: #efeff2; }
.boom__cities { margin: 12px 0 0; letter-spacing: .22em; white-space: nowrap; font-size: clamp(.5rem, 2vw, .8rem); color: #9a9aa6; }
.boom__hint { position: absolute; left: 0; right: 0; bottom: 28px; text-align: center; z-index: 11; font-size: 11px; letter-spacing: .3em; color: #7a7a86; will-change: opacity; }
@media (prefers-reduced-motion: reduce) { .boom { height: 100vh; } }

/* ---- Front page: editorial production-house layout ---- */
body.someone-home {
  background: #f6f5f1;
  color: #050505;
  --wp--preset--color--line: rgba(0, 0, 0, .12);
}
body.someone-home .someone-logo img { filter: none; }
body.someone-home .someone-nav a { color: #050505; opacity: .78; }
body.someone-home .someone-nav a:hover { opacity: 1; }
.someone-home-top .someone-header {
  border-bottom: 0 !important;
  padding-top: 2rem !important;
  padding-bottom: 1rem !important;
}
.home-ed {
  min-height: 100vh;
  overflow: hidden;
  background: #f6f5f1;
}
.home-ed-hero {
  position: relative;
  padding: 1rem 2rem 5rem;
}
.home-ed-copy {
  position: relative;
  z-index: 2;
  max-width: 46rem;
}
.home-ed-title {
  margin: 0;
  color: #020202;
  font-family: Impact, Haettenschweiler, "Arial Narrow Bold", "Arial Black", sans-serif;
  font-size: 12rem;
  font-weight: 900;
  line-height: .78;
  letter-spacing: 0;
  text-transform: none;
}
.home-ed-title span {
  display: block;
}
.home-ed-intro {
  width: min(100%, 34rem);
  margin: 2rem 0 0;
  font-size: 1.25rem;
  line-height: 1.05;
  font-weight: 800;
  text-transform: uppercase;
}
.home-ed-meta {
  margin: 1rem 0 0;
  font-size: .95rem;
  line-height: 1.1;
  font-weight: 800;
  text-transform: uppercase;
}
.home-ed-board {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-auto-rows: 4.5rem;
  gap: 0;
  min-height: 54rem;
  margin-top: -5rem;
  z-index: 1;
}
.home-ed-card {
  position: relative;
  display: block;
  overflow: hidden;
  background: #dedbd2;
  color: inherit;
  text-decoration: none;
}
.home-ed-card img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .7s ease;
}
.home-ed-card:hover img {
  transform: scale(1.025);
}
.home-ed-label {
  position: absolute;
  left: .75rem;
  top: .7rem;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  max-width: calc(100% - 1.5rem);
  color: #050505;
  background: rgba(246, 245, 241, .74);
  padding: .35rem .5rem;
  font-size: .72rem;
  line-height: 1;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(-.25rem);
  transition: opacity .2s ease, transform .2s ease;
}
.home-ed-label i {
  width: .38rem;
  height: .38rem;
  border-radius: 50%;
  background: currentColor;
  flex: 0 0 auto;
}
.home-ed-card:hover .home-ed-label,
.home-ed-card:focus-visible .home-ed-label {
  opacity: 1;
  transform: translateY(0);
}
.home-ed-card-1 { grid-column: 7 / 12; grid-row: 3 / 11; }
.home-ed-card-2 { grid-column: 4 / 7; grid-row: 7 / 14; }
.home-ed-card-3 { grid-column: 1 / 4; grid-row: 10 / 16; }
.home-ed-card-4 { grid-column: 11 / 13; grid-row: 1 / 9; }
.home-ed-card-5 { grid-column: 6 / 9; grid-row: 13 / 19; }
.home-ed-card-6 { grid-column: 9 / 12; grid-row: 12 / 18; }
.home-ed-card-7 { grid-column: 2 / 5; grid-row: 17 / 23; }
.home-ed-card-8 { grid-column: 5 / 8; grid-row: 21 / 27; }
.home-ed-card-9 { grid-column: 8 / 11; grid-row: 20 / 26; }
.home-ed-card-10 { grid-column: 11 / 13; grid-row: 18 / 25; }
.home-ed-footer-link {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 2rem;
  padding: 0 2rem 5rem;
}
.home-ed-footer-link a {
  color: inherit;
  font-size: .82rem;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  opacity: .72;
}
.home-ed-footer-link a:hover {
  opacity: 1;
}
@media (min-width: 1500px) {
  .home-ed-title { font-size: 14rem; }
  .home-ed-board { grid-auto-rows: 5rem; min-height: 60rem; }
}
@media (max-width: 1100px) {
  .home-ed-title { font-size: 8rem; }
  .home-ed-board { margin-top: 1rem; grid-auto-rows: 4rem; min-height: 44rem; }
}
@media (max-width: 760px) {
  .someone-home-top .someone-header {
    padding-top: 1.5rem !important;
    padding-bottom: .5rem !important;
  }
  .home-ed-hero { padding: 1.5rem 1rem 3rem; }
  .home-ed-title { font-size: 4.35rem; line-height: .82; }
  .home-ed-intro { margin-top: 1.25rem; font-size: 1rem; line-height: 1.08; }
  .home-ed-meta { font-size: .78rem; }
  .home-ed-board {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 0;
    margin-top: 2.25rem;
  }
  .home-ed-card {
    width: 100%;
    aspect-ratio: 4 / 5;
  }
  .home-ed-card:nth-child(2n) {
    width: 76%;
    align-self: flex-end;
  }
  .home-ed-card:nth-child(3n) {
    width: 82%;
    align-self: flex-start;
  }
  .home-ed-label {
    opacity: 1;
    transform: none;
    font-size: .68rem;
  }
  .home-ed-footer-link { padding: 0 1rem 3rem; }
}
@media (max-width: 390px) {
  .home-ed-title { font-size: 3.85rem; }
}

/* ============================================================
   About page (page-id-7): DARK theme — black background, white
   text, and each core member rendered as its own card.
   Page-chrome rules are scoped to body.page-id-7 so the rest of
   the site keeps its light/paper look; the .about/.oc/.cm classes
   only ever appear on this page, so they're styled directly.
   ============================================================ */

/* Paint the whole page dark. The footer is already noir, so we only
   flip the body bg/text and re-tint the header: invert the black
   wordmark to white and soften the divider line (the header's
   border uses var(--wp--preset--color--line), which we redefine
   here so no !important is needed). */
body.page-id-7, body.someone-dark { background-color: #0a0a0a; color: #fff; --wp--preset--color--line: rgba(255, 255, 255, .14); }
body.page-id-7 .someone-logo img, body.someone-dark .someone-logo img { filter: invert(1); }   /* black header wordmark -> white */
body.page-id-7 .someone-nav a, body.someone-dark .someone-nav a { color: #fff; }                /* nav links read on the dark bar */
body.page-id-7 a, body.someone-dark a { color: inherit; }   /* content links (work titles, contact email) read on the dark bg */

/* ---- About page: brand wordmark above the intro text (inverted to white on black) ---- */
.about-intro { width: min(100%, 820px); margin: 0 auto; }
.about-brand { display: block; width: min(70vw, 320px); height: auto; margin: 0 0 clamp(1.25rem, 3vw, 2rem); filter: none; }
.about-intro-copy { color: #fff; font-size: clamp(1rem, 1.7vw, 1.15rem); line-height: 1.75; }
.about-intro-copy p { margin: 0 0 1.45em; }
.about-intro-copy p:last-child { margin-bottom: 0; }
.about-info { width: min(100%, 820px); margin: clamp(2.5rem, 7vw, 5rem) auto 0; text-align: center; }
.about-info-copy { color: #fff; font-size: clamp(1rem, 1.7vw, 1.15rem); line-height: 1.8; }
.about-info-copy p { margin: 0 0 1.25em; }
.about-info-copy p:last-child { margin-bottom: 0; }

/* ---- Our Client logo wall — white cards keep the (often dark/coloured) logos legible on the dark page ---- */
.our-client { margin-top: clamp(2.5rem, 7vw, 5rem); }
.oc-head { text-align: center; margin: 0 auto clamp(1.75rem, 4vw, 2.75rem); }
.oc-head .oc-en { display: block; font-size: clamp(1.4rem, 4vw, 2rem); letter-spacing: .04em; color: #fff; }
.oc-head .oc-zh { display: none; } /* Chinese label + its top-border bar removed; English ("Our Client") only */
.oc-grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(8px, 1.4vw, 14px); }
/* The cell reserves a 3:2 box via aspect-ratio; the logo fills it absolutely.
   Safari does NOT resolve a child's percentage height against an aspect-ratio
   box (it collapses to `auto`), which lets logos overflow and scramble the
   grid. Absolute fill avoids that. */
.oc-cell { position: relative; aspect-ratio: 3 / 2; border: 1px solid rgba(255, 255, 255, .08); border-radius: 12px; background: #151515; transition: border-color .2s ease; }
.oc-cell:hover { border-color: rgba(255, 255, 255, .22); }
/* Logos are colour-on-transparent; default shows them white (filter), hover reveals the real colours. */
.oc-cell img { position: absolute; inset: 0; width: 100%; height: 100%; padding: clamp(9px, 1.8vw, 18px); box-sizing: border-box; object-fit: contain; display: block; filter: brightness(0) invert(1); transition: filter .35s ease, transform .3s ease; }
.oc-cell:hover img { filter: none; transform: scale(1.05); }
/* Mobile: 3 cols, and size the logo to the cell (box-relative padding) so it isn't oversized. */
@media (max-width: 700px) { .oc-grid { grid-template-columns: repeat(3, 1fr); } .oc-cell img { padding: 20%; } }

/* ---- Core members — each member is its own elevated dark card (photo + name/role + bio) ---- */
.core-members { margin-top: clamp(2.5rem, 7vw, 5rem); }
.cm-head { text-align: center; margin: 0 auto clamp(2rem, 5vw, 3.25rem); }
.cm-head .cm-en { display: block; font-size: clamp(1.4rem, 4vw, 2rem); letter-spacing: .04em; color: #fff; }
.cm-head .cm-zh { display: none; } /* Chinese label + its top-border bar removed; English ("Core Member") only */
.cm-list { list-style: none; margin: 0; padding: 0; display: grid; gap: clamp(1rem, 2.5vw, 1.5rem); }
/* The card: photo + name/role + bio grouped in one slightly-elevated dark panel. */
.cm-item { display: flex; flex-direction: column; gap: 1rem; background: #151515; border: 1px solid rgba(255, 255, 255, .08); border-radius: 14px; padding: clamp(1.25rem, 3.5vw, 2rem); transition: border-color .2s ease, background-color .2s ease; }
.cm-item:hover { border-color: rgba(255, 255, 255, .2); background: #181818; }
.cm-photo { position: relative; width: clamp(128px, 38vw, 168px); aspect-ratio: 1; overflow: hidden; border-radius: 8px; background: #242424; flex: none; }
/* Absolute fill: same Safari aspect-ratio caveat as .oc-cell above. */
.cm-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(1); }
.cm-text { min-width: 0; }
.cm-name { margin: 0; font-size: clamp(1.05rem, 4vw, 1.4rem); font-weight: 500; letter-spacing: .01em; color: #fff; display: flex; flex-wrap: nowrap; align-items: baseline; gap: .2rem .6rem; white-space: nowrap; }
.cm-role { font-size: .68em; font-weight: 400; letter-spacing: .06em; color: #9a9a9a; white-space: nowrap; }
.cm-bio { margin: .7rem 0 0; color: #c4c4c4; font-size: .92rem; line-height: 1.85; text-align: justify; text-justify: inter-ideograph; }
@media (min-width: 700px) {
  .cm-item { flex-direction: row; align-items: flex-start; gap: clamp(1.5rem, 3.5vw, 2.75rem); }
  .cm-text { flex: 1; padding-top: .25rem; }
}
/* Mobile: centre the avatar and the name+role; bio text stays left-aligned. */
@media (max-width: 699px) {
  .cm-photo { align-self: center; }
  .cm-name { justify-content: center; text-align: center; }
}

/* ============================================================
   Gallery pages (作者 /authors/ + 地点 /locations/): dark theme
   (shared via body.someone-dark), a picker (author cards / map
   pins) then a masonry works area with click-to-zoom lightbox.
   Image layout is built by assets/gallery.js (shortest-column
   masonry); imgs use native loading=lazy + aspect-ratio.
   ============================================================ */
.sg-main { max-width: 1400px; margin-inline: auto; margin-top: var(--wp--preset--spacing--60, 2.5rem); padding: clamp(2rem, 5vw, 3.25rem) clamp(1.25rem, 4vw, 4rem) clamp(3rem, 8vw, 6rem); }
/* Portfolio leads with the filter bar (no page title), so tighten the top gap. */
.sg-portfolio { margin-top: clamp(1.25rem, 4vw, 2rem); padding-top: 0; }
.sg-head { text-align: center; margin: 0 auto clamp(2rem, 5vw, 3.25rem); }
.sg-en { display: block; margin: 0; font-weight: 400; font-size: clamp(1.4rem, 4vw, 2rem); letter-spacing: .04em; color: #9a9a9a; }
.sg-kicker { display: block; margin-bottom: .5rem; font-size: .85rem; letter-spacing: .18em; text-transform: uppercase; color: #9a9a9a; }   /* term-archive label above the term name */

/* Author cards — simplified: avatar + name + role; click to select */
/* Single swipeable row: avoids the crowding + uneven wrapping when authors are
   many. Centres when the cards fit (auto margins on the ends), scrolls when not. */
.sg-authors { display: flex; flex-wrap: nowrap; gap: clamp(.6rem, 1.5vw, 1rem); overflow-x: auto; overflow-y: hidden; -webkit-overflow-scrolling: touch; padding: 4px 2px 14px; cursor: grab; user-select: none; scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .25) transparent; }
.sg-authors.is-dragging { cursor: grabbing; }
.sg-authors > .sg-card:first-child { margin-left: auto; }
.sg-authors > .sg-card:last-child { margin-right: auto; }
.sg-authors::-webkit-scrollbar { height: 6px; }
.sg-authors::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .22); border-radius: 999px; }
.sg-authors::-webkit-scrollbar-track { background: transparent; }
.sg-card { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; gap: .5rem; width: clamp(80px, 16vw, 108px); padding: .7rem .55rem .8rem; background: #151515; border: 1px solid rgba(255, 255, 255, .08); border-radius: 12px; color: inherit; font: inherit; cursor: pointer; transition: border-color .2s ease, background-color .2s ease; }
.sg-card:hover { border-color: rgba(255, 255, 255, .25); background: #181818; }
.sg-card.is-active { border-color: #fff; background: #1c1c1c; }
.sg-ava { width: clamp(54px, 13vw, 78px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; background: #242424; }
.sg-ava img { width: 100%; height: 100%; object-fit: cover; display: block; filter: grayscale(1); transition: filter .2s ease; }
.sg-card:hover .sg-ava img, .sg-card.is-active .sg-ava img { filter: none; }
.sg-name { font-size: .88rem; font-weight: 500; color: #fff; }

/* Location map placeholder banner — pins are the registered 地点 terms */
/* Worldwide hero — full-width dotted-map background with the heading + tags on top */
.sg-hero { position: relative; overflow: hidden; min-height: clamp(380px, 38vw, 560px); display: flex; align-items: center; justify-content: center; padding: clamp(2rem, 5vw, 4rem) clamp(1.25rem, 4vw, 4rem); }
.sg-hero-inner { position: relative; z-index: 2; display: flex; flex-direction: column; align-items: center; gap: clamp(1.4rem, 3.5vw, 2.25rem); text-align: center; }
.sg-worldmap { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; pointer-events: none; opacity: 1; filter: blur(1.8px); }
.sg-worldmap-fx { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; pointer-events: none; }
@media (max-width: 700px) { .sg-hero { min-height: clamp(190px, 48vw, 300px); padding: 1.5rem 1.25rem; } }
.sg-map-pins { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: .6rem; justify-content: center; }
.sg-pin { padding: .42rem 1.05rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .3); background: rgba(255, 255, 255, .06); color: #fff; font: inherit; font-size: .9rem; cursor: pointer; transition: background-color .2s ease, border-color .2s ease, color .2s ease; }
.sg-pin:hover { background: rgba(255, 255, 255, .14); }
.sg-pin.is-active { background: #fff; color: #0a0a0a; border-color: #fff; }
.sg-map-empty { position: relative; color: #9a9a9a; font-size: .9rem; }

/* Portfolio filters — two separate groups (类别 + 品牌), side by side (wrap to stack
   on mobile); each single-select with a 全部; the groups combine (AND). */
.sg-filters { display: flex; flex-direction: column; justify-content: center; align-items: stretch; gap: clamp(1rem, 3vw, 1.8rem); margin-bottom: clamp(1.75rem, 4vw, 2.75rem); }
.sg-category-stack { display: flex; flex-direction: column; gap: clamp(.85rem, 2.5vw, 1.35rem); min-width: 0; }
.sg-fgroup { display: flex; flex-direction: column; align-items: center; gap: .65rem; min-width: 0; }
.sg-flabel { font-size: .72rem; letter-spacing: .2em; text-transform: uppercase; color: #8a8a8a; }
.sg-fpills { display: flex; flex-wrap: nowrap; justify-content: center; justify-content: safe center; align-self: stretch; gap: .5rem; max-width: 100%; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.sg-fpills::-webkit-scrollbar { display: none; }
.sg-pill { flex: 0 0 auto; white-space: nowrap; padding: .42rem 1.1rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .25); background: transparent; color: #cfcfcf; font: inherit; font-size: .85rem; letter-spacing: .04em; line-height: 1.25; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background-color .2s ease, color .2s ease, border-color .2s ease; }
.sg-pill:hover { border-color: #fff; color: #fff; }
.sg-pill.is-active { background: #fff; color: #0a0a0a; border-color: #fff; }
.sg-pill:focus { outline: none; }
.sg-pill:focus-visible { outline: 2px solid rgba(255, 255, 255, .55); outline-offset: 2px; }
/* Phones: each group spans full width so its pill row scrolls horizontally; pills stay
   centered when they fit and scroll (start-aligned) when there are too many. */
@media (max-width: 600px) {
  .sg-fgroup { width: 100%; }
  .sg-fpills { gap: .4rem; }
  .sg-pill { padding: .36rem .75rem; font-size: .8rem; letter-spacing: .02em; }
}

/* Works masonry (columns + items built by JS) */
.sg-works { display: flex; align-items: flex-start; gap: clamp(12px, 2vw, 24px); margin-top: clamp(2.25rem, 5vw, 3.5rem); }
.sg-load-sentinel { height: 1px; }
.sg-load-sentinel[hidden] { display: none; }
.sg-col { flex: 1 1 0; min-width: 0; display: flex; flex-direction: column; gap: clamp(12px, 2vw, 24px); }
.sg-fig { margin: 0; overflow: hidden; border-radius: 6px; background: #161616; cursor: zoom-in; }
.sg-fig img, .sg-fig video { width: 100%; height: auto; display: block; }
/* Video tiles in the masonry: first-frame poster + centred play badge (badge is click-through). */
.sg-fig.sg-video { position: relative; }
.sg-play { position: absolute; inset: 0; margin: auto; width: clamp(44px, 14%, 62px); aspect-ratio: 1; border-radius: 50%; background: rgba(0, 0, 0, .45); display: flex; align-items: center; justify-content: center; pointer-events: none; transition: background-color .2s ease; }
.sg-fig.sg-video:hover .sg-play { background: rgba(0, 0, 0, .62); }
.sg-play::before { content: ""; width: 0; height: 0; border-style: solid; border-width: 9px 0 9px 15px; border-color: transparent transparent transparent #fff; margin-left: 4px; }
.sg-empty { text-align: center; color: #8a8a8a; font-size: .95rem; margin: clamp(2.5rem, 6vw, 4rem) 0; }

/* Portfolio covers: each masonry item links to its work (no lightbox); title on hover */
.sg-fig.sg-link { position: relative; display: block; cursor: pointer; }
.sg-fig.sg-link img { transition: transform .5s ease; }
.sg-fig.sg-link:hover img { transform: scale(1.04); }
.sg-cap { position: absolute; inset: 0; display: flex; align-items: flex-end; justify-content: center; text-align: center; padding: 1.1rem 1rem 1rem; font-size: .9rem; letter-spacing: .03em; color: #fff; background: linear-gradient(to top, rgba(0, 0, 0, .7), rgba(0, 0, 0, 0) 55%); text-shadow: 0 1px 4px rgba(0, 0, 0, .55); pointer-events: none; }
/* No focus-ring / tap-highlight "box" on covers & pickers when tapped on touch
   (mobile browsers draw one on tap); keyboard users still get a ring via :focus-visible. */
.sg-fig, .sg-card, .sg-pin { -webkit-tap-highlight-color: transparent; }
.sg-fig.sg-link:focus, .sg-card:focus, .sg-pin:focus { outline: none; }
.sg-fig.sg-link:focus-visible, .sg-card:focus-visible, .sg-pin:focus-visible { outline: 2px solid rgba(255, 255, 255, .55); outline-offset: 2px; }

/* Lightbox (click image to zoom; click anywhere / Esc to close) */
.sg-lightbox { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: clamp(1rem, 3vw, 2.5rem); background: rgba(0, 0, 0, .93); cursor: zoom-out; }
.sg-lightbox[hidden] { display: none; }
.sg-lightbox img:not([hidden]), .sg-lightbox video:not([hidden]) { max-width: 100%; max-height: 100%; width: auto; height: auto; display: block; }
.sg-lb-close { position: absolute; top: clamp(.5rem, 2vw, 1.25rem); right: clamp(.5rem, 2vw, 1.25rem); width: 42px; height: 42px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .3); background: rgba(0, 0, 0, .4); color: #fff; font-size: 24px; line-height: 1; cursor: pointer; }
.sg-lb-nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; padding-bottom: 3px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .3); background: rgba(0, 0, 0, .4); color: #fff; font-size: 30px; line-height: 1; cursor: pointer; -webkit-tap-highlight-color: transparent; transition: background-color .2s ease; }
.sg-lb-nav:hover { background: rgba(0, 0, 0, .75); }
.sg-lb-nav[hidden] { display: none; }
.sg-lb-prev { left: clamp(.4rem, 3vw, 1.5rem); }
.sg-lb-next { right: clamp(.4rem, 3vw, 1.5rem); }
/* Don't let touch gestures on the lightbox pan/scroll the page behind it. */
.sg-lightbox, .sg-lightbox img, .sg-lb-nav, .sg-lb-close { touch-action: none; }
/* Touch devices navigate by swiping — hide the arrows so they don't cover the photo. */
@media (hover: none) { .sg-lb-nav { display: none; } }

/* Single work detail (作品详情): kept title + tag chips, then the work's images as masonry */
.sw-head { text-align: center; margin: 0 auto clamp(1.75rem, 4vw, 2.75rem); }
.sw-title { margin: 0; color: #fff; font-weight: 500; font-size: clamp(1.5rem, 4.5vw, 2.4rem); letter-spacing: .02em; }
.sw-tags { display: flex; flex-wrap: wrap; justify-content: center; gap: .5rem; margin-top: clamp(.9rem, 2.5vw, 1.4rem); }
.sw-tags .sw-tag { padding: .3rem .85rem; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .22); color: #cfcfcf; font-size: .8rem; letter-spacing: .04em; text-decoration: none; transition: color .2s ease, border-color .2s ease, background-color .2s ease; }
.sw-tags .sw-tag:hover { color: #fff; border-color: rgba(255, 255, 255, .55); background-color: rgba(255, 255, 255, .08); }
.sw-back { text-align: center; margin: clamp(2.5rem, 6vw, 4rem) 0 0; font-size: .9rem; }
.sw-back a { color: #9a9a9a; }
.sw-back a:hover { color: #fff; }

/* ---- Home final overrides: must stay after dark-page rules ---- */
body.someone-home {
  background: #f6f5f1 !important;
  color: #050505 !important;
  --wp--preset--color--line: rgba(0, 0, 0, .12);
}
body.someone-home .wp-site-blocks,
body.someone-home .home-ed {
  background: #f6f5f1 !important;
  color: #050505 !important;
}
body.someone-home .someone-logo img { filter: none !important; }
body.someone-home .someone-nav a { color: #050505 !important; }
body.someone-home .home-ed-title {
  margin: 0 !important;
  color: #020202 !important;
  font-family: Impact, Haettenschweiler, "Arial Narrow Bold", "Arial Black", sans-serif !important;
  font-size: 12rem !important;
  font-weight: 900 !important;
  line-height: .78 !important;
  letter-spacing: 0 !important;
  text-transform: uppercase !important;
}
body.someone-home .home-ed-title span { display: block !important; }
body.someone-home .home-ed-board {
  position: relative !important;
  display: grid !important;
  grid-template-columns: repeat(12, 1fr) !important;
  grid-auto-rows: 4.5rem !important;
  gap: 0 !important;
}
body.someone-home .home-ed-card {
  position: relative !important;
  display: block !important;
  overflow: hidden !important;
}
body.someone-home .home-ed-card img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}
@media (max-width: 1100px) {
  body.someone-home .home-ed-title { font-size: 8rem !important; }
}
@media (max-width: 760px) {
  body.someone-home .home-ed-title { font-size: 4.35rem !important; }
  body.someone-home .home-ed-board {
    display: flex !important;
    flex-direction: column !important;
    min-height: 0 !important;
  }
  body.someone-home .home-ed-card {
    width: 100% !important;
    aspect-ratio: 4 / 5 !important;
  }
}
@media (max-width: 390px) {
  body.someone-home .home-ed-title { font-size: 3.85rem !important; }
}

/* ---- Front page: lightweight horizontal drift ---- */
body.someone-home-drift {
  background: #050505;
  color: #fff;
  --wp--preset--color--line: rgba(255, 255, 255, .14);
}
body.someone-home-drift .wp-site-blocks,
body.someone-home-drift .home-drift {
  background: #050505;
  color: #fff;
}
body.someone-home-drift .someone-logo img { filter: none; }
body.someone-home-drift .someone-nav a { color: #050505; opacity: .72; }
body.someone-home-drift .someone-nav a:hover { opacity: 1; }
.home-drift-top {
  position: relative;
  z-index: 20;
}
.home-drift-top .someone-header {
  border-bottom: 0 !important;
  padding-top: 1.75rem !important;
  padding-bottom: 1rem !important;
}
.home-drift {
  min-height: 0;
  overflow: hidden;
}
.home-drift-hero {
  position: relative;
  box-sizing: border-box;
  min-height: 760px;
  height: calc(100svh - 90px);
  overflow: hidden;
  padding: 0 2rem;
  cursor: default;
  -webkit-user-select: none;
  user-select: none;
}
.home-drift-copy {
  position: relative;
  z-index: 1;
  width: 100%;
  padding-top: 1rem;
  pointer-events: none;
}
.home-drift-title {
  margin: 0;
  color: #fff;
  font-family: "Mango Grotesque", Impact, Haettenschweiler, "Arial Narrow Bold", "Arial Black", sans-serif;
  font-size: 12.8rem;
  font-weight: 700;
  line-height: .78;
  letter-spacing: 0;
  text-transform: uppercase;
}
.home-drift-title > span {
  display: block;
  overflow: visible;
}
.home-drift-title > span > span {
  display: inline-block;
  transform: translateY(110%);
  transition: transform .85s cubic-bezier(.22, 1, .36, 1);
  will-change: transform;
}
.home-drift-hero.is-ready .home-drift-title > span > span {
  transform: translateY(0);
}
.home-drift-intro,
.home-drift-meta,
.home-drift-links {
  opacity: 0;
  transform: translateY(12px);
  transition: opacity .7s ease, transform .7s ease;
}
.home-drift-hero.is-ready .home-drift-intro,
.home-drift-hero.is-ready .home-drift-meta,
.home-drift-hero.is-ready .home-drift-links {
  opacity: 1;
  transform: translateY(0);
}
.home-drift-intro {
  width: min(100%, 540px);
  margin: 1.5rem 0 0;
  font-size: 1.45rem;
  line-height: .98;
  font-weight: 850;
  text-transform: uppercase;
}
.home-drift-meta {
  margin: 1.25rem 0 0;
  font-size: clamp(.72rem, 1.1vw, .98rem);
  line-height: 1;
  font-weight: 500;
  letter-spacing: .22em;
  text-transform: none;
  transition-delay: .14s;
}
.home-drift-stream {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 2;
  height: 58%;
  min-height: 430px;
  overflow: visible;
}
.home-drift-track {
  position: relative;
  height: 100%;
  overflow: visible;
  touch-action: pan-y;
}
.home-drift-item {
  position: absolute;
  left: 0;
  bottom: 0;
  display: block;
  width: 30rem;
  height: 27.5rem;
  color: inherit;
  text-decoration: none;
  transform-origin: bottom left;
  scale: 0;
  will-change: transform, scale, opacity;
  -webkit-tap-highlight-color: transparent;
}
.home-drift-media {
  position: absolute;
  inset: 0;
  display: block;
  overflow: hidden;
  background: #111;
}
.home-drift-media img {
  width: 112%;
  height: 100%;
  display: block;
  object-fit: cover;
  transform: translate3d(var(--home-parallax-x, 0%), 0, 0);
  transition: transform .45s cubic-bezier(.22, 1, .36, 1);
  pointer-events: none;
  -webkit-user-drag: none;
}
.home-drift-caption {
  position: absolute;
  left: 0;
  top: -2.1rem;
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  max-width: min(18rem, 92vw);
  padding: 0;
  color: #fff;
  background: transparent;
  opacity: 0;
  translate: 0 100%;
  transform-origin: bottom left;
  transition: opacity .32s cubic-bezier(.22, 1, .36, 1), translate .32s cubic-bezier(.22, 1, .36, 1);
  pointer-events: none;
}
.home-drift-caption::before {
  content: "";
  width: .55rem;
  height: .55rem;
  border-radius: 50%;
  background: currentColor;
  flex: 0 0 auto;
}
.home-drift-caption b {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.home-drift-caption b {
  font-size: .75rem;
  line-height: 1;
  font-weight: 600;
  text-transform: uppercase;
}
.home-drift-caption small {
  display: none;
}
.home-drift-item:hover .home-drift-caption,
.home-drift-item:focus-visible .home-drift-caption {
  opacity: 1;
  translate: 0 0;
}
.home-drift-links {
  display: none;
}
.home-drift-links a {
  color: inherit;
  font-size: .78rem;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  opacity: .66;
  transition: opacity .2s ease;
}
.home-drift-links a:hover { opacity: 1; }
.home-drift-hero.is-dragging,
.home-drift-hero.is-dragging .home-drift-track { cursor: grabbing; }
body.someone-home-drift footer.wp-block-template-part,
body.someone-home-drift footer.wp-block-template-part > .wp-block-group {
  margin-top: 0 !important;
}
@media (min-width: 1500px) {
  .home-drift-title { font-size: 15rem; }
  .home-drift-item { width: 32rem; height: 29rem; }
}
@media (max-width: 1180px) {
  .home-drift-title { font-size: 10rem; }
  .home-drift-intro { font-size: 1.2rem; }
  .home-drift-item { width: 27rem; height: 24rem; }
}
@media (max-width: 767px) {
  body.someone-home-drift {
    --home-mobile-bottom-clearance: 0px;
  }
  .home-drift-top .someone-header {
    padding-top: 1.35rem !important;
    padding-bottom: .4rem !important;
  }
  .home-drift-hero {
    min-height: calc(var(--home-mobile-vh, 100dvh) - 76px + var(--home-mobile-bottom-clearance));
    height: calc(var(--home-mobile-vh, 100dvh) - 76px + var(--home-mobile-bottom-clearance));
    padding: 1.1rem 1rem 0;
    overflow: hidden;
  }
  .home-drift-copy {
    width: 100%;
    padding-top: 0;
    z-index: 4;
  }
  .home-drift-title {
    display: flex;
    flex-direction: column;
    gap: 0;
    font-size: clamp(7.1rem, 30vw, 8rem);
    line-height: .85;
  }
  .home-drift-intro {
    width: 100%;
    margin-top: 1.2rem;
    max-width: 22rem;
    font-size: .9rem;
    line-height: 1.08;
  }
  .home-drift-meta {
    margin-top: .65rem;
    font-size: .76rem;
  }
  .home-drift-stream {
    position: absolute;
    left: 0;
    right: 0;
    bottom: var(--home-mobile-bottom-clearance);
    height: auto;
    min-height: 0;
    margin: 0;
    overflow: hidden;
    --home-mobile-card-width: clamp(260px, 72vw, 320px);
  }
  .home-drift-track {
    display: flex;
    align-items: flex-end;
    gap: 1.25rem;
    height: auto;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 1.75rem 1.1rem 0;
    scroll-snap-type: none;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
  }
  .home-drift-track::-webkit-scrollbar { display: none; }
  .home-drift-item {
    position: relative;
    left: auto;
    bottom: auto;
    flex: 0 0 auto;
    width: var(--home-mobile-card-width);
    height: auto;
    aspect-ratio: auto;
    opacity: 1;
    transform: none;
    scale: 1;
    scroll-snap-align: none;
  }
  .home-drift-media {
    position: relative;
    inset: auto;
    top: auto;
    width: 100%;
    height: auto;
    margin-top: 1.75rem;
    overflow: visible;
  }
  .home-drift-media img {
    width: 100%;
    height: auto;
    max-width: none;
    object-fit: contain;
    transform: none;
  }
  .home-drift-item:hover .home-drift-media img {
    transform: none;
  }
  .home-drift-caption {
    left: 0;
    top: 0;
    bottom: auto;
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: .5rem;
    min-width: 0;
    max-width: min(70vw, 18rem);
    padding: 0;
    background: transparent;
    opacity: 1;
    translate: 0 0;
    scale: 1;
  }
  .home-drift-caption::before { display: block; width: .5rem; height: .5rem; }
  .home-drift-caption small {
    display: none;
  }
  .home-drift-links {
    display: none;
  }
  body.someone-home-drift footer.wp-block-template-part {
    display: none;
  }
}
@supports (-webkit-touch-callout: none) {
  @media (max-width: 767px) {
    body.someone-home-drift {
      --home-mobile-bottom-clearance: env(safe-area-inset-bottom, 0px);
    }
  }
}
@media (max-width: 390px) {
  .home-drift-title { font-size: 7rem; line-height: .85; }
}
@media (prefers-reduced-motion: reduce) {
  .home-drift-title > span > span,
  .home-drift-intro,
  .home-drift-meta,
  .home-drift-links {
    transition: none;
  }
}

@media (max-width: 600px) {
  .someone-nav { width: 100%; justify-content: flex-start; gap: .9rem; overflow-x: auto; padding-bottom: .1rem; }
}

/* ---- TOBE white theme ---- */
html,
body,
.wp-site-blocks,
.site,
main,
.home-drift,
.home-drift-hero,
body.someone-home-drift,
body.someone-home-drift .wp-site-blocks,
body.someone-home-drift .home-drift,
body.someone-dark,
body.page-id-7,
body.page-id-38 {
  background: #fff !important;
  background-color: #fff !important;
  color: #050505 !important;
  --wp--preset--color--line: #e6e4de !important;
}
body,
body a,
.someone-wordmark,
.someone-wordmark a,
.someone-nav,
.someone-nav a,
body.someone-home-drift .someone-nav a,
.home-drift-title,
.home-drift-meta,
.home-drift-intro,
.home-drift-links,
.home-drift-links a,
.about-intro-copy,
.about-info-copy,
.oc-head .oc-en,
.cm-head .cm-en,
.cm-name,
.sg-name,
.sw-title,
body.someone-dark a,
body.page-id-7 a,
.has-noir-background-color,
.has-noir-background-color a {
  color: #050505 !important;
}
.home-drift-title { text-shadow: none !important; }
.home-drift-top .someone-header,
.someone-header { border-bottom-color: #e6e4de !important; }
footer.wp-block-template-part,
footer.wp-block-template-part > .wp-block-group,
body.someone-home-drift footer.wp-block-template-part,
body.someone-home-drift footer.wp-block-template-part > .wp-block-group,
.has-noir-background-color,
.has-background.has-noir-background-color {
  background: #fff !important;
  background-color: #fff !important;
  color: #050505 !important;
}
.sw-cbtn,
.sw-cbtn-email,
.sw-cbtn-wechat {
  color: #050505 !important;
  background: transparent !important;
  border-color: rgba(5, 5, 5, .36) !important;
}
.sw-cbtn:hover,
.sw-cbtn-email:hover,
.sw-cbtn-wechat:hover {
  color: #050505 !important;
  background: rgba(5, 5, 5, .06) !important;
  border-color: rgba(5, 5, 5, .7) !important;
}
.sw-cbtn svg { fill: currentColor !important; }
.sw-cbtn-email:focus-visible,
.sw-wechat-cb:focus-visible ~ .sw-cbtn-wechat { outline-color: #050505 !important; }
.sg-main,
.sg-toolbar,
.sg-card,
.cm-item,
.oc-cell,
.sg-pill,
.sg-pin,
.home-drift-media {
  background-color: #fff !important;
  color: #050505 !important;
  border-color: rgba(5, 5, 5, .14) !important;
}
.sg-card:hover,
.cm-item:hover,
.sg-card.is-active {
  background-color: #f6f6f4 !important;
  border-color: rgba(5, 5, 5, .28) !important;
}
.sg-pill,
.sg-pin,
.sw-tags .sw-tag {
  color: #050505 !important;
  border-color: rgba(5, 5, 5, .24) !important;
}
.sg-pill:hover,
.sg-pin:hover,
.sw-tags .sw-tag:hover {
  color: #050505 !important;
  background-color: rgba(5, 5, 5, .06) !important;
  border-color: rgba(5, 5, 5, .42) !important;
}
.sg-pill.is-active,
.sg-pin.is-active {
  background: #050505 !important;
  color: #fff !important;
  border-color: #050505 !important;
}
.home-drift-caption { color: #050505 !important; }
.about-brand { filter: none !important; }
body.someone-about-page .cm-role { color: #666 !important; }
body.someone-about-page .cm-bio { color: #333 !important; }
body.someone-about-page .cm-photo { background: #f1f1ef !important; }
body.someone-about-page .cm-photo img { filter: none !important; }
body.someone-about-page .oc-cell img {
  filter: brightness(0) !important;
}
body.someone-about-page .oc-cell:hover img {
  filter: none !important;
}

/* ---- WordPress admin bar: keep default dark toolbar readable ---- */
#wpadminbar,
#wpadminbar a,
#wpadminbar .ab-item,
#wpadminbar .ab-label,
#wpadminbar .ab-icon,
#wpadminbar .ab-icon::before,
#wpadminbar .ab-icon::after,
#wpadminbar .ab-empty-item,
#wpadminbar .ab-sub-wrapper,
#wpadminbar .ab-submenu,
#wpadminbar .ab-submenu .ab-item {
  color: #f0f0f1 !important;
}
#wpadminbar .ab-sub-wrapper,
#wpadminbar .menupop .ab-sub-wrapper {
  background: #2c3338 !important;
}
#wpadminbar .ab-top-menu > li.hover > .ab-item,
#wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus,
#wpadminbar:not(.mobile) .ab-top-menu > li:hover > .ab-item,
#wpadminbar:not(.mobile) .ab-top-menu > li > .ab-item:focus,
#wpadminbar .quicklinks .menupop ul li a:hover,
#wpadminbar .quicklinks .menupop ul li a:focus {
  color: #72aee6 !important;
}