/* Readability pass layered over the user's scenic Claymorphism design. */
:root{
  --clay-ink:#26344b;
  --clay-muted:#43546c;
  --clay-focus:#2457a6;
}
html[data-theme="dark"],html[data-theme="evening"]{
  --clay-ink:#f1f4f8;
  --clay-muted:#c7d2df;
  --clay-focus:#b8d2ff;
}
/* Keep hero metadata legible without hiding the character or scenery. */
body #main-content #hello .stats-row{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:10px!important;
  max-width:900px!important;
  margin:26px auto 0!important;
  padding:0!important;
  border:0!important;
}
body #main-content #hello .stats-row .stat-card{
  min-width:0!important;
  min-height:72px!important;
  padding:12px 10px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  border:1px solid color-mix(in srgb,var(--clay-ink) 15%,transparent)!important;
  border-radius:16px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.76),rgba(239,245,250,.72))!important;
  box-shadow:0 8px 16px -13px rgba(38,52,75,.32),inset 1px 1px 2px rgba(255,255,255,.88),inset -2px -3px 6px rgba(71,101,145,.10)!important;
}
html[data-theme="dark"] body #main-content #hello .stats-row .stat-card,
html[data-theme="evening"] body #main-content #hello .stats-row .stat-card{
  background:linear-gradient(145deg,rgba(37,54,75,.9),rgba(30,43,60,.92))!important;
  border-color:rgba(255,255,255,.17)!important;
}
body #main-content #hello .stats-row .stat-card+.stat-card{border-left:1px solid color-mix(in srgb,var(--clay-ink) 15%,transparent)!important;}
body #main-content #hello .stats-row .stat-card .num{
  color:var(--clay-ink)!important;-webkit-text-fill-color:var(--clay-ink)!important;
  font:700 clamp(1.15rem,2vw,1.55rem)/1 'IBM Plex Mono',monospace!important;
}
body #main-content #hello .stats-row .stat-card .label{
  color:var(--clay-muted)!important;-webkit-text-fill-color:var(--clay-muted)!important;
  margin-top:6px!important;font-size:clamp(.58rem,.82vw,.7rem)!important;
  font-weight:650!important;letter-spacing:.045em!important;line-height:1.25!important;
  text-align:center!important;max-width:15ch!important;
}
body #main-content #hello .hero-glass .lede{
  max-width:62ch!important;font-size:clamp(.96rem,1.18vw,1.08rem)!important;
  line-height:1.7!important;letter-spacing:.005em!important;
}
/* Pale clay cards use ink text, not inherited white text-fill from older theme layers. */
body #main-content :is(#yash-os .yash-os-item,#journey .journey-year-card,#journey .journey-milestones,#experience .exp-collection,#credentials .folio,#skills .skill-card,#skills .pursuing-card,#focus .glass-card,#contact .contact-pill) :is(h1,h2,h3,h4,h5,p,span,strong,em,small,li,label,.skill-level,.skill-desc,.status-tag,.card-skills span,.folio-num,.accordion-meta,.exp-role-date,.exp-role-org,.exp-collection-eyebrow,.exp-collection-preview,.exp-collection-count,.yash-os-label,.yash-os-state,.journey-year-number,.journey-year-meta,.journey-year-entry strong,.journey-year-entry p,.journey-story .tl-title,.journey-story .tl-date,.journey-story .tl-body,.journey-story .tl-body p){
  color:var(--clay-ink)!important;-webkit-text-fill-color:var(--clay-ink)!important;
  text-shadow:none!important;
}
body #main-content :is(#yash-os .yash-os-item,#journey .journey-year-card,#journey .journey-milestones,#experience .exp-collection,#credentials .folio,#skills .skill-card,#skills .pursuing-card,#focus .glass-card,#contact .contact-pill) :is(.muted,.subtle,.meta,.description,.skill-level,.exp-role-date,.exp-collection-preview,.exp-collection-count,.journey-year-meta,.journey-year-entry p,.journey-story .tl-date,.journey-story .tl-body,.journey-story .tl-body p){
  color:var(--clay-muted)!important;-webkit-text-fill-color:var(--clay-muted)!important;
}
body #main-content :is(#journey .journey-year-entry strong,#experience .exp-role-org,#experience .exp-collection-eyebrow,#credentials .folio-icon,#skills .skill-icon){
  color:var(--clay-focus)!important;-webkit-text-fill-color:var(--clay-focus)!important;
}
body #main-content #journey .journey-year-chevron{
  width:38px!important;height:38px!important;min-width:38px!important;
  border:2px solid color-mix(in srgb,var(--clay-focus) 35%,white)!important;
  background:linear-gradient(145deg,#fff,#dbeaff)!important;
  color:var(--clay-ink)!important;-webkit-text-fill-color:var(--clay-ink)!important;
  box-shadow:0 5px 12px -8px rgba(38,52,75,.55),inset 1px 1px 2px #fff,inset -2px -2px 4px rgba(71,101,145,.13)!important;
  font-size:24px!important;font-weight:700!important;
}
body #main-content #journey .journey-year-card[open] .journey-year-chevron{background:linear-gradient(145deg,#e4efff,#ccddfa)!important;}
body #main-content #journey .journey-story .tl-title{color:var(--clay-ink)!important;-webkit-text-fill-color:var(--clay-ink)!important;text-shadow:none!important;}
body #main-content #journey .journey-story .tl-date,body #main-content #journey .journey-story .tl-body,body #main-content #journey .journey-story .tl-body p{color:var(--clay-muted)!important;-webkit-text-fill-color:var(--clay-muted)!important;text-shadow:none!important;}
body #main-content #journey .journey-story .tl-chevron{display:grid!important;place-items:center!important;flex:0 0 38px!important;width:38px!important;height:38px!important;margin-left:8px!important;border:2px solid color-mix(in srgb,var(--clay-focus) 38%,white)!important;border-radius:50%!important;background:linear-gradient(145deg,#fff,#dbeaff)!important;color:var(--clay-ink)!important;-webkit-text-fill-color:var(--clay-ink)!important;box-shadow:0 5px 12px -8px rgba(38,52,75,.55),inset 1px 1px 2px #fff,inset -2px -2px 4px rgba(71,101,145,.13)!important;font:800 23px/1 Inter,sans-serif!important;}
body #main-content #journey .journey-story.open .tl-chevron{transform:rotate(45deg)!important;background:linear-gradient(145deg,#e4efff,#ccddfa)!important;}
/* Keep the opening header quiet; Journey and Credentials are omitted from its markup. */
body .topnav .brand{display:none!important;}
/* Current Focus sits on pastel clay: use the theme's ink, muted and focus tokens. */
body #main-content #focus #focus-container .focus-window,
body #main-content #focus #focus-container .focus-window strong,
body #main-content #focus #focus-container .focus-item .fi-value{color:var(--clay-ink)!important;-webkit-text-fill-color:var(--clay-ink)!important;text-shadow:none!important;}
body #main-content #focus #focus-container .focus-item .fi-label{color:var(--clay-focus)!important;-webkit-text-fill-color:var(--clay-focus)!important;text-shadow:none!important;}
body #main-content #focus #focus-container .focus-item .fi-desc{color:var(--clay-muted)!important;-webkit-text-fill-color:var(--clay-muted)!important;text-shadow:none!important;}
/* Give Skills tiles their own light/dark-aware clay face and defined edge. */
body #main-content #skills .skill-card{padding:20px!important;border:1px solid color-mix(in srgb,var(--clay-ink) 18%,var(--clay-edge))!important;border-radius:22px!important;background:linear-gradient(145deg,color-mix(in srgb,var(--clay-surface,var(--clay-sky)) 96%,var(--clay-highlight) 4%),color-mix(in srgb,var(--clay-surface,var(--clay-sky)) 91%,transparent))!important;box-shadow:0 12px 22px -17px var(--clay-drop),inset 1px 1px 2px var(--clay-highlight),inset -3px -4px 7px var(--clay-well)!important;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease!important;}
body #main-content #skills .skill-card h3,body #main-content #skills .skill-card p,body #main-content #skills .skill-card .skill-level{color:var(--clay-ink)!important;-webkit-text-fill-color:var(--clay-ink)!important;text-shadow:none!important;}
body #main-content #skills .skill-card .skill-level{display:inline-flex!important;width:max-content!important;margin-top:9px!important;padding:5px 10px!important;border:1px solid color-mix(in srgb,var(--clay-ink) 16%,var(--clay-edge))!important;border-radius:999px!important;background:color-mix(in srgb,var(--clay-highlight) 58%,var(--clay-surface,var(--clay-sky)))!important;font-weight:700!important;}
@media(hover:hover) and (pointer:fine){body #main-content #skills .skill-card:hover{transform:translateY(-2px)!important;border-color:color-mix(in srgb,var(--clay-focus) 36%,var(--clay-edge))!important;box-shadow:0 15px 24px -17px var(--clay-drop),inset 1px 1px 2px var(--clay-highlight),inset -3px -4px 7px var(--clay-well)!important;}}
#sen-stage .sen-stage-portrait img{transition:opacity .48s cubic-bezier(.2,.7,.2,1)!important;}
#main-content .section.bento-card{transition:opacity .38s ease,transform .38s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease!important;}
#journey .journey-year-card,#journey .journey-story,#experience .exp-collection,#credentials .folio,#skills .skill-card{transition-duration:.22s!important;}
@media(max-width:650px),(pointer:coarse){
  body #main-content #hello .wrap{padding-bottom:clamp(150px,19vh,174px)!important;}
  body #main-content #hello .hero-glass{max-width:520px!important;transform:translateY(-132px)!important;padding:12px 11px 10px!important;border-radius:22px!important;background:linear-gradient(180deg,rgba(24,43,65,.08),rgba(24,43,65,.22))!important;}
  body:not(.portfolio-scrolled) #dock-wrap,body:not(.portfolio-scrolled) #ai-orb,body:not(.portfolio-scrolled) #ai-nudge{visibility:hidden!important;opacity:0!important;pointer-events:none!important;}
  body #main-content #hello .hero-glass h1,body #main-content #hello .hero-glass h1 .dim,body #main-content #hello .hero-glass .lede{color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 1px 10px rgba(11,24,42,.8)!important;}
  body #main-content #hello .cta-row a{color:#fff!important;-webkit-text-fill-color:#fff!important;text-shadow:0 1px 7px rgba(11,24,42,.8)!important;}
  body #main-content #hello .hero-glass h1{font-size:clamp(3rem,10vw,3.5rem)!important;}
  body #main-content #hello .hero-glass .lede{max-width:46ch!important;margin-top:10px!important;font-size:.78rem!important;line-height:1.38!important;}
  body #main-content #hello .cta-row{margin-top:10px!important;gap:5px!important;}
  body #main-content #hello .cta-row a{padding:6px 8px!important;font-size:.62rem!important;}
  body #main-content #hello .stats-row{margin-top:11px!important;}
  body #main-content #hello .stats-row .stat-card{min-height:58px!important;padding:8px 6px!important;border-radius:14px!important;}
  body #main-content #hello .stats-row .stat-card .num{font-size:1.16rem!important;}
  body #main-content #hello .stats-row .stat-card .label{font-size:.62rem!important;max-width:18ch!important;}
  body #main-content #journey .journey-year-summary{grid-template-columns:68px minmax(0,1fr) 42px!important;gap:9px!important;padding:13px 12px!important;}
  body #main-content #journey .journey-year-chevron{width:38px!important;height:38px!important;min-width:38px!important;}
}
@media(prefers-reduced-motion:reduce){
  #sen-stage .sen-stage-portrait img,#main-content .section.bento-card,#journey .journey-year-card,#journey .journey-story,#experience .exp-collection,#credentials .folio,#skills .skill-card{transition:none!important;animation:none!important;}
}
/* The illustrated bottom navigation is part of the hero design: never hide it before scrolling. */
body:not(.portfolio-scrolled) #dock-wrap{visibility:visible!important;opacity:1!important;pointer-events:auto!important;transform:translateX(-50%) translateY(0)!important;}
/* Preserve expression cross-fades, but reduce large-area effects on phones and short laptop screens. */
@media(max-width:760px),(pointer:coarse),(max-height:820px){
  #sen-stage .sen-stage-portrait{filter:none!important;}
  #sen-stage .sen-stage-grid,#sen-stage .sen-stage-orbit,#sen-stage .sen-stage-noise{animation:none!important;}
  body .dock{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
  #main-content .section.bento-card :is(.glass-card,.folio,.skill-card,.exp-collection,.journey-year-card){backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
}


/* Reel-inspired Skills flip cards: user-triggered only, no extra assets or background work. */
#main-content #skills .skill-card.skill-flip-card{
  position:relative!important;min-height:224px!important;padding:0!important;overflow:hidden!important;
  perspective:1000px;transform-style:flat;
}
#main-content #skills .skill-flip-toggle{
  display:block;width:100%;min-height:224px;margin:0;padding:0;border:0;border-radius:inherit;
  background:transparent;color:inherit;text-align:left;cursor:pointer;appearance:none;-webkit-appearance:none;
  -webkit-tap-highlight-color:transparent;
}
#main-content #skills .skill-flip-inner{
  display:grid;min-height:224px;transform-style:preserve-3d;
  transition:transform .4s cubic-bezier(.22,.72,.24,1);
}
#main-content #skills .skill-flip-card[data-flipped="true"] .skill-flip-inner{transform:rotateY(180deg);}
#main-content #skills .skill-flip-face{
  grid-area:1/1;display:flex;min-width:0;min-height:224px;padding:20px;
  flex-direction:column;align-items:flex-start;justify-content:space-between;gap:12px;
  border-radius:inherit;backface-visibility:hidden;-webkit-backface-visibility:hidden;
  background:linear-gradient(145deg,
    color-mix(in srgb,var(--clay-surface,var(--clay-sky)) 96%,var(--clay-highlight) 4%),
    color-mix(in srgb,var(--clay-surface,var(--clay-sky)) 91%,transparent));
}
#main-content #skills .skill-flip-back{transform:rotateY(180deg);}
#main-content #skills .skill-flip-index{
  display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:30px;padding:0 9px;
  border:1px solid color-mix(in srgb,var(--clay-focus) 26%,var(--clay-edge));border-radius:999px;
  color:var(--clay-focus)!important;-webkit-text-fill-color:var(--clay-focus)!important;
  background:color-mix(in srgb,var(--clay-highlight) 56%,var(--clay-surface,var(--clay-sky)));
  font:700 .64rem/1 'IBM Plex Mono',monospace;letter-spacing:.08em;
}
#main-content #skills .skill-flip-front h3{
  width:100%;margin:auto 0 0!important;color:var(--clay-ink)!important;-webkit-text-fill-color:var(--clay-ink)!important;
  font:650 clamp(1.25rem,2vw,1.7rem)/1.18 Fraunces,Georgia,serif!important;letter-spacing:-.02em;
}
#main-content #skills .skill-flip-cue{
  display:flex;align-items:center;gap:7px;margin-top:10px;color:var(--clay-focus)!important;
  -webkit-text-fill-color:var(--clay-focus)!important;font:700 .62rem/1.35 'IBM Plex Mono',monospace;
  letter-spacing:.035em;text-transform:uppercase;
}
#main-content #skills .skill-flip-cue::after{content:'↻';font:700 .95rem/1 Inter,sans-serif;}
#main-content #skills .skill-flip-back-title{
  color:var(--clay-focus)!important;-webkit-text-fill-color:var(--clay-focus)!important;
  font:700 .66rem/1.2 'IBM Plex Mono',monospace;letter-spacing:.09em;text-transform:uppercase;
}
#main-content #skills .skill-flip-back .skill-level{
  display:inline-flex!important;width:max-content!important;max-width:100%;margin:0!important;padding:5px 10px!important;
  border:1px solid color-mix(in srgb,var(--clay-ink) 16%,var(--clay-edge))!important;border-radius:999px!important;
  background:color-mix(in srgb,var(--clay-highlight) 58%,var(--clay-surface,var(--clay-sky)))!important;
  color:var(--clay-ink)!important;-webkit-text-fill-color:var(--clay-ink)!important;
  font-size:.7rem!important;font-weight:700!important;line-height:1.25!important;
}
#main-content #skills .skill-flip-back .skill-desc{
  width:100%;margin:0!important;color:var(--clay-muted)!important;-webkit-text-fill-color:var(--clay-muted)!important;
  font-size:.8rem!important;line-height:1.52!important;
}
#main-content #skills .skill-flip-toggle:focus-visible{
  outline:3px solid var(--clay-focus)!important;outline-offset:-4px!important;border-radius:inherit;
}
#main-content #skills .skill-flip-image[hidden]{display:none!important;}
#main-content #skills .skill-flip-image{
  position:absolute!important;right:12px!important;bottom:12px!important;z-index:4!important;
  width:56px!important;height:56px!important;margin:0!important;padding:0!important;border-radius:12px!important;
}
#main-content #skills .skill-flip-image img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit;}
@media(max-width:760px),(pointer:coarse){
  #main-content #skills .skill-card.skill-flip-card,#main-content #skills .skill-flip-toggle,
  #main-content #skills .skill-flip-inner,#main-content #skills .skill-flip-face{min-height:210px!important;}
  #main-content #skills .skill-flip-face{padding:17px;}
}
@media(prefers-reduced-motion:reduce){
  #main-content #skills .skill-flip-inner{display:block;min-height:0!important;transform:none!important;transition:none!important;}
  #main-content #skills .skill-flip-face{display:none!important;min-height:210px!important;transform:none!important;backface-visibility:visible;-webkit-backface-visibility:visible;}
  #main-content #skills .skill-flip-toggle[aria-expanded="false"] .skill-flip-front,
  #main-content #skills .skill-flip-toggle[aria-expanded="true"] .skill-flip-back{display:flex!important;}
}
html.performance-lite #main-content #skills .skill-flip-inner{display:block;min-height:0!important;transform:none!important;transition:none!important;}
html.performance-lite #main-content #skills .skill-flip-face{display:none!important;min-height:210px!important;transform:none!important;backface-visibility:visible;-webkit-backface-visibility:visible;}
html.performance-lite #main-content #skills .skill-flip-toggle[aria-expanded="false"] .skill-flip-front,
html.performance-lite #main-content #skills .skill-flip-toggle[aria-expanded="true"] .skill-flip-back{display:flex!important;}

