/* ===== page banner ===== */
.page-banner{
  position:relative;overflow:hidden;
  background:linear-gradient(120deg,var(--ink),var(--teal-dark));
  color:var(--mint);padding:70px 0 56px;
}
.page-banner .eyebrow{color:var(--gold);}
.page-banner h1{font-size:clamp(2.2rem,4.5vw,3.2rem);margin-top:8px;color:var(--white);}
.page-banner .crumb{margin-top:14px;font-size:0.85rem;color:rgba(239,246,243,0.65);}
.page-banner .crumb a{color:var(--gold);}
.page-banner .crumb span{margin:0 6px;}
.banner-sweep{
  position:absolute;top:0;left:-30%;width:40%;height:100%;
  background:linear-gradient(120deg,transparent, rgba(242,200,121,0.12), transparent);
  animation:bannerSweep 5s ease-in-out infinite;
}
@keyframes bannerSweep{
  0%{left:-30%;} 50%{left:110%;} 100%{left:110%;}
}

.nav a.active{color:var(--coral);font-weight:700;}

/* ===== intro split ===== */
.thyroid-intro{padding:100px 0;}
.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.intro-copy p{color:#3c5254;margin:16px 0;max-width:480px;}

/* ===== intro visual — multi-image photo collage ===== */
.intro-visual{display:flex;justify-content:center;}
.thyroid-photo-frame{
  position:relative;width:320px;height:340px;
  display:flex;align-items:center;justify-content:center;
}
.thyroid-photo-frame img{object-fit:cover;box-shadow:var(--shadow);}

.frame-main{
  width:72%;height:72%;border-radius:24px;border:6px solid var(--white);
  animation:frameFloat 5s ease-in-out infinite;z-index:2;
}
.frame-accent{position:absolute;border-radius:16px;border:4px solid var(--white);z-index:3;}
.a1{width:36%;height:34%;top:-2%;right:-4%;animation:frameFloat 4.2s ease-in-out infinite .4s;}
.a2{width:32%;height:30%;bottom:-4%;left:-6%;animation:frameFloat 4.8s ease-in-out infinite .9s;}
@keyframes frameFloat{0%,100%{transform:translateY(0) rotate(0);}50%{transform:translateY(-12px) rotate(1deg);}}

.thyroid-photo-frame .ring{position:absolute;border-radius:50%;border:1px dashed var(--teal);opacity:0.4;}
.ring.r1{width:100%;height:88%;animation:orbit 14s linear infinite;}
.ring.r2{width:86%;height:74%;opacity:0.25;animation:orbit 20s linear infinite reverse;}
@keyframes orbit{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}

.thyroid-photo-frame .tag{
  position:absolute;font-family:var(--font-mono);font-size:0.7rem;color:var(--white);
  background:var(--coral);padding:5px 11px;border-radius:999px;z-index:4;
  animation:tagFloat 3.6s ease-in-out infinite;
}
.tag-t3{top:4%;left:4%;animation-delay:0s;}
.tag-t4{top:40%;right:-6%;animation-delay:.5s;}
.tag-tsh{bottom:2%;left:34%;animation-delay:1s;}
@keyframes tagFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}}

/* ===== continuous shimmer heading ===== */
.text-shimmer{
  background:linear-gradient(90deg,var(--ink) 0%, var(--teal) 25%, var(--gold) 50%, var(--teal) 75%, var(--ink) 100%);
  background-size:220% auto;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  animation:shimmer 6s linear infinite;
}
@keyframes shimmer{to{background-position:-220% center;}}

/* ===== scrolling facts ticker ===== */
.fact-ticker{background:var(--ink);overflow:hidden;padding:16px 0;}
.fact-ticker .ticker-track{display:flex;width:max-content;animation:tickerScroll 20s linear infinite;}
.fact-ticker:hover .ticker-track{animation-play-state:paused;}
@keyframes tickerScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}
.fact-ticker .ticker-item{
  display:flex;align-items:center;gap:10px;flex:none;
  padding:0 32px;font-family:var(--font-mono);font-size:0.82rem;color:var(--mint);white-space:nowrap;
}
.fact-ticker .dot{width:6px;height:6px;border-radius:50%;background:var(--gold);}

/* ===== professional image gallery — aligned 3-column grid ===== */
.gallery{padding:100px 0;background:var(--mint);}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:230px;gap:20px;}
.gallery-item{position:relative;border-radius:14px;overflow:hidden;box-shadow:var(--shadow);}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;}
.gallery-item:hover img{transform:scale(1.08);}
.gallery-overlay{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(14,92,86,0.55);color:var(--white);font-weight:600;letter-spacing:0.04em;
  opacity:0;transform:translateY(10px);transition:opacity .35s ease, transform .35s ease;
}
.gallery-item:hover .gallery-overlay{opacity:1;transform:translateY(0);}

/* ===== features ===== */
.thyroid-features{background:var(--teal-dark);}
.section-title.light{color:var(--white);}
.thyroid-features .eyebrow{color:var(--gold);}
.feature-anim{
  border-radius:16px;padding:20px;
  transition:transform .35s ease, background .35s ease;
}
.feature-anim:hover{
  background:rgba(255,255,255,0.06);
  transform:translateY(-8px);
}
.feature-anim .feature-num{
  display:inline-block;transition:transform .35s ease;
}
.feature-anim:hover .feature-num{transform:rotate(-10deg) scale(1.15);color:var(--coral);}

/* ===== treatment cards (shared with skin page) ===== */
.treat-card{text-align:left;}
.treat-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:52px;height:52px;border-radius:14px;background:var(--white);
  font-size:1.5rem;margin-bottom:16px;transition:transform .35s ease;
}
.treat-card:hover .treat-icon{transform:rotate(-8deg) scale(1.1);}

@media (max-width:900px){
  .intro-grid{grid-template-columns:1fr;}
  .intro-visual{order:-1;}
  .gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:190px;}
}
@media (max-width:560px){
  .gallery-grid{grid-template-columns:1fr;}
}
@media (prefers-reduced-motion: reduce){
  .thyroid-photo-frame img,.thyroid-photo-frame .ring,.thyroid-photo-frame .tag,.text-shimmer,.banner-sweep,.fact-ticker .ticker-track{animation:none!important;}
}