/* =========================================
   Apple-like CLEAR Liquid Glass Button
   Use class: btn-glass-ios
   ========================================= */

:root{
  /* Core “glassiness” controls */
  --ios-blur: 24px;         /* stronger blur for real glass feel */
  --ios-sat: 170%;          /* more “wet” saturation */
  --ios-contrast: 1.06;     /* slight punch for the backdrop */
  --ios-bg-top: rgba(255,255,255,.22);
  --ios-bg-bot: rgba(255,255,255,.10);

  /* Rim + gloss */
  --ios-rim: rgba(255,255,255,.55);
  --ios-rim-soft: rgba(255,255,255,.25);
  --ios-sheen: rgba(255,255,255,.85);

  /* Optional very light blue edge (Apple-ish) */
  --ios-fringe-1: rgba(60,140,255,.18);
  --ios-fringe-2: rgba(255,120,180,.12);

  /* Text */
  --ios-text: #0d2b6d;  /* deep ink blue on bright backgrounds */
}

.btn-glass-ios,
.nectar-button.btn-glass-ios {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 28px;
  border-radius: 999px;
  line-height: 1;
  font-weight: 700;
  text-decoration: none !important;
  color: var(--ios-text) !important;

  /* The visible “glass” coat: keep it LIGHT */
  background:
    linear-gradient(180deg, var(--ios-bg-top), var(--ios-bg-bot));
  border: 1px solid rgba(255,255,255,.35);

  /* Real glass feel comes from backdrop, not foreground tint */
  -webkit-backdrop-filter: blur(var(--ios-blur)) saturate(var(--ios-sat)) contrast(var(--ios-contrast));
  backdrop-filter: blur(var(--ios-blur)) saturate(var(--ios-sat)) contrast(var(--ios-contrast));

  /* Edge + slight dispersion */
  box-shadow:
    inset 0 1px 0 var(--ios-rim),                 /* top inner rim */
    inset 0 -10px 20px rgba(0,0,0,.18),           /* inner depth */
    0 10px 26px rgba(0,0,0,.18),                  /* drop */
    0 0 0 1px var(--ios-fringe-1),                /* blue fringe */
    0 0 0 2px var(--ios-fringe-2);                /* rose fringe */
  overflow: hidden;
  isolation: isolate;
}

/* Dedicated layer to bend what’s BEHIND the button */
.btn-glass-ios::after{
  content:"";
  position:absolute; inset:0;
  /* very faint caustic shapes that move on hover */
  background:
    radial-gradient(35% 25% at 30% 28%, rgba(255,255,255,.55) 0 40%, transparent 60%),
    radial-gradient(28% 20% at 70% 70%, rgba(255,255,255,.35) 0 45%, transparent 65%);
  mix-blend-mode: screen;
  opacity:.35;
  pointer-events:none;

  /* This applies the “refraction” bend */
  filter: url(#ios-refraction);
  transition: transform .6s ease;
  transform: translate3d(-6%, 8%, 0) rotate(14deg);
}

/* Curved skeuomorphic gloss on the top cap */
.btn-glass-ios::before{
  content:"";
  position:absolute;
  inset:-40% -30% 55% -30%;
  background:
    radial-gradient(120% 140% at 50% 110%, transparent 52%, var(--ios-sheen) 68%, transparent 80%);
  mix-blend-mode: screen;
  filter: blur(1px);
  pointer-events:none;
  opacity:.85;
}

/* Hover micro-motion like iOS */
.btn-glass-ios:hover::after{ transform: translate3d(6%, -8%, 0) rotate(14deg); }
.btn-glass-ios:hover{ transform: translateY(-1px); }
.btn-glass-ios:active{ transform: translateY(0); }

/* Make sure Salient/Nectar doesn’t override text color */
.nectar-button.btn-glass-ios .link_wrap,
.nectar-button.btn-glass-ios span{ color: inherit !important; }

/* Accessibility focus */
.btn-glass-ios:focus-visible{
  outline: 2px solid rgba(255,255,255,.9);
  outline-offset: 2px;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .btn-glass-ios, .btn-glass-ios::after{ transition:none !important; }
}

.btn-liquid-glass {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 34px;
  border-radius: 999px;
  font-weight: 600;
  color: #fff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,.25);

  /* Core glassy feel */
  -webkit-backdrop-filter: blur(20px) saturate(160%) contrast(1.1);
  backdrop-filter: blur(20px) saturate(160%) contrast(1.1);
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.35);

  /* Refraction (this bends what's behind) */
  filter: url(#liquid-distort);

  /* Depth + subtle glow */
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.6),
    inset 0 -6px 12px rgba(0,0,0,.2),
    0 6px 20px rgba(0,0,0,.25);
  overflow: hidden;
}