/* A single small wave when the hero is explored; the existing idle float remains unchanged. */
@keyframes portfolio-hello-wave{
  0%,100%{translate:0 0;rotate:0deg;}
  34%{translate:0 -7px;rotate:-4deg;}
  68%{translate:0 1px;rotate:3deg;}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  html:not(.performance-lite):has(#hello .hero-glass:hover) #sen-stage .sen-stage-character-sticker--wave,
  html:not(.performance-lite):has(#hello .hero-glass:focus-within) #sen-stage .sen-stage-character-sticker--wave{
    animation:sen-wave-sticker-float 5.4s ease-in-out infinite,portfolio-hello-wave .56s cubic-bezier(.22,.72,.24,1) 1 both!important;
  }
}
@media(hover:none) and (pointer:coarse) and (prefers-reduced-motion:no-preference){
  html:not(.performance-lite):has(#hello .hero-glass :is(a,button):active) #sen-stage .sen-stage-character-sticker--wave{
    animation:sen-wave-sticker-float 5.4s ease-in-out infinite,portfolio-hello-wave .56s cubic-bezier(.22,.72,.24,1) 1 both!important;
  }
}


/* REEL-INSPIRED LIQUID CTA — one primary action, reusing the existing peak pointer tracker. */
body #main-content #hello #hero-cta .liquid-cta{
  position:relative!important;isolation:isolate;overflow:hidden;transform-style:preserve-3d;
  min-height:48px!important;padding:13px 26px!important;border:1px solid rgba(255,255,255,.42)!important;border-radius:18px!important;
  background:
    radial-gradient(ellipse 100% 130% at 16% 0%,rgba(255,255,255,.22),transparent 55%),
    radial-gradient(ellipse 85% 110% at 100% 105%,color-mix(in srgb,var(--clay-action) 36%,transparent),transparent 65%),
    linear-gradient(145deg,#2b3445 0%,#151b27 48%,#090d15 100%)!important;
  color:#fbfcff!important;-webkit-text-fill-color:#fbfcff!important;
  box-shadow:0 12px 25px -14px rgba(8,15,27,.72),inset 1px 1px 1px rgba(255,255,255,.56),inset -3px -5px 8px rgba(0,0,0,.48)!important;
  transition:transform .28s cubic-bezier(.2,.75,.25,1),box-shadow .28s ease,border-color .24s ease!important;
  will-change:auto!important;
}
body #main-content #hello #hero-cta .liquid-cta .liquid-label{
  position:relative;z-index:2;color:#fbfcff!important;-webkit-text-fill-color:#fbfcff!important;
  text-shadow:0 1px 3px rgba(0,0,0,.38);
}
body #main-content #hello #hero-cta .liquid-cta.peak-tilt::before{
  z-index:0;inset:1px;border-radius:inherit;opacity:var(--peak-sheen,0);
  background:
    radial-gradient(ellipse 5.5rem 3.2rem at var(--peak-light-x,38%) var(--peak-light-y,12%),rgba(255,255,255,.88),transparent 74%),
    radial-gradient(ellipse 9rem 4.6rem at var(--peak-light-x,38%) var(--peak-light-y,12%),color-mix(in srgb,var(--clay-focus) 34%,transparent),transparent 78%);
  mix-blend-mode:screen;transition:opacity .24s ease;
}
body #main-content #hello #hero-cta .liquid-cta::after{
  content:"";position:absolute;z-index:1;top:-145%;left:-44%;width:66%;height:390%;
  border-radius:50%;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.08) 29%,rgba(255,255,255,.76) 48%,rgba(151,199,255,.34) 61%,transparent 100%);
  transform:translateX(-165%) rotate(24deg);
  transition:transform .68s cubic-bezier(.16,1,.3,1),opacity .16s ease;
}
@media(hover:hover) and (pointer:fine){
  body #main-content #hello #hero-cta .liquid-cta.peak-tilt:hover{
    transform:perspective(760px) rotateX(var(--peak-card-y,0deg)) rotateY(var(--peak-card-x,0deg)) translateY(-2px) scale(1.015)!important;
    border-color:rgba(255,255,255,.82)!important;
    box-shadow:0 20px 30px -18px rgba(7,15,29,.76),0 1px 0 rgba(255,255,255,.24) inset,inset 1px 1px 1px rgba(255,255,255,.48),inset -3px -5px 8px rgba(0,0,0,.5)!important;
  }
  body #main-content #hello #hero-cta .liquid-cta:hover::after,
  body #main-content #hello #hero-cta .liquid-cta:focus-visible::after{opacity:.96;transform:translateX(265%) rotate(24deg);}
}
body #main-content #hello #hero-cta .liquid-cta:active{
  transform:scale(.985)!important;border-color:rgba(255,255,255,.8)!important;
  box-shadow:0 5px 12px -9px rgba(7,15,29,.74),inset 1px 1px 2px rgba(255,255,255,.32),inset -3px -5px 9px rgba(0,0,0,.58)!important;
}
body #main-content #hello #hero-cta .liquid-cta:active::after{opacity:.9;transform:translateX(210%) rotate(24deg);transition-duration:.32s,.1s;}
body #main-content #hello #hero-cta .liquid-cta:focus-visible{outline:3px solid var(--clay-focus)!important;outline-offset:3px!important;}
@media(prefers-reduced-motion:reduce){
  body #main-content #hello #hero-cta .liquid-cta{transform:none!important;transition:none!important;}
  body #main-content #hello #hero-cta .liquid-cta::before,
  body #main-content #hello #hero-cta .liquid-cta::after{display:none!important;}
}
html.performance-lite body #main-content #hello #hero-cta .liquid-cta{transform:none!important;transition:none!important;will-change:auto!important;}
html.performance-lite body #main-content #hello #hero-cta .liquid-cta::before,
html.performance-lite body #main-content #hello #hero-cta .liquid-cta::after{display:none!important;}

