/* ============================================================
   Glass button system — drtyndall.com (2026-10-03)
   Restyles the site's existing Tailwind-classed buttons as frosted
   glass with a sheen sweep, lift and glow on hover. Targets the
   class strings already in the markup, so pages need no edits
   beyond loading this file last in <head>.
   ============================================================ */
:root{
  --gb-sheen-light:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.34) 46%,rgba(255,255,255,.10) 50%,transparent 56%);
  --gb-sheen-navy:linear-gradient(115deg,transparent 40%,rgba(10,77,140,.12) 46%,rgba(10,77,140,.04) 50%,transparent 56%);
}

/* ---- 1. Primary navy buttons: header Call Now, section CTAs, blog & News CTAs ---- */
a.bg-\[\#0a4d8c\]:not(.group){
  position:relative;isolation:isolate;overflow:hidden;
  background-color:rgba(10,77,140,.9);
  background-image:var(--gb-sheen-light);background-size:260% 100%;background-position:100% 0;background-repeat:no-repeat;
  border:1px solid rgba(255,255,255,.22);
  -webkit-backdrop-filter:blur(10px) saturate(140%);backdrop-filter:blur(10px) saturate(140%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 22px -8px rgba(10,77,140,.6);
  transition:background-position .7s ease,transform .22s ease,box-shadow .25s ease,background-color .2s ease,border-color .2s ease;
}
a.bg-\[\#0a4d8c\]:not(.group):hover,a.bg-\[\#0a4d8c\]:not(.group):focus-visible{
  background-color:rgba(8,61,112,.96);background-position:0 0;border-color:rgba(255,255,255,.42);
  transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 14px 30px -10px rgba(10,77,140,.65),0 0 0 4px rgba(10,77,140,.12);
}
a.bg-\[\#0a4d8c\]:not(.group):active{transform:translateY(0)}
a.bg-\[\#0a4d8c\]:not(.group) .fa-arrow-right{transition:transform .25s ease}
a.bg-\[\#0a4d8c\]:not(.group):hover .fa-arrow-right{transform:translateX(3px)}

/* ---- 2. Outline navy buttons on light backgrounds (About Same-Day Surgery, Patient Portal) ---- */
a.border-2.border-\[\#0a4d8c\]{
  position:relative;isolation:isolate;overflow:hidden;
  background-color:rgba(255,255,255,.55);
  background-image:var(--gb-sheen-navy);background-size:260% 100%;background-position:100% 0;background-repeat:no-repeat;
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-color:rgba(10,77,140,.55);
  box-shadow:inset 0 1px 0 #fff,0 6px 18px -10px rgba(10,77,140,.4);
  transition:background-position .7s ease,transform .22s ease,box-shadow .25s ease,border-color .2s ease,background-color .2s ease;
}
a.border-2.border-\[\#0a4d8c\]:hover,a.border-2.border-\[\#0a4d8c\]:focus-visible{
  background-color:rgba(255,255,255,.92);background-position:0 0;border-color:#0a4d8c;
  transform:translateY(-2px);box-shadow:inset 0 1px 0 #fff,0 12px 26px -12px rgba(10,77,140,.5);
}

/* ---- 3. Hero: white Call button (with a slow ambient sheen) + translucent Explore Procedures + As-seen badge ---- */
.hero-bg a.cta.bg-white{
  position:relative;isolation:isolate;overflow:hidden;
  background-color:rgba(255,255,255,.92);
  background-image:var(--gb-sheen-navy);background-size:260% 100%;background-position:100% 0;background-repeat:no-repeat;
  border:1px solid rgba(255,255,255,.9);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  box-shadow:inset 0 1px 0 #fff,0 14px 34px -12px rgba(0,0,0,.4);
  transition:background-position .7s ease,transform .22s ease,box-shadow .25s ease,background-color .2s ease;
}
.hero-bg a.cta.bg-white::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(115deg,transparent 40%,rgba(10,77,140,.12) 50%,transparent 60%);
  transform:translateX(-130%);animation:gbSweep 6.5s ease-in-out infinite;
}
.hero-bg a.cta.bg-white:hover,.hero-bg a.cta.bg-white:focus-visible{
  background-color:#fff;background-position:0 0;transform:translateY(-2px);
  box-shadow:inset 0 1px 0 #fff,0 18px 40px -12px rgba(0,0,0,.45),0 0 0 4px rgba(255,255,255,.18);
}
.hero-bg a[href="#procedures"]{
  position:relative;isolation:isolate;overflow:hidden;
  background-color:rgba(255,255,255,.10);
  background-image:var(--gb-sheen-light);background-size:260% 100%;background-position:100% 0;background-repeat:no-repeat;
  border-color:rgba(255,255,255,.38);
  -webkit-backdrop-filter:blur(12px) saturate(130%);backdrop-filter:blur(12px) saturate(130%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 10px 26px -14px rgba(0,0,0,.5);
  transition:background-position .7s ease,transform .22s ease,box-shadow .25s ease,background-color .2s ease,border-color .2s ease;
}
.hero-bg a[href="#procedures"]:hover,.hero-bg a[href="#procedures"]:focus-visible{
  background-color:rgba(255,255,255,.18);background-position:0 0;border-color:rgba(255,255,255,.8);
  transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 14px 30px -12px rgba(0,0,0,.55);
}
.hero-bg a[href="/in-the-news/"].self-start{
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.2);
  transition:background-color .2s ease,border-color .2s ease,transform .2s ease;
}
.hero-bg a[href="/in-the-news/"].self-start:hover{transform:translateY(-1px)}

/* ---- 4. Find Your Path option cards ---- */
.fp-opt{
  position:relative;isolation:isolate;overflow:hidden;
  background-color:rgba(255,255,255,.085);
  background-image:var(--gb-sheen-light);background-size:260% 100%;background-position:100% 0;background-repeat:no-repeat;
  border-color:rgba(255,255,255,.2);
  -webkit-backdrop-filter:blur(12px) saturate(130%);backdrop-filter:blur(12px) saturate(130%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 26px -14px rgba(0,21,42,.6);
  transition:transform .22s ease,border-color .22s ease,background-color .22s ease,background-position .75s ease,box-shadow .25s ease;
}
.fp-opt:hover,.fp-opt:focus-visible{
  background-color:rgba(255,255,255,.15);background-position:0 0;border-color:rgba(125,211,252,.75);
  transform:translateY(-3px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 18px 34px -14px rgba(0,21,42,.7),0 0 0 1px rgba(125,211,252,.25);
}
.fp-opt .fp-opt-arrow{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.18)}
.fp-opt:hover .fp-opt-arrow,.fp-opt:focus-visible .fp-opt-arrow{color:#0a4d8c;border-color:#fff}
.fp-opt:hover .fp-opt-arrow *,.fp-opt:focus-visible .fp-opt-arrow *{color:#0a4d8c;fill:currentColor;stroke:currentColor}

/* ---- 5. Ask Dr. Tyndall launcher: glass pill with a soft attention pulse ---- */
.adt-root .adt-launch{
  background:rgba(10,77,140,.9);
  border:1px solid rgba(255,255,255,.28);
  -webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 14px 34px -12px rgba(10,77,140,.7);
  transition:transform .25s ease,background .25s ease,box-shadow .25s ease,opacity .2s;
}
.adt-root .adt-launch:hover{background:rgba(8,61,112,.96);transform:translateY(-2px);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 18px 40px -12px rgba(10,77,140,.75)}
.adt-root .adt-launch::before{
  content:"";position:absolute;inset:-5px;border-radius:inherit;pointer-events:none;
  border:2px solid rgba(10,77,140,.5);animation:gbPulse 3.4s ease-out 2s infinite;
}

@keyframes gbSweep{0%,58%{transform:translateX(-130%)}82%,100%{transform:translateX(130%)}}
@keyframes gbPulse{0%{transform:scale(1);opacity:.75}70%,100%{transform:scale(1.22);opacity:0}}

@media(prefers-reduced-motion:reduce){
  a.bg-\[\#0a4d8c\]:not(.group),a.border-2.border-\[\#0a4d8c\],.hero-bg a.cta.bg-white,.hero-bg a[href="#procedures"],.fp-opt,.adt-root .adt-launch{transition:none}
  .hero-bg a.cta.bg-white::after,.adt-root .adt-launch::before{animation:none}
  a.bg-\[\#0a4d8c\]:not(.group):hover,a.border-2.border-\[\#0a4d8c\]:hover,.hero-bg a.cta.bg-white:hover,.hero-bg a[href="#procedures"]:hover,.fp-opt:hover,.adt-root .adt-launch:hover{transform:none}
}