/* Curved glossy highlight */
.btn-liquid-glass::before {
  content:"";
  position:absolute; inset:0;
  border-radius: inherit;
  background: radial-gradient(ellipse at 50% -30%, rgba(255,255,255,.7), transparent 70%);
  opacity:.8;
  mix-blend-mode: screen;
  pointer-events:none;
}

/* Moving caustic shimmer */
.btn-liquid-glass::after {
  content:"";
  position:absolute; inset:-30% -50%;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.6), transparent 60%);
  opacity:.4;
  transform: rotate(20deg) translate(0,0);
  transition: transform 1s ease;
  mix-blend-mode: screen;
  pointer-events:none;
}
.btn-liquid-glass:hover::after {
  transform: rotate(20deg) translate(10%, -10%);
}

/* ==========================================
   Premium Addons-style LIQUID GLASS button
   Usage: add class "pa-liquid-btn" to any button/link
   ========================================== */

:root{
  --pa-blur: 26px;             /* backdrop blur strength */
  --pa-sat: 170%;              /* wet/saturated look */
  --pa-contrast: 1.06;
  --pa-bg-top: rgba(255,255,255,.20);  /* keep light so it's CLEAR, not milky */
  --pa-bg-bot: rgba(255,255,255,.08);
  --pa-text: #0b2f7a;          /* deep ink blue for contrast on bright bkgs */
  --pa-rim: rgba(255,255,255,.55);
  --pa-sheen: rgba(255,255,255,.85);
  --pa-dispersionA: rgba(70,140,255,.18);  /* subtle blue rim */
  --pa-dispersionB: rgba(255,120,180,.12); /* subtle rose rim */
}

.pa-liquid-btn,
.nectar-button.pa-liquid-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 36px;
  border-radius: 999px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none!important;
  color: var(--pa-text)!important;

  /* This slight tint + backdrop makes the glass visible but clear */
  background: linear-gradient(180deg, var(--pa-bg-top), var(--pa-bg-bot));
  border: 1px solid rgba(255,255,255,.35);

  /* Real “glass” comes from the BACKDROP, not foreground color */
  -webkit-backdrop-filter: blur(var(--pa-blur)) saturate(var(--pa-sat)) contrast(var(--pa-contrast));
  backdrop-filter: blur(var(--pa-blur)) saturate(var(--pa-sat)) contrast(var(--pa-contrast));

  /* Refraction: bend what's behind */
  filter: url(#pa-liquid-glass);

  /* Depth + a hint of chromatic rim like iOS */
  box-shadow:
    inset 0 1px 0 var(--pa-rim),
    inset 0 -10px 20px rgba(0,0,0,.18),
    0 10px 26px rgba(0,0,0,.18),
    0 0 0 1px var(--pa-dispersionA),
    0 0 0 2px var(--pa-dispersionB);

  overflow: hidden;
  isolation: isolate;
  transition: transform .15s ease;
}

.pa-liquid-btn:hover { transform: translateY(-1px); }
.pa-liquid-btn:active { transform: translateY(0); }

/* Curved skeuomorphic gloss on top cap */
.pa-liquid-btn::before{
  content:"";
  position:absolute;
  inset:-42% -30% 56% -30%;
  border-radius: inherit;
  background:
    radial-gradient(120% 140% at 50% 110%, transparent 52%, var(--pa-sheen) 68%, transparent 82%);
  mix-blend-mode: screen;
  filter: blur(1px);
  opacity:.85;
  pointer-events:none;
}

/* Moving caustic shimmer (matches the refraction motion) */
.pa-liquid-btn::after{
  content:"";
  position:absolute; inset:-25% -35%;
  border-radius:inherit;
  background:
    radial-gradient(32% 26% at 32% 30%, rgba(255,255,255,.55) 0 42%, transparent 65%),
    radial-gradient(26% 20% at 68% 70%, rgba(255,255,255,.4) 0 38%, transparent 62%);
  mix-blend-mode: screen;
  opacity:.35;
  pointer-events:none;
  animation: paLiquidPan 8s ease-in-out infinite alternate;
}

@keyframes paLiquidPan {
  0%   { transform: translate3d(-6%, 8%, 0) rotate(16deg); }
  100% { transform: translate3d(8%, -10%, 0) rotate(16deg); }
}

/* Ensure Salient/Nectar doesn't override text colour */
.nectar-button.pa-liquid-btn .link_wrap,
.nectar-button.pa-liquid-btn span { color: inherit!important; }

/* Focus ring */
.pa-liquid-btn:focus-visible{
  outline: 2px solid rgba(255,255,255,.9);
  outline-offset: 2px;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .pa-liquid-btn::after { animation: none; }
}