/* Higher-specificity hover guards: these must also win while the pointer is over the CTA. */
@media(prefers-reduced-motion:reduce){
  body #main-content #hello #hero-cta .liquid-cta.peak-tilt:hover,
  body #main-content #hello #hero-cta .liquid-cta:active,
  body #main-content #hello #hero-cta .liquid-cta:focus-visible{transform:none!important;}
}
html.performance-lite body #main-content #hello #hero-cta .liquid-cta.peak-tilt:hover,
html.performance-lite body #main-content #hello #hero-cta .liquid-cta:active,
html.performance-lite body #main-content #hello #hero-cta .liquid-cta:focus-visible{transform:none!important;}


/* VENOM-INSPIRED FINISH: original symbiote-like gloss, not character artwork. */
body #main-content #hello #hero-cta .liquid-cta.venom-cta{
  border-color:rgba(225,240,250,.64)!important;
  background:
    radial-gradient(ellipse 78% 130% at 8% -8%,rgba(255,255,255,.25),transparent 58%),
    radial-gradient(ellipse 46% 95% at 100% 112%,rgba(167,205,226,.22),transparent 68%),
    linear-gradient(145deg,#050607 0%,#151a20 38%,#303943 51%,#0b0d11 78%,#040506 100%)!important;
  box-shadow:0 12px 26px -14px rgba(0,0,0,.84),0 0 13px rgba(197,226,242,.12),inset 1px 1px 1px rgba(255,255,255,.72),inset -3px -5px 9px rgba(0,0,0,.72)!important;
}
body #main-content #hello #hero-cta .liquid-cta.venom-cta .liquid-label{padding-inline:10px;letter-spacing:.012em;}
body #main-content #hello #hero-cta .liquid-cta.venom-cta .liquid-label::before,
body #main-content #hello #hero-cta .liquid-cta.venom-cta .liquid-label::after{
  content:"";position:absolute;top:50%;width:8px;height:12px;pointer-events:none;
  border-radius:88% 18% 78% 24%;
  background:linear-gradient(180deg,#fff 0%,rgba(223,240,250,.92) 48%,rgba(129,158,177,.62) 100%);
  box-shadow:0 0 8px rgba(217,239,251,.38);opacity:.9;
  transition:transform .24s cubic-bezier(.2,.75,.25,1),opacity .2s ease;
}
body #main-content #hello #hero-cta .liquid-cta.venom-cta .liquid-label::before{
  left:-14px;transform:translateY(-50%) rotate(25deg) skewY(-8deg);
}
body #main-content #hello #hero-cta .liquid-cta.venom-cta .liquid-label::after{
  right:-14px;transform:translateY(-50%) rotate(-25deg) skewY(8deg);
}
body #main-content #hello #hero-cta .liquid-cta.venom-cta.peak-tilt::before{
  background:
    radial-gradient(ellipse 5.5rem 3.2rem at var(--peak-light-x,38%) var(--peak-light-y,12%),rgba(255,255,255,.94),transparent 72%),
    radial-gradient(ellipse 9rem 4.6rem at var(--peak-light-x,38%) var(--peak-light-y,12%),rgba(172,213,235,.5),transparent 78%);
}
body #main-content #hello #hero-cta .liquid-cta.venom-cta::after{
  border-radius:62% 38% 72% 28%;
  background:
    radial-gradient(ellipse 56% 18% at 32% 42%,rgba(255,255,255,.88),transparent 78%),
    radial-gradient(ellipse 42% 15% at 69% 58%,rgba(197,226,243,.62),transparent 76%),
    linear-gradient(90deg,transparent 0%,rgba(232,246,255,.12) 30%,rgba(255,255,255,.9) 49%,rgba(168,204,223,.46) 62%,transparent 100%);
  clip-path:polygon(0 46%,15% 36%,31% 45%,49% 29%,65% 41%,83% 32%,100% 22%,91% 55%,74% 68%,57% 57%,40% 76%,24% 62%,10% 73%);
}
@media(hover:hover) and (pointer:fine){
  body #main-content #hello #hero-cta .liquid-cta.venom-cta:hover .liquid-label::before{
    transform:translateY(-50%) rotate(34deg) skewY(-11deg) scale(1.06,1.16);opacity:1;
  }
  body #main-content #hello #hero-cta .liquid-cta.venom-cta:hover .liquid-label::after{
    transform:translateY(-50%) rotate(-34deg) skewY(11deg) scale(1.06,1.16);opacity:1;
  }
}
body #main-content #hello #hero-cta .liquid-cta.venom-cta:active .liquid-label::before,
body #main-content #hello #hero-cta .liquid-cta.venom-cta:active .liquid-label::after{opacity:1;}
@media(prefers-reduced-motion:reduce){
  body #main-content #hello #hero-cta .liquid-cta.venom-cta .liquid-label::before,
  body #main-content #hello #hero-cta .liquid-cta.venom-cta .liquid-label::after{transition:none!important;}
}
html.performance-lite body #main-content #hello #hero-cta .liquid-cta.venom-cta .liquid-label::before,
html.performance-lite body #main-content #hello #hero-cta .liquid-cta.venom-cta .liquid-label::after{transition:none!important;}
