/* WaveCrest V16 · interaction & motion layer.
   Loaded after the theme stylesheet. Everything here is additive: it only styles
   elements/attributes created by wave-fx.js or enhances existing classes, keeping
   the original palette (#060c14 / cyan #79eddc / blue #6ccaff). */

:root{
  --wfx-cyan:#79eddc;--wfx-blue:#6ccaff;--wfx-deep:#060c14;
  --wfx-ease:cubic-bezier(.2,.75,.15,1);
}

/* ---------- Ambient layers ---------- */
.wfx-grain{position:fixed;inset:0;z-index:9990;pointer-events:none;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- Scroll progress + back to top ---------- */
.wfx-progress{position:fixed;left:0;top:0;height:2px;width:100%;z-index:9995;pointer-events:none;transform-origin:0 50%;transform:scaleX(0);
  background:linear-gradient(90deg,#57b7f7,#79eddc 60%,#c9fff4);box-shadow:0 0 12px #79eddc99,0 0 2px #c9fff4}
.wfx-top{position:fixed;right:26px;bottom:26px;z-index:60;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;
  background:#08141fd9;border:1px solid #2c4757;color:#bfeef0;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  opacity:0;transform:translateY(16px) scale(.85);pointer-events:none;transition:opacity .45s var(--wfx-ease),transform .45s var(--wfx-ease),border-color .3s,box-shadow .3s}
.wfx-top[data-show]{opacity:1;transform:none;pointer-events:auto}
.wfx-top:hover{border-color:#79eddc;box-shadow:0 0 28px #79eddc40}
.wfx-top svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.wfx-top circle{fill:none;stroke-width:1.6}
.wfx-top .track{stroke:#79eddc1f}
.wfx-top .bar{stroke:#79eddc;stroke-linecap:round;stroke-dasharray:151;stroke-dashoffset:151;filter:drop-shadow(0 0 4px #79eddc)}
.wfx-top span{font-size:17px;line-height:1;transition:transform .3s}
.wfx-top:hover span{transform:translateY(-3px)}

/* ---------- Header ---------- */
.site .header{transition:transform .5s var(--wfx-ease),box-shadow .4s,background .4s}
.site .header[data-wfx-scrolled]{background:#060c14d9;box-shadow:0 10px 40px #0007}
.site .header[data-wfx-scrolled]:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;pointer-events:none;
  background:linear-gradient(90deg,transparent,#79eddc88 var(--wfx-hp,50%),transparent);opacity:.7}
.site .header[data-wfx-hidden]{transform:translateY(-105%)}
.wordmark img{transition:transform .9s var(--wfx-ease),box-shadow .4s}
.wordmark:hover img{transform:rotate(-360deg) scale(1.08);box-shadow:0 0 18px #79eddc66}
.wfx-nav-pill{position:absolute;top:50%;height:34px;left:0;width:0;margin-top:-17px;border-radius:17px;z-index:-1;pointer-events:none;opacity:0;
  background:linear-gradient(120deg,#79eddc1c,#6ccaff14);border:1px solid #79eddc2e;
  transition:transform .45s var(--wfx-ease),width .45s var(--wfx-ease),opacity .3s}
.site .header .desktop-nav{isolation:isolate}
.site .header .desktop-nav a{transition:color .25s}

/* ---------- Site-wide current field (pointer, clicks and scroll act on it; the cursor itself is untouched) ---------- */
.wfx-field{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}

/* ---------- Scroll reveal ---------- */
html.wfx [data-wfx-r=""]{opacity:0;transform:translate3d(0,34px,0) scale(.985);filter:blur(8px)}
html.wfx [data-wfx-r=in]{opacity:1;transform:none;filter:none;
  transition:opacity .9s var(--wfx-ease) var(--wfx-d,0ms),transform 1.1s var(--wfx-ease) var(--wfx-d,0ms),filter .9s var(--wfx-ease) var(--wfx-d,0ms)!important}
html.wfx [data-wfx-r=in] .card-top svg,html.wfx [data-wfx-r=in].gx-service .gx-index{animation:wfx-pop .9s var(--wfx-ease) calc(var(--wfx-d,0ms) + .25s) both}
@keyframes wfx-pop{0%{transform:scale(.4) rotate(-40deg);opacity:0}60%{transform:scale(1.15) rotate(6deg);opacity:1}to{transform:none}}

/* Section headings: a light line draws under the eyebrow when revealed */
.section-head .eyebrow,.intro .eyebrow,.gx-section-head .eyebrow,.gx-governance-title .eyebrow{position:relative;display:inline-block}
html.wfx .section-head [data-wfx-r] .eyebrow:after,html.wfx .intro [data-wfx-r] .eyebrow:after{content:"";position:absolute;left:0;bottom:-4px;height:1px;width:100%;
  background:linear-gradient(90deg,#79eddc,transparent);transform:scaleX(0);transform-origin:0 50%;transition:transform 1.2s var(--wfx-ease) .4s}
html.wfx .section-head [data-wfx-r=in] .eyebrow:after,html.wfx .intro [data-wfx-r=in] .eyebrow:after{transform:scaleX(1)}

/* ---------- Hero ---------- */
.hero-content>*{animation:wfx-rise 1.1s var(--wfx-ease) both}
.hero-content>:nth-child(1){animation-delay:.05s}.hero-content>:nth-child(2){animation-delay:.15s}
.hero-content>:nth-child(3){animation-delay:.28s}.hero-content>:nth-child(4){animation-delay:.4s}
.hero-content>:nth-child(5){animation-delay:.52s}.hero-content>:nth-child(6){animation-delay:.62s}
.hero-art{animation:wfx-art-in 1.6s var(--wfx-ease) .1s backwards}
.hero-bottom{animation:wfx-fade 1.2s ease .9s backwards}
@keyframes wfx-rise{from{opacity:0;transform:translateY(36px);filter:blur(10px)}to{opacity:1;transform:none;filter:none}}
@keyframes wfx-art-in{from{opacity:0;scale:.82;filter:blur(14px)}to{opacity:1;scale:1;filter:none}}
@keyframes wfx-fade{from{opacity:0}to{opacity:1}}
.motion-off .hero-content>*,.motion-off .hero-art,.motion-off .hero-bottom{animation:none!important}

.brand-caption{background-image:linear-gradient(110deg,transparent 42%,#ffffffd0 50%,transparent 58%),linear-gradient(120deg,#73caff 5%,#b3f6ed 53%,#66a9ee 95%);
  background-size:260% 100%,180% 100%;animation:wfx-caption 9s ease-in-out infinite,wfx-rise 1.1s var(--wfx-ease) .15s both}
@keyframes wfx-caption{0%{background-position:160% 0,0 50%}22%{background-position:-60% 0,40% 50%}100%{background-position:-60% 0,100% 50%}}
.motion-off .brand-caption{animation:none!important}

.hero-art{perspective:1100px}
.hero-brand{will-change:transform,translate,rotate;transition:translate .2s linear}
.hero-art>.floating-tokens,.hero-art>.orbit,.hero-art>.brand-halo{transition:translate .25s linear}
.wfx-logo-fx{position:absolute;pointer-events:none;border-radius:50%;z-index:2}
.wfx-halo-ring{animation:wfx-spin 9s linear infinite;will-change:transform}
.wfx-halo-ring svg,.wfx-trail svg{display:block;width:100%;height:100%;overflow:visible}
.wfx-halo-ring.b{animation-duration:15s;animation-direction:reverse;opacity:.55}
@keyframes wfx-spin{to{rotate:360deg}}
.wfx-sonar{border:1px solid #79eddc;opacity:0;animation:wfx-sonar 5.4s cubic-bezier(.1,.6,.3,1) infinite}
.wfx-sonar.s2{animation-delay:1.8s}.wfx-sonar.s3{animation-delay:3.6s}
@keyframes wfx-sonar{0%{transform:scale(.98);opacity:.55;border-color:#c9fff4}70%{opacity:.08}100%{transform:scale(1.62);opacity:0;border-color:#57b7f7}}
.wfx-sheen{z-index:4;opacity:0;transition:opacity .5s;
  background:radial-gradient(circle at var(--wfx-sx,35%) var(--wfx-sy,30%),#ffffff59,#ffffff14 24%,#ffffff00 52%)}
.hero-art:hover .wfx-sheen{opacity:1}
.motion-off .wfx-sonar,.motion-off .wfx-halo-ring{animation:none!important}
.motion-off .wfx-sonar{opacity:0}

/* Floating tokens · glass discs, comet trails, bobbing */
.hero-art .floating-tokens .floating-token{animation:wfx-bob 5.2s ease-in-out infinite}
.hero-art .floating-tokens .token-anchor:nth-child(2) .floating-token{animation-delay:-1.1s;animation-duration:5.8s}
.hero-art .floating-tokens .token-anchor:nth-child(3) .floating-token{animation-delay:-2.3s;animation-duration:4.7s}
.hero-art .floating-tokens .token-anchor:nth-child(4) .floating-token{animation-delay:-3.4s;animation-duration:6.1s}
.hero-art .floating-tokens .token-anchor:nth-child(5) .floating-token{animation-delay:-4.2s;animation-duration:5.4s}
@keyframes wfx-bob{0%,100%{translate:0 -5px}50%{translate:0 6px}}
.hero-art .floating-tokens .token-disc{position:relative;
  background:radial-gradient(circle at 32% 25%,#3d7d93cc,transparent 55%),linear-gradient(145deg,#173a4ce6,#081a29f2 72%);
  box-shadow:inset 0 1px 1px #e4fdff59,inset 0 -8px 16px #02080d80,0 10px 28px #0007,0 0 26px #67d6ee26}
.hero-art .floating-tokens .token-disc:before{content:"";position:absolute;inset:-3px;border-radius:50%;padding:1.5px;
  background:conic-gradient(#79eddc,#79eddc00 30%,#6ccaff 55%,#6ccaff00 80%,#79eddc);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  opacity:.55;transform:rotate(-35deg);transition:opacity .3s}
.hero-art .floating-tokens .token-disc:after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid #79eddc;opacity:0;pointer-events:none}
.hero-art .floating-tokens .floating-token[data-active=true] .token-disc:before{opacity:1}
.hero-art .floating-tokens .floating-token[data-active=true] .token-disc:after{animation:wfx-burst 1.1s var(--wfx-ease) infinite}
@keyframes wfx-burst{0%{transform:scale(1);opacity:.8}100%{transform:scale(1.9);opacity:0}}
.hero-art .floating-tokens .token-ticker{text-shadow:0 0 12px #79eddc55}
.wfx-trail{position:absolute;inset:0;pointer-events:none}
.motion-off .hero-art .floating-tokens .floating-token,.motion-off .hero-art .token-disc:before{animation:none!important}

.hero-bottom .scroll-down{position:relative;overflow:hidden;display:grid;place-items:center;transition:border-color .3s,box-shadow .3s}
.hero-bottom .scroll-down:hover{border-color:#79eddc;box-shadow:0 0 20px #79eddc33}
.hero-bottom .scroll-down{animation:wfx-nudge 2.4s ease-in-out infinite}
@keyframes wfx-nudge{0%,100%{transform:none}50%{transform:translateY(5px)}}

/* ---------- Velocity marquee ---------- */
.wfx-marquee{position:relative;overflow:hidden;padding:46px 0 40px;margin:0 0 -20px;user-select:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.wfx-mq-row{display:flex;white-space:nowrap;will-change:transform}
.wfx-mq-row+.wfx-mq-row{margin-top:14px}
.wfx-mq-row span{display:inline-flex;align-items:center;gap:.55em;padding-right:.55em;font-weight:700;letter-spacing:-.02em;line-height:1.1}
.wfx-mq-row.a span{font-size:clamp(40px,6.4vw,92px);color:transparent;-webkit-text-stroke:1px #79eddc59}
.wfx-mq-row.a span:nth-child(3n+2){-webkit-text-stroke:0;background:linear-gradient(110deg,#bfefff,#57b7f7 50%,#83ddca);-webkit-background-clip:text;background-clip:text;color:transparent;opacity:.85}
.wfx-mq-row.a span em{font-style:normal;font-size:.4em;color:#79eddc;-webkit-text-stroke:0;filter:drop-shadow(0 0 8px #79eddc)}
.wfx-mq-row.b span{font-size:12px;letter-spacing:4px;color:#5c7d92;font-weight:500}
.wfx-mq-row.b span em{font-style:normal;color:#79eddc;opacity:.7}
.wfx-mq-row.a span:hover{-webkit-text-stroke-color:#c9fff4}

/* ---------- Cards: tilt, border light, glare ---------- */
[data-wfx-tilt]{transform-style:preserve-3d;will-change:transform}
[data-wfx-tilt][data-wfx-tilting]{transition:transform .12s linear,border-color .3s,box-shadow .35s!important}
[data-wfx-tilt][data-wfx-leaving]{transition:transform .7s var(--wfx-ease),border-color .3s,box-shadow .35s!important}
[data-wfx-tilt]:after{content:"";position:absolute;inset:0;pointer-events:none;padding:1px;z-index:3;opacity:0;transition:opacity .4s;
  background:radial-gradient(260px circle at var(--wfx-gx,50%) var(--wfx-gy,50%),#c9fff4,#79eddc88 30%,transparent 60%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
[data-wfx-tilt]:hover:after{opacity:1}
[data-wfx-tilt]:hover{box-shadow:0 30px 60px -20px #000c,0 0 50px -12px #79eddc40}
.gx-service,.gx-scenario,.gx-values>article,.gx-controls>article,.process-grid>article{position:relative}

.cap-card{transition:border-color .3s,transform .3s,box-shadow .35s}
.cap-card .card-top svg{transition:transform .7s var(--wfx-ease),filter .4s,color .3s}
.cap-card:hover .card-top svg{transform:rotate(-12deg) scale(1.18);color:#c9fff4;filter:drop-shadow(0 0 10px #79eddc)}
.cap-card .card-top>span{transition:color .3s,letter-spacing .4s}
.cap-card:hover .card-top>span{color:#79eddc;letter-spacing:3px}
.cap-card h3{transition:color .3s}
.cap-card:hover h3{color:#dffcff}
.cap-card .card-arrow{transition:transform .45s var(--wfx-ease),color .3s}
.cap-card:hover .card-arrow{transform:translate(4px,-4px);color:#79eddc}
.cap-card .card-top,.cap-card h3,.cap-card .overline{transform:translateZ(28px)}

.team-card .portrait img{transition:transform .7s,filter .7s,box-shadow .5s}
.team-card:hover .portrait img{box-shadow:0 0 0 4px #0a1722,0 0 0 5px #79eddcaa,0 0 36px #79eddc55}
.team-card h2{transition:letter-spacing .5s var(--wfx-ease),color .3s}
.team-card:hover h2{letter-spacing:.5px;color:#e7fdff}

/* ---------- Buttons ---------- */
.button,.header-cta{position:relative;overflow:hidden;isolation:isolate}
.button:before,.header-cta:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,#ffffff55 48%,transparent 66%);transform:translateX(-120%);transition:none}
.button:hover:before,.header-cta:hover:before{transform:translateX(120%);transition:transform .85s var(--wfx-ease)}
.secondary:before,.header-cta:before{background:linear-gradient(115deg,transparent 30%,#79eddc33 48%,transparent 66%)}
.button svg,.header-cta svg{transition:transform .4s var(--wfx-ease)}
.button:hover svg,.header-cta:hover svg{transform:translate(3px,-3px)}
.button.primary:hover svg[viewBox]{transform:translateX(4px)}
.primary{box-shadow:0 0 0 #79eddc00;transition:background .25s,transform .25s,border-color .25s,box-shadow .4s}
.primary:hover{box-shadow:0 10px 36px -8px #79eddc88}

/* ---------- Services ---------- */
.service-nav a{position:relative;transition:color .3s,padding-left .4s var(--wfx-ease)}
.service-nav a:before{content:"";position:absolute;left:0;top:50%;width:0;height:1px;background:#79eddc;box-shadow:0 0 8px #79eddc;transition:width .4s var(--wfx-ease)}
.service-nav a[data-wfx-active]{color:#dffcff;padding-left:22px}
.service-nav a[data-wfx-active]:before{width:14px}
.service-nav a[data-wfx-active] span{color:#79eddc}
.service-detail .deliverables li{transition:transform .35s var(--wfx-ease),color .3s}
.service-detail .deliverables li:hover{transform:translateX(6px);color:#dffcff}
.service-detail .mini-plus{display:inline-block;transition:transform .5s var(--wfx-ease),color .3s}
.service-detail .deliverables li:hover .mini-plus{transform:rotate(90deg);color:#79eddc}
.process-grid>article{transition:transform .4s var(--wfx-ease)}
.process-grid>article>span{display:inline-block;transition:color .3s,transform .4s var(--wfx-ease)}
.process-grid>article:hover>span{transform:translateY(-3px);color:#c9fff4}

/* ---------- Resources ---------- */
.wfx-net{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;z-index:0}
.wfx-net line{stroke:#5fb6cf;stroke-width:1;stroke-dasharray:2 6;opacity:.35;vector-effect:non-scaling-stroke;transition:opacity .4s,stroke .4s}
.wfx-net line.p{stroke:#9ff3e6;stroke-width:2.5;stroke-dasharray:3 240;stroke-dashoffset:243;opacity:.55;stroke-linecap:round;animation:wfx-pulse 3.2s linear infinite}
.wfx-net line[data-on]{stroke:#79eddc;opacity:1}
.wfx-net line.p[data-on]{opacity:1;stroke:#c9fff4;filter:drop-shadow(0 0 3px #79eddc)}
@keyframes wfx-pulse{from{stroke-dashoffset:243}to{stroke-dashoffset:0}}
.network-visual .network-node,.network-visual .network-center{z-index:1}
.network-visual .network-node{transition:all .3s,translate .45s var(--wfx-ease)}
.network-node:hover{border-color:#79eddc;color:#dffcff;box-shadow:0 0 24px #79eddc30}
.network-center{transition:box-shadow .5s,transform .6s var(--wfx-ease)}
.network-visual:hover .network-center{box-shadow:0 0 90px #13a8b440,inset 0 0 30px #79eddc22}
.resource-list>button{position:relative;isolation:isolate}
.resource-list>button:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#79eddc14,transparent 70%);transform:scaleX(0);transform-origin:0 50%;transition:transform .55s var(--wfx-ease)}
.resource-list>button:hover:before,.resource-list>button.selected:before{transform:scaleX(1)}
.resource-list>button>svg{transition:transform .4s var(--wfx-ease),color .3s}
.resource-list>button:hover>svg{transform:translateX(6px);color:#79eddc}
.resource-list>button h3{transition:color .3s,transform .4s var(--wfx-ease)}
.resource-list>button:hover h3{color:#dffcff;transform:translateX(4px)}

/* ---------- Cases lock ---------- */
.lock-art:before,.lock-art:after{content:"";position:absolute;width:210px;height:210px;border-radius:50%;border:1px solid #79eddc;opacity:0;animation:wfx-sonar 4.8s cubic-bezier(.1,.6,.3,1) infinite;pointer-events:none}
.lock-art:after{animation-delay:2.4s}
.lock-art>svg{filter:drop-shadow(0 0 14px #79eddc55);animation:wfx-breathe 3.2s ease-in-out infinite alternate}
@keyframes wfx-breathe{from{filter:drop-shadow(0 0 6px #79eddc33)}to{filter:drop-shadow(0 0 22px #79eddc88)}}
.password-wrap{transition:border-color .3s,box-shadow .4s}
.password-wrap:focus-within{box-shadow:0 0 0 1px var(--cyan),0 0 32px #79eddc30}
@media (max-width:800px){.lock-art:before,.lock-art:after{width:150px;height:150px}}

/* ---------- Gears page ---------- */
.gx-faq-item{transition:border-color .3s,background .3s}
.gx-faq-item:hover{border-color:#79eddc66}
.gx-service,.gx-scenario{transition:border-color .3s,box-shadow .35s}

/* ---------- Contact strip ---------- */
.contact-strip{overflow:hidden;isolation:isolate}
.contact-strip:before{content:"";position:absolute;inset:-60% -10%;z-index:-1;pointer-events:none;
  background:conic-gradient(from 0deg at 85% 120%,transparent,#79eddc1a 20%,transparent 40%,#6ccaff14 60%,transparent 80%);animation:wfx-spin 18s linear infinite}
.contact-strip h2{background:linear-gradient(100deg,#edf5fb 40%,#9ff3e6 55%,#edf5fb 70%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:wfx-text-sweep 6s ease-in-out infinite}
@keyframes wfx-text-sweep{0%,30%{background-position:100% 0}70%,100%{background-position:0 0}}
.motion-off .contact-strip:before,.motion-off .contact-strip h2{animation:none!important}

/* ---------- Footer ---------- */
.footer-nav a{position:relative}
.footer-nav a:after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:1px;background:#79eddc;transform:scaleX(0);transform-origin:100% 50%;transition:transform .4s var(--wfx-ease)}
.footer-nav a:hover:after{transform:scaleX(1);transform-origin:0 50%}

/* ---------- Scramble labels ---------- */
.page-index,.coordinates{font-variant-numeric:tabular-nums}

/* ---------- Touch / small screens ---------- */
@media (max-width:800px){
  .wfx-top{right:16px;bottom:16px;width:46px;height:46px}
  .wfx-marquee{padding:30px 0 26px}
  .wfx-mq-row.b span{font-size:10px;letter-spacing:3px}
}
@media (hover:none){
  [data-wfx-tilt]:after,.wfx-sheen{display:none}
}

/* ---------- Reduced motion & motion-off: keep everything visible and calm ---------- */
@media (prefers-reduced-motion:reduce){
  html.wfx [data-wfx-r]{opacity:1!important;transform:none!important;filter:none!important}
  }
.motion-off ~ html.wfx-still [data-wfx-r]{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}
html.wfx-still 
/* ---------- Mobile menu ---------- */
.site .mobile-nav{background:#08121ef7;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);animation:wfx-menu .45s var(--wfx-ease) both}
.site .mobile-nav a{animation:wfx-rise .55s var(--wfx-ease) both}
.site .mobile-nav a:nth-child(2){animation-delay:.04s}.site .mobile-nav a:nth-child(3){animation-delay:.08s}.site .mobile-nav a:nth-child(4){animation-delay:.12s}
.site .mobile-nav a:nth-child(5){animation-delay:.16s}.site .mobile-nav a:nth-child(6){animation-delay:.2s}.site .mobile-nav a:nth-child(7){animation-delay:.24s}.site .mobile-nav a:nth-child(8){animation-delay:.28s}
@keyframes wfx-menu{from{opacity:0;transform:translateY(-10px) scale(.98)}to{opacity:1;transform:none}}
.motion-off .mobile-nav,.motion-off .mobile-nav a{animation:none!important}

/* ---------- Contact popup (opened by every “开启合作 / 联系 WaveCrest / 沟通” button) ---------- */
html.wfx-contact-open{overflow:hidden}
.wfx-contact{padding:0;border:0;background:transparent;color:#edf5fb;max-width:calc(100vw - 32px);width:420px;overflow:visible}
.wfx-contact::backdrop{background:#03080dcc;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.wfx-contact[open]{animation:wfx-pop-in .38s var(--wfx-ease)}
.wfx-contact[open]::backdrop{animation:wfx-fade .3s ease}
@keyframes wfx-pop-in{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}
.wfx-contact-panel{position:relative;border:1px solid #3c6572;background:radial-gradient(ellipse at 100% 0,#20697733,transparent 65%),#0a1622;padding:26px 24px 28px;box-shadow:0 30px 80px #000a,0 0 60px -20px #79eddc40}
.wfx-contact-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:22px}
.wfx-contact-head h2{font-size:22px;line-height:1.3;margin:0;font-weight:600}
.wfx-contact-head p{margin:6px 0 0;font-size:13px;color:#95a8b9;line-height:1.6}
.wfx-contact-close{flex:none;width:36px;height:36px;display:grid;place-items:center;background:transparent;border:1px solid #2c4757;color:#bdd7e5;transition:border-color .25s,color .25s}
.wfx-contact-close:hover{border-color:#79eddc;color:#fff}
.wfx-contact-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}
.wfx-contact-list{display:grid;gap:16px}
.wfx-contact-row{position:relative}
.wfx-contact-item{display:flex;align-items:center;gap:16px;min-height:64px;padding:10px 16px 10px 12px;background:#fff;color:#111;border-radius:6px;
  box-shadow:0 7px 0 #000;transition:transform .2s var(--wfx-ease),box-shadow .2s var(--wfx-ease),background .2s;text-decoration:none}
.wfx-contact-item:hover{transform:translateY(-2px);box-shadow:0 9px 0 #000,0 0 0 2px #79eddc}
.wfx-contact-item:active{transform:translateY(5px);box-shadow:0 2px 0 #000}
.wfx-contact-item:focus-visible{outline:2px solid #79eddc;outline-offset:3px}
.wfx-contact-icon{flex:none;width:44px;height:44px;display:grid;place-items:center}
.wfx-contact-icon svg{width:44px;height:44px;display:block}
.wfx-contact-icon.is-mail svg{width:40px;height:40px}
.wfx-contact-text{display:flex;flex-direction:column;min-width:0;line-height:1.3}
.wfx-contact-text b{font-size:17px;font-weight:700;letter-spacing:.5px}
.wfx-contact-text small{font-size:12px;color:#55656f;margin-top:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;user-select:all}
.wfx-contact-go{margin-left:auto;font-size:18px;color:#7b8a93;transition:transform .25s var(--wfx-ease),color .25s}
.wfx-contact-item:hover .wfx-contact-go{transform:translate(3px,-3px);color:#111}
.wfx-contact-row .wfx-contact-item{padding-right:84px}
.wfx-contact-copy{position:absolute;right:12px;top:50%;transform:translateY(-50%);padding:7px 12px;font-size:12px;font-weight:600;background:#eef4f6;color:#1d3b46;border:1px solid #c6d6dc;border-radius:4px;transition:background .2s,color .2s,border-color .2s}
.wfx-contact-copy:hover{background:#dff7f2;border-color:#79eddc}
.wfx-contact-copy[data-done]{background:#79eddc;color:#06231d;border-color:#79eddc}
@media (max-width:480px){.wfx-contact-panel{padding:22px 16px 24px}.wfx-contact-head h2{font-size:20px}.wfx-contact-text b{font-size:16px}}
html.wfx-still .wfx-contact[open],html.wfx-still .wfx-contact[open]::backdrop{animation:none}
@media (prefers-reduced-motion:reduce){.wfx-contact[open],.wfx-contact[open]::backdrop{animation:none}}