/* ==========================================
   Premium Addons-style LIQUID GLASS button
   Usage: add class "pa-liquid-btn" to any button/link
   ========================================== */

:root{
  --pa-blur: 26px;             /* backdrop blur strength */
  --pa-sat: 170%;              /* wet/saturated look */
  --pa-contrast: 1.06;
  --pa-bg-top: rgba(255,255,255,.20);  /* keep light so it's CLEAR, not milky */
  --pa-bg-bot: rgba(255,255,255,.08);
  --pa-text: #0b2f7a;          /* deep ink blue for contrast on bright bkgs */
  --pa-rim: rgba(255,255,255,.55);
  --pa-sheen: rgba(255,255,255,.85);
  --pa-dispersionA: rgba(70,140,255,.18);  /* subtle blue rim */
  --pa-dispersionB: rgba(255,120,180,.12); /* subtle rose rim */
}

.pa-liquid-btn,
.nectar-button.pa-liquid-btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 36px;
  border-radius: 999px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none!important;
  color: var(--pa-text)!important;

  /* This slight tint + backdrop makes the glass visible but clear */
  background: linear-gradient(180deg, var(--pa-bg-top), var(--pa-bg-bot));
  border: 1px solid rgba(255,255,255,.35);

  /* Real “glass” comes from the BACKDROP, not foreground color */
  -webkit-backdrop-filter: blur(var(--pa-blur)) saturate(var(--pa-sat)) contrast(var(--pa-contrast));
  backdrop-filter: blur(var(--pa-blur)) saturate(var(--pa-sat)) contrast(var(--pa-contrast));

  /* Refraction: bend what's behind */
  filter: url(#pa-liquid-glass);

  /* Depth + a hint of chromatic rim like iOS */
  box-shadow:
    inset 0 1px 0 var(--pa-rim),
    inset 0 -10px 20px rgba(0,0,0,.18),
    0 10px 26px rgba(0,0,0,.18),
    0 0 0 1px var(--pa-dispersionA),
    0 0 0 2px var(--pa-dispersionB);

  overflow: hidden;
  isolation: isolate;
  transition: transform .15s ease;
}

.pa-liquid-btn:hover { transform: translateY(-1px); }
.pa-liquid-btn:active { transform: translateY(0); }

/* Curved skeuomorphic gloss on top cap */
.pa-liquid-btn::before{
  content:"";
  position:absolute;
  inset:-42% -30% 56% -30%;
  border-radius: inherit;
  background:
    radial-gradient(120% 140% at 50% 110%, transparent 52%, var(--pa-sheen) 68%, transparent 82%);
  mix-blend-mode: screen;
  filter: blur(1px);
  opacity:.85;
  pointer-events:none;
}

/* Moving caustic shimmer (matches the refraction motion) */
.pa-liquid-btn::after{
  content:"";
  position:absolute; inset:-25% -35%;
  border-radius:inherit;
  background:
    radial-gradient(32% 26% at 32% 30%, rgba(255,255,255,.55) 0 42%, transparent 65%),
    radial-gradient(26% 20% at 68% 70%, rgba(255,255,255,.4) 0 38%, transparent 62%);
  mix-blend-mode: screen;
  opacity:.35;
  pointer-events:none;
  animation: paLiquidPan 8s ease-in-out infinite alternate;
}

@keyframes paLiquidPan {
  0%   { transform: translate3d(-6%, 8%, 0) rotate(16deg); }
  100% { transform: translate3d(8%, -10%, 0) rotate(16deg); }
}

/* Ensure Salient/Nectar doesn't override text colour */
.nectar-button.pa-liquid-btn .link_wrap,
.nectar-button.pa-liquid-btn span { color: inherit!important; }

/* Focus ring */
.pa-liquid-btn:focus-visible{
  outline: 2px solid rgba(255,255,255,.9);
  outline-offset: 2px;
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  .pa-liquid-btn::after { animation: none; }
}

/* Change team member name colour ONLY on the single profile pages */
.single-team_member .team-member h4 {
  color: #000000 !important; /* Black */
}

/* Change team member position/job title colour on single profile pages */
.single-team_member .team-member .position {
  color: #333333 !important; /* Dark grey, optional */
}

/* Team member name inside modal popup */
.mfp-wrap .mfp-content .team-member h4,
.mfp-wrap .mfp-content .team-member h3,
.mfp-wrap .mfp-content .team-member h2,
.mfp-wrap .mfp-content .team-member h1 {
  color: #000000 !important; /* Force black */
}

/* Optional: job title/position inside modal */
.mfp-wrap .mfp-content .team-member .position {
  color: #333333 !important; /* Dark grey */
}

/* Optional: bio/description text inside modal */
.mfp-wrap .mfp-content .team-member .team-meta {
  color: #444444 !important; /* Softer body text */
}