*{box-sizing:border-box}body,h1,h2,h3,p{margin:0}button,a{-webkit-tap-highlight-color:transparent}html,body{font-family:"Helvetica Neue Light","Helvetica Neue",Helvetica,Arial,"PingFang TC",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
html, body { width: 100%; height: 100%; overflow: hidden; background: #c5cbd0; color: #000; overflow-x: hidden; }

.bg-video {
  position: fixed; top: 0; left: 0;
  display: block;
  width: 100%; height: 100%;
  object-fit: cover;
  z-index: 0;
  opacity: 1;
  pointer-events: none;
}

.glass-defs { position: absolute; width: 0; height: 0; pointer-events: none; }

.hero {
  position: relative; z-index: 10;
  display: flex; flex-direction: column;
  width: 100%; height: 100vh; height: 100dvh;
  color: #000;
  pointer-events: none;   /* only interactive children opt back in */
}
.icon { flex: none; }

.rule { position: absolute; top: 0; bottom: 0; display: none; flex-direction: column; align-items: center; }
.rule--left  { left: 1.25rem; }
.rule--right { right: 1.25rem; }
.rule__seg { width: 1px; background: rgba(0, 0, 0, 0.2); }
.rule__seg--end { height: 15%; }
.rule__seg--mid { flex: 1 1 0%; }
.rule__plus { font-size: 0.75rem; line-height: 1; color: rgba(0, 0, 0, 0.4); padding: 0.25rem 0; }
@media (min-width: 768px) { .rule { display: flex; } }

.nav { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; padding: 1.25rem; }
.nav__item {
  display: inline-flex; align-items: center; gap: 0.625rem;
  color: #000; background: none; border: 0; font: inherit; text-decoration: none;
  cursor: pointer; pointer-events: auto; transition: opacity 300ms;
}
.nav__item:hover { opacity: 0.6; }
.nav__label { font-size: 0.875rem; line-height: 1.25rem; letter-spacing: 0.025em; }
.nav__label--menu { display: none; }          /* hamburger is icon-only on mobile */
.nav__dot { width: 8px; height: 8px; border-radius: 9999px; background: #000; }

@media (min-width: 640px) { .nav { padding: 1.25rem 1.5rem; } .nav__label--menu { display: inline; } }
@media (min-width: 768px) { .nav { padding: 1.5rem 3rem; } }

.hero-bottom {
  position: relative; z-index: 2;
  margin-top: auto;
  display: flex; flex-direction: column; gap: 1.5rem;
  padding: 0 1.25rem 1.5rem;     /* matches .nav so columns align with the navbar */
}
@media (min-width: 640px) { .hero-bottom { padding: 0 1.5rem 2rem; } }
@media (min-width: 768px) {
  .hero-bottom {
    flex: 1; margin-top: 0;
    flex-direction: row; align-items: stretch; justify-content: space-between;
    gap: 3rem; padding: 2rem 3rem 3rem;
  }
  .lede { align-self: flex-start; }   /* copy pinned top-left */
  .card { align-self: flex-end; }     /* card pinned bottom-right */
}

.lede { max-width: 24rem; }
.lede__title { font-size: 1.25rem; font-weight: 300; line-height: 1.25; letter-spacing: -0.025em; color: #000; }
.lede__body  { margin-top: 0.75rem; max-width: 280px; font-size: 0.75rem; line-height: 1.625; color: rgba(0, 0, 0, 0.6); }

@media (min-width: 640px)  { .lede__title { font-size: 1.5rem; }   .lede__body { font-size: 0.875rem; } }
@media (min-width: 768px)  { .lede__title { font-size: 1.875rem; } .lede__body { margin-top: 1rem; } }
@media (min-width: 1024px) { .lede__title { font-size: 2.25rem; } }

.chamfer {
  position: relative; display: flex; align-items: center; justify-content: space-between;
  width: 220px; height: 44px; margin-top: 1.5rem; padding: 0 1.25rem;
  color: #000; text-decoration: none; pointer-events: auto; transition: opacity 300ms;
}
.chamfer:hover { opacity: 0.7; }

/* mobile-only frosted backing, clipped to the same chamfer silhouette */
.chamfer__glass {
  position: absolute; inset: 0;
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
  border: 1px solid rgba(0, 0, 0, 0.2);
  clip-path: polygon(14px 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%, 0 14px);
}
.chamfer__outline { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.chamfer__label { position: relative; font-size: 0.75rem; letter-spacing: 0.025em; }
.chamfer .icon { position: relative; }

@media (min-width: 640px) {
  .chamfer { width: 260px; height: 48px; padding: 0 1.5rem; }
  .chamfer__label { font-size: 0.875rem; }
  .chamfer__glass { background: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; border-color: transparent; }
}
@media (min-width: 768px) { .chamfer { margin-top: 2rem; } }

.card {
  position: relative;
  display: flex; flex-direction: column; justify-content: space-between;
  width: 340px; max-width: 100%; height: 460px;
  padding: 2rem;
  border-radius: 48px;
  overflow: hidden;                            /* clips the duplicate to the card */
  background: transparent;                     /* the refraction IS the fill */
  border: 1px solid rgba(47, 47, 47, 0.15);
  pointer-events: auto;
}

/* full-viewport-aligned copy of the backdrop; left/top/width/height are written every frame by glass-card.js */
#dup-video-container { position: absolute; left: 0; top: 0; z-index: 0; overflow: hidden; pointer-events: none; }
#dup-image { position: absolute; inset: 0; width: 100%; height: 100%; filter: url(#liquid-glass-refraction); }

.card__frost {
  position: absolute; inset: 0; z-index: 1;
  border-radius: 48px; pointer-events: none;
  background: rgba(255, 255, 255, 0.05);
  box-shadow: inset 0 1.5px 2px rgba(255, 255, 255, 0.3),
              inset 0 -1px 2px rgba(0, 0, 0, 0.15);
  transition: background 400ms;
}
.card.group:hover .card__frost { background: rgba(255, 255, 255, 0.1); }

.card__head, .card__body, .card__wave { position: relative; z-index: 2; }

.card__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem;
              padding-bottom: 0.75rem; border-bottom: 1px solid rgba(0, 0, 0, 0.1); }
.card__title { font-size: 1rem; font-weight: 500; letter-spacing: -0.025em; }
.card__index { font-size: 0.75rem; color: rgba(0, 0, 0, 0.4); }
.card__body { display: flex; flex-direction: column; gap: 1rem; margin-top: 1rem; }
.finding__title { font-size: 0.875rem; font-weight: 600; letter-spacing: -0.025em; }
.finding__text { margin-top: 0.25rem; font-size: 0.75rem; line-height: 1.625; color: rgba(0, 0, 0, 0.5); }
.card__wave { display: block; width: 100%; height: auto; margin-top: 1.25rem; }

@media (min-width: 640px) { .card__title { font-size: 1.125rem; } }
@media (min-width: 768px) {
  .card__head { padding-bottom: 1rem; }
  .card__title { font-size: 1.25rem; }
  .card__body { gap: 1.25rem; margin-top: 1.25rem; }
  .finding__title { font-size: 1rem; }
  .finding__text { font-size: 0.875rem; margin-top: 0.375rem; }
  .card__wave { margin-top: 1.5rem; }
}

.menu { position: fixed; inset: 0; z-index: 50; visibility: hidden; pointer-events: none;
        transition: visibility 0s linear 500ms; }
.menu.is-open { visibility: visible; pointer-events: auto; transition-delay: 0s; }

.menu__backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.4);
                  backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
                  opacity: 0; transition: opacity 500ms; }
.menu.is-open .menu__backdrop { opacity: 1; }

.menu__panel { position: absolute; top: 0; left: 0; display: flex; flex-direction: column;
               width: 100%; height: 100%; padding: 1.5rem 2rem; background: #f5f4f0;
               transform: translateX(-100%);
               transition: transform 500ms cubic-bezier(0.16, 1, 0.3, 1); }
.menu.is-open .menu__panel { transform: translateX(0); }
@media (min-width: 640px) { .menu__panel { width: 380px; padding: 1.5rem 2.5rem; } }

.menu__close { display: inline-flex; align-items: center; gap: 0.625rem; align-self: flex-start;
               margin-bottom: 3rem; background: none; border: 0; font: inherit; font-size: 0.875rem;
               color: #000; cursor: pointer; transition: opacity 300ms; }
.menu__close:hover { opacity: 0.6; }

.menu__nav { display: flex; flex-direction: column; }
.menu__link { display: flex; align-items: center; justify-content: space-between; padding: 1rem 0;
              border-bottom: 1px solid rgba(0, 0, 0, 0.1); color: #000; text-decoration: none;
              opacity: 0; transform: translateY(20px); transition: opacity 500ms, transform 500ms; }
.menu__linkText { font-size: 1.5rem; font-weight: 300; letter-spacing: -0.025em; transition: transform 300ms; }
.menu__link:hover .menu__linkText { transform: translateX(8px); }
.menu__arrow { opacity: 0; transform: translateX(8px); transition: opacity 300ms, transform 300ms; }
.menu__link:hover .menu__arrow { opacity: 1; transform: translateX(0); }
@media (min-width: 640px) { .menu__linkText { font-size: 1.875rem; } }

.menu.is-open .menu__link { opacity: 1; transform: translateY(0); }
.menu.is-open .menu__link:nth-child(1) { transition-delay: 150ms; }
.menu.is-open .menu__link:nth-child(2) { transition-delay: 225ms; }
.menu.is-open .menu__link:nth-child(3) { transition-delay: 300ms; }
.menu.is-open .menu__link:nth-child(4) { transition-delay: 375ms; }
.menu.is-open .menu__link:nth-child(5) { transition-delay: 450ms; }

.menu__foot { margin-top: auto; padding: 1.5rem 0 2rem; border-top: 1px solid rgba(0, 0, 0, 0.1);
              opacity: 0; transform: translateY(20px); transition: opacity 500ms, transform 500ms; }
.menu.is-open .menu__foot { opacity: 1; transform: translateY(0); transition-delay: 600ms; }
.menu__footLabel { display: block; margin-bottom: 0.75rem; font-size: 0.75rem; text-transform: uppercase;
                   letter-spacing: 0.025em; color: rgba(0, 0, 0, 0.4); }
.menu__mail { font-size: 0.875rem; color: rgba(0, 0, 0, 0.7); text-decoration: none; transition: color 300ms; }
.menu__mail:hover { color: #000; }

@media (prefers-reduced-motion: reduce) { * { transition-duration: 0.01ms !important; } }

.brand{position:absolute;left:50%;transform:translateX(-50%);width:154px;pointer-events:auto}.brand svg{display:block;width:100%;height:auto}
.lede__eyebrow{font-size:10px;letter-spacing:.18em;margin:0 0 20px}.finding__title a{color:inherit;text-decoration:none}.finding__title a:hover{color:#626262}.motion-toggle{position:fixed;bottom:14px;left:50%;transform:translateX(-50%);z-index:12;background:none;border:0;font:inherit;font-size:10px;color:#454545;cursor:pointer}.nav__item:focus-visible,a:focus-visible,button:focus-visible{outline:2px solid #626262;outline-offset:5px}.menu__panel{overflow-y:auto}.menu__foot{flex-shrink:0}.menu__link{flex-shrink:0}.menu__brand{width:160px;margin-bottom:28px}.menu__brand svg{width:100%;height:auto}.menu__close{margin-bottom:24px}.menu__mail{font-size:16px}.card__wave{max-height:45px}.finding__text{color:rgba(0,0,0,.68)}
@media(max-width:767px){.nav{padding:20px}.brand{width:122px}.hero-bottom{gap:18px;padding-bottom:38px}.lede{max-width:100%}.lede__eyebrow{margin-bottom:9px}.lede__body{max-width:310px}.chamfer{margin-top:14px;height:40px}.card{width:100%;height:245px;min-height:0;padding:22px 26px;border-radius:32px}.card__frost{border-radius:32px}.card__body{gap:10px;margin-top:10px}.card__wave{height:22px;margin-top:10px}.card__title{font-size:14px}.finding__text{font-size:12px;line-height:1.55}.finding__title{font-size:13px}.lede__title{font-size:26px}.lede__body{font-size:12px}}
@media(max-height:720px) and (max-width:767px){.hero-bottom{gap:12px;padding-bottom:30px}.card{height:215px;padding:17px 22px}.card__wave{display:none}.lede__title{font-size:23px}.lede__body{margin-top:8px}.lede__eyebrow{display:none}.chamfer{margin-top:10px;height:36px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition-duration:.01ms!important}}
/* The same glass system, extended into full editorial pages. */
.languages{display:flex;gap:20px;margin:0 0 22px;font-size:12px}.languages a{color:inherit;text-decoration:none;padding-bottom:5px}.languages [aria-current]{border-bottom:1px solid #626262;color:#626262}
body.inner-page{height:auto;overflow-y:auto;overflow-x:hidden;background:#c5cbd0}html:has(.inner-page){height:auto;overflow-y:auto;scroll-behavior:auto;scroll-padding-top:28px}
.inner-hero{height:auto;min-height:100dvh;pointer-events:auto}.inner-hero .nav{flex-shrink:0}.inner-heading{padding:clamp(60px,11vh,130px) max(24px,7vw) 80px;min-height:65vh;max-width:1200px}.inner-heading h1{font-size:clamp(38px,5.4vw,78px);line-height:1.22;font-weight:300;letter-spacing:-.05em;max-width:1000px}.inner-heading h1 em{font-style:normal;color:#626262}.inner-heading .lede__eyebrow{margin-bottom:25px}.inner-intro{font-size:14px;line-height:1.8;margin-top:28px;max-width:540px}.section-jump{display:inline-block;color:inherit;font-size:12px;text-decoration:none;border-bottom:1px solid #0004;padding:12px 0;margin-top:22px}
.page-content{width:min(1180px,calc(100% - 96px));margin:0 auto;display:grid;gap:30px;padding-bottom:50px}.content-panel{padding:clamp(28px,4.4vw,64px);border:1px solid #ffffffb3;border-radius:38px;background:#ffffffb8;backdrop-filter:blur(20px) saturate(1.12);-webkit-backdrop-filter:blur(20px) saturate(1.12);box-shadow:inset 0 1px 0 #fff9,0 12px 44px #24242c08;display:grid;grid-template-columns:1fr 1.25fr;gap:7%;align-items:start;opacity:1}
.content-panel .eyebrow{font-size:10px;letter-spacing:.12em;line-height:1.7;color:#707070}.content-panel h2{font-size:clamp(26px,3vw,42px);font-weight:300;line-height:1.3;letter-spacing:-.035em;margin:18px 0 28px}.content-panel h2 em{font-style:normal;color:#626262}.content-panel p,.content-panel li{font-size:15px;line-height:1.85;color:#333}.content-panel p+p{margin-top:18px}.section-content{min-width:0}.content-panel .detail-rows{margin-top:28px}.content-panel .detail-row{display:grid;grid-template-columns:26px 1fr;gap:8px 16px;border-top:1px solid #0002;padding:22px 0}.content-panel .detail-row>.eyebrow{grid-row:1/3}.content-panel .detail-row>div{grid-column:2}.content-panel h3{font-size:17px;font-weight:400;line-height:1.5}.content-panel ul{list-style:none;padding:0;margin:20px 0 0}.content-panel li{border-bottom:1px solid #0002;padding:17px 0}.content-panel .numbered-list li{display:flex;gap:20px}.content-panel .numbered-list li>.eyebrow{flex:0 0 22px}.content-panel .text-link{display:inline-flex;align-items:center;gap:32px;color:#222;text-decoration:none;border-bottom:1px solid;padding:16px 0;margin-top:24px}.content-panel .arrow-icon{width:20px;height:20px}.market-connection{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:20px;margin-top:35px;padding-top:25px;border-top:1px solid #0002}.content-panel>a{color:inherit}.row-description{display:block;font-size:13px;color:#555}.page-footer{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;padding:40px 48px 65px;font-size:12px}.page-footer a{color:inherit;text-decoration:none}.page-footer .languages{margin:0}.footer-wordmark{font-size:20px}.inner-page .motion-toggle{left:auto;right:20px;transform:none;border-radius:20px;background:#ffffffb8;padding:8px 12px}
@media(max-width:767px){.inner-heading{padding:70px 24px 50px;min-height:60vh}.inner-heading h1{font-size:40px}.page-content{width:calc(100% - 32px);gap:18px}.content-panel{grid-template-columns:1fr;gap:14px;border-radius:28px;padding:28px 22px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.content-panel h2{font-size:28px;margin:14px 0 12px}.content-panel p,.content-panel li{font-size:14px}.page-footer{padding:28px 24px 70px;display:grid;grid-template-columns:1fr 1fr;font-size:11px}.page-footer .languages{grid-column:1/-1}.inner-page .brand{width:110px}}
.content-panel .detail-row>ul{grid-column:2;margin:0}.content-panel .detail-row>ul li{padding:4px 0;border:0;font-size:14px}.content-panel:has(>.eyebrow){display:block}.content-panel:has(>.eyebrow)>p:not(.eyebrow){max-width:680px}
.inner-hero>.nav{position:sticky;top:0;z-index:20;background:#ffffffaa;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
html:has(.home-page),body.home-page{height:auto;overflow-y:auto;overflow-x:hidden;scroll-behavior:auto}
.home-page .hero{height:auto;min-height:100dvh}.home-page .hero-bottom{flex:none;min-height:calc(100svh - 76px)}
.home-content,.home-page .page-footer{pointer-events:auto}.home-scroll-hint{pointer-events:auto;text-decoration:none;color:#333;text-align:center;font-size:11px;letter-spacing:.08em;padding:24px 0 38px}.home-panel{display:block}.home-panel .prose{max-width:760px}.home-panel .prose p{margin-top:18px}.principles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:32px}.principles-grid h3{margin:14px 0}.home-panel .practice{display:grid;grid-template-columns:1fr 1fr auto;gap:12px 24px;padding:26px 0;border-top:1px solid #0002;color:inherit;text-decoration:none}.home-panel .practice small{grid-column:1/-1;font-size:10px;letter-spacing:.1em}.home-panel .practice .status{font-size:12px}.home-panel .practice:hover{color:#626262}.portal-title{display:flex;align-items:center;justify-content:space-between;font-size:clamp(32px,4vw,56px);line-height:1.3;margin:35px 0;color:inherit;text-decoration:none}.portal-title em{font-style:normal;color:#626262}.portal-top{display:flex;justify-content:space-between}.portal-bottom>span{font-size:10px;letter-spacing:.1em}.portal-bottom p{margin-top:12px}.home-page .motion-toggle{left:auto;right:20px;transform:none;background:#ffffffb8;padding:8px 12px;border-radius:20px}.home-panel.connection{max-width:100%}.home-panel.connection>div{max-width:740px}
@media(max-width:767px){.home-page .hero-bottom{justify-content:flex-end;min-height:calc(100svh - 60px)}.principles-grid{grid-template-columns:1fr;gap:22px}.principles-grid article{padding-top:18px;border-top:1px solid #0002}.home-panel .practice{grid-template-columns:1fr auto}.home-panel .practice p{grid-column:1}.portal-top{display:block}.portal-top span{display:block;margin-top:8px}.portal-title{font-size:32px}}
/* Shared floating glass navigation. */
.hero>.nav,.inner-hero>.nav{
 position:fixed;top:max(14px,env(safe-area-inset-top));left:24px;right:24px;width:auto;
 height:66px;padding:0 24px;z-index:30;border-radius:999px;
 background:rgba(245,245,240,.58);border:1px solid rgba(255,255,255,.78);
 box-shadow:inset 0 1px 0 #fff9,0 8px 30px #27252c0c;
 backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15)
}
.home-page .hero-bottom{padding-top:118px;min-height:100svh}
.inner-heading{padding-top:155px}
.footer-wordmark{display:block;width:166px;max-width:100%;line-height:0}
.footer-wordmark svg{display:block;width:100%;height:auto}
@media(max-width:767px){
 .hero>.nav,.inner-hero>.nav{top:max(12px,env(safe-area-inset-top));left:14px;right:14px;height:58px;padding:0 17px}
 .hero>.nav .brand{width:110px}
 .hero>.nav .nav__label{font-size:11px}
 .hero>.nav .nav__dot{width:5px;height:5px}
 .hero>.nav .nav__item{gap:6px}
 .home-page .hero-bottom{padding-top:95px;min-height:100svh}
 .inner-heading{padding-top:130px}
 .footer-wordmark{width:140px}
}
@media(max-width:390px){.hero>.nav .brand{width:96px}.hero>.nav .nav__label{font-size:10px}}

/* Glass appears only after leaving the top; fade the surface, not the blur. */
.hero>.nav,.inner-hero>.nav{background:transparent;border-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;isolation:isolate}
.hero>.nav::before,.inner-hero>.nav::before{content:"";position:absolute;inset:-1px;z-index:-1;pointer-events:none;border-radius:inherit;background:rgba(245,245,240,.58);border:1px solid rgba(255,255,255,.78);box-shadow:inset 0 1px 0 #fff9,0 8px 30px #27252c0c;backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15);opacity:0;transition:opacity .25s ease}
.hero>.nav.is-scrolled::before,.inner-hero>.nav.is-scrolled::before{opacity:1}

/* Swap the full wordmark for its compact symbol with the glass surface. */
.nav .brand{min-height:44px;display:flex;align-items:center;justify-content:center}
.nav .brand>svg{transition:opacity .2s ease,transform .2s ease}
.nav .brand-icon{position:absolute;left:50%;top:50%;width:34px;height:34px;opacity:0;transform:translate(-50%,-50%) scale(.85);transition:opacity .2s ease,transform .2s ease;pointer-events:none}
.nav.is-scrolled .brand>svg{opacity:0;transform:scale(.94);pointer-events:none}
.nav.is-scrolled .brand-icon{opacity:1;transform:translate(-50%,-50%) scale(1)}
/* Align navigation with the editorial column and rearrange on scroll. */
.hero>.nav,.inner-hero>.nav{width:min(1180px,calc(100% - 96px));left:50%;right:auto;transform:translateX(-50%);--nav-inset:24px;--menu-width:90px}
.nav #menu-open{position:absolute;left:var(--nav-inset);width:var(--menu-width);justify-content:center;transition:left .45s cubic-bezier(.22,1,.36,1)}
.nav .brand{transition:left .45s cubic-bezier(.22,1,.36,1)}
.nav>a.nav__item{position:absolute;right:var(--nav-inset);transition:right .45s cubic-bezier(.22,1,.36,1)}
.nav.is-scrolled .brand{left:calc(var(--nav-inset) + 17px)}
.nav.is-scrolled #menu-open{left:calc(100% - var(--nav-inset) - var(--menu-width))}
.nav.is-scrolled>a.nav__item{right:calc(var(--nav-inset) + var(--menu-width) + 24px)}
.nav.is-scrolled .brand{width:44px!important}
@media(max-width:767px){.hero>.nav,.inner-hero>.nav{width:calc(100% - 32px);left:50%;right:auto;--nav-inset:17px;--menu-width:32px}.nav.is-scrolled>a.nav__item{right:calc(var(--nav-inset) + var(--menu-width) + 16px)}}

::selection{background:#d5d5d5;color:#252525}

.menu__header{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:30px;flex-shrink:0;min-height:44px}
.menu__header .menu__brand{width:160px;margin:0;flex-shrink:1;min-width:0}
.menu__header .menu__close{align-self:center;margin:0;min-height:44px;flex-shrink:0;padding:0 4px}
/* Keep localized menu labels intact at tablet widths. */
.nav__label{white-space:nowrap;flex-shrink:0}
.nav #menu-open>svg{flex-shrink:0}
@media(min-width:640px){.hero>.nav,.inner-hero>.nav{--menu-width:104px}}

/* Expandable brand collection: add one article per confirmed brand. */
.collection-heading{max-width:650px;margin-bottom:36px}.collection-heading h2{margin-bottom:16px}
.brand-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.brand-tile{display:flex;flex-direction:column;min-width:0;min-height:320px;padding:28px;border:1px solid #fff;border-radius:24px;background:#ffffff65;color:inherit;text-decoration:none}
.brand-meta{display:flex;justify-content:space-between;gap:12px;font-size:9px;letter-spacing:.1em;color:#626262}.brand-status{font-size:8px;border-bottom:1px solid #aaa;padding-bottom:3px}
.content-panel .brand-name{font-size:clamp(26px,3.5vw,46px);letter-spacing:-.05em;font-weight:400;margin:48px 0}
.brand-caption{margin-top:auto}.brand-caption h4{font-size:18px;font-weight:400;line-height:1.5}.content-panel .brand-caption p{font-size:13px;line-height:1.7;margin-top:10px}
.brand-invitation{background:#ffffff20;border:1px dashed #8b8b8b66;transition:background .2s ease}.brand-invitation:hover{background:#ffffff60}.brand-next{font-size:42px;font-weight:200;color:#888;margin:25px 0}.brand-cta{display:inline-block;margin-top:20px;font-size:12px;border-bottom:1px solid #888;padding-bottom:5px}
@media(max-width:600px){.brand-grid{grid-template-columns:1fr;gap:14px}.brand-tile{min-height:260px;padding:24px}.brand-invitation{min-height:230px}.collection-heading{margin-bottom:24px}.content-panel .brand-name{font-size:36px;margin:36px 0}.brand-next{margin:18px 0}}

.brand-name a{display:inline-block;max-width:100%}.brand-name img{display:block;width:200px;max-width:100%;height:auto}
/* Header movement uses cached transforms instead of animated layout coordinates. */
.hero>.nav,.inner-hero>.nav{--brand-width:170px;--contact-gap:24px}
.nav .brand,.nav.is-scrolled .brand{left:50%;width:var(--brand-width)!important;transform:translate3d(-50%,0,0);transition:transform .36s cubic-bezier(.22,1,.36,1);will-change:transform}
.nav.is-scrolled .brand{transform:translate3d(calc(-50% + var(--brand-shift,0px)),0,0)}
.nav #menu-open,.nav.is-scrolled #menu-open{left:var(--nav-inset);transform:translate3d(0,0,0);transition:transform .36s cubic-bezier(.22,1,.36,1);will-change:transform}
.nav.is-scrolled #menu-open{transform:translate3d(var(--menu-shift,0px),0,0)}
.nav>a.nav__item,.nav.is-scrolled>a.nav__item{right:var(--nav-inset);transform:translate3d(0,0,0);transition:transform .36s cubic-bezier(.22,1,.36,1);will-change:transform}
.nav.is-scrolled>a.nav__item{transform:translate3d(calc(0px - var(--menu-width) - var(--contact-gap)),0,0)}
@media(max-width:767px){.hero>.nav,.inner-hero>.nav{--brand-width:122px;--contact-gap:16px}}
@media(max-width:390px){.hero>.nav,.inner-hero>.nav{--brand-width:106px}}
@media(hover:none) and (pointer:coarse){.hero>.nav::before,.inner-hero>.nav::before{background:rgba(245,245,240,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:inset 0 1px 0 #fff9;transition:opacity .2s ease}}

/* Touch devices reuse the native video backdrop instead of filtering a second canvas. */
@media(hover:none) and (pointer:coarse),(prefers-reduced-motion:reduce){
 #dup-video-container{display:none}#dup-image{filter:none}
 .card{background:rgba(245,247,249,.64);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border-color:rgba(255,255,255,.75)}
 .card__frost{background:linear-gradient(130deg,rgba(255,255,255,.32),transparent 48%,rgba(211,219,241,.18));box-shadow:inset 0 1px 0 #ffffffc0,inset 0 -1px 0 #ffffff60;transition:none}
 .card.group:hover .card__frost{background:linear-gradient(130deg,rgba(255,255,255,.32),transparent 48%,rgba(211,219,241,.18))}
}

#three-background{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 40% 40%,#e7e8e5 0%,#c5cbd0 75%)}#three-background.ready{background:radial-gradient(ellipse at 40% 30%,#e7e8e5,#c5cbd0)}#three-background canvas{display:block;width:100%;height:100%}#dup-video-container{display:none}.card{background:#ffffff80;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
#three-background{z-index:0}.hero{position:relative;z-index:1}
/* Small optical adjustment to the hamburger, without moving its hit target. */
.nav #menu-open>svg{position:relative;left:-5px}
/* Add a little breathing room to the home hero copy group. */
.home-page .lede{padding-left:12px;box-sizing:border-box}

.content-panel.brand-collection{display:block}.brand-collection .collection-heading{max-width:650px}
/* Identical language cells keep mixed scripts and active indicators aligned. */
.languages{display:inline-grid;grid-template-columns:repeat(3,minmax(56px,max-content));align-items:stretch;gap:20px}
.languages a,.languages a[aria-current]{display:flex;align-items:center;justify-content:center;min-height:40px;padding:0 0 8px;margin:0;line-height:1.4;border-bottom:1px solid transparent;box-sizing:border-box;white-space:nowrap}
.languages a[aria-current]{border-bottom-color:#626262;color:#626262}
@media(max-width:767px){.languages{gap:16px;grid-template-columns:repeat(3,64px)}}
/* Company footer: a quiet, structured close to every page. */
.page-footer.professional-footer{display:block;width:min(1180px,calc(100% - 96px));margin:32px auto 0;padding:48px 0 70px;border-top:1px solid #51575a45;color:#333;pointer-events:auto;font-size:14px}
.footer-main{display:grid;grid-template-columns:1.35fr 1fr 1.2fr;gap:48px;padding-bottom:48px}.footer-identity p{font-size:13px;line-height:1.9;margin-top:24px;color:#555}.professional-footer .footer-wordmark{width:170px}
.footer-column{display:flex;flex-direction:column;align-items:flex-start;gap:14px}.footer-column h2{font-size:11px;font-weight:400;letter-spacing:.08em;color:#626262;margin:0 0 8px}.footer-column a{line-height:1.5}.footer-column a:hover,.footer-top:hover{color:#666;text-decoration:underline;text-underline-offset:5px}.footer-email{display:flex;gap:22px;font-size:16px}.footer-company{color:#666;font-size:12px;margin-top:8px}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-top:22px;border-top:1px solid #51575a30}.footer-bottom small{font-size:11px}.footer-bottom .languages{font-size:12px;gap:12px}.footer-top{font-size:12px;display:flex;gap:18px;align-items:center}
@media(max-width:767px){.page-footer.professional-footer{width:calc(100% - 48px);padding:32px 0 84px;margin-top:24px}.footer-main{grid-template-columns:1fr 1fr;gap:32px 20px;padding-bottom:32px}.footer-identity{grid-column:1/-1}.footer-identity p{margin-top:18px}.footer-column{gap:12px}.footer-email{font-size:13px;gap:8px}.footer-bottom{display:grid;grid-template-columns:1fr auto;gap:18px}.footer-bottom .languages{grid-column:1/-1;grid-row:1;justify-self:start}.footer-bottom small{grid-column:1}.footer-top{grid-column:2}.professional-footer .footer-wordmark{width:150px}}
/* One divider per service category; supporting items use spacing only. */
.content-panel .detail-row ul{margin-top:10px}
.content-panel .detail-row ul li{border-bottom:0;padding:5px 0}

/* The hero card stays still on page load. */
.hero-bottom .card{animation:none}

/* A shared centerline for the wordmark, menu and contact action. */
.nav .brand,.nav #menu-open,.nav>a.nav__item{top:calc(50% - 22px);height:44px;min-height:44px;margin-block:0;display:flex;align-items:center;padding-block:0;box-sizing:border-box}
.nav .brand>svg{display:block;flex-shrink:0}
.nav #menu-open>svg{display:block;flex-shrink:0;margin-bottom:2px}
.nav.is-scrolled #menu-open>svg{margin-bottom:0}
.nav .nav__label{line-height:20px}

/* Consistent native font weights, including CJK on iOS. */
.finding__title,.finding__title a{font-family:"Helvetica Neue","PingFang TC","Hiragino Sans",Arial,sans-serif;font-weight:500;font-synthesis:none;letter-spacing:0}
.finding__title a{display:inline-flex;align-items:center;gap:.35em}
.inline-arrow{display:inline-block;width:1em;height:1em;flex:none;vertical-align:-.12em}

/* Match Safari's exposed canvas and extend the page into device safe areas. */
html,body,body.inner-page{background-color:#c5cbd0}
#three-background.ready{background:radial-gradient(ellipse at 40% 40%,#e7e8e5 0%,#c5cbd0 75%)}
.motion-toggle{bottom:calc(14px + env(safe-area-inset-bottom))}
.page-footer.professional-footer{padding-bottom:calc(84px + env(safe-area-inset-bottom))}

/* Navigation closes the menu immediately, without an exit sequence. */
.menu.navigation-close,.menu.navigation-close *{transition:none!important;animation:none!important}

/* Closed menus never paint, including refresh and history restoration. */
.menu[hidden]{display:none!important}

/* Stable small labels: no downloaded font swap or entrance compositing. */
.lede>.lede__eyebrow,.inner-heading>.lede__eyebrow{
 font-family:"Helvetica Neue","PingFang TC","Hiragino Sans",Arial,sans-serif;
 font-size:10px;font-weight:400;line-height:1.6;font-synthesis:none;
 -webkit-text-size-adjust:100%;text-size-adjust:100%;
 animation:none;transform:none;
}

/* Set restored header position before enabling scroll-driven transitions. */
.nav:not(.header-motion-ready),.nav:not(.header-motion-ready)::before,
.nav:not(.header-motion-ready) *{transition:none!important}

/* Only hero text enters; the document and small labels stay stationary. */
@keyframes hero-text-arrive{
 from{opacity:0;transform:translate3d(0,12px,0)}
 to{opacity:1;transform:translate3d(0,0,0)}
}
@media(prefers-reduced-motion:no-preference){
 .lede>.lede__title,.lede>.lede__body,
 .inner-heading>h1,.inner-heading>.inner-intro{
  animation:hero-text-arrive .7s cubic-bezier(.22,1,.36,1) backwards;
 }
 .lede>.lede__title,.inner-heading>h1{animation-delay:45ms}
 .lede>.lede__body,.inner-heading>.inner-intro{animation-delay:110ms}
}

/* Keep mobile Safari chrome, safe areas and the transparent 3D canvas on one base color. */
@media (max-width: 900px), (hover: none) and (pointer: coarse){
 html,body,body.inner-page,#three-background,#three-background.ready{background:#c5cbd0;}
}

/* Product-page style: fade and slight rise when each text block enters. */
.copy-reveal{opacity:0;translate:0 14px;transition:opacity .75s ease,translate .75s cubic-bezier(.22,1,.36,1)}
.copy-reveal.copy-revealed,.copy-reveal:focus-within{opacity:1;translate:0 0}
@media(prefers-reduced-motion:reduce){.copy-reveal{opacity:1;translate:none;transition:none}}
@media print{.copy-reveal{opacity:1;translate:none}}

/* Keep the home exploration label stable while fonts load and Safari resizes. */
.home-scroll-hint{
 font-family:"Helvetica Neue","PingFang TC","Hiragino Sans",Arial,sans-serif;
 font-size:11px;font-weight:400;line-height:18px;font-synthesis:none;
 -webkit-text-size-adjust:100%;text-size-adjust:100%;
 animation:none;transition:none;transform:none;
}
