/* TC TOTs — continuous gradient visual system
   Keeps the page feeling like one connected canvas instead of stacked color bands. */
:root {
  --page-warm: #fffaf3;
  --page-mist: #f6fbf9;
  --page-aqua: #e4f3f2;
  --page-peach: #fff3ea;
}

html {
  background: var(--page-warm);
}

body {
  position: relative;
  isolation: isolate;
  background:
    radial-gradient(72rem 54rem at -8% 2%, rgba(255,203,69,.10) 0%, transparent 62%),
    radial-gradient(84rem 64rem at 108% 16%, rgba(111,183,190,.20) 0%, transparent 64%),
    radial-gradient(70rem 52rem at 4% 58%, rgba(255,214,190,.13) 0%, transparent 66%),
    radial-gradient(80rem 58rem at 102% 88%, rgba(169,214,210,.17) 0%, transparent 64%),
    linear-gradient(156deg, var(--page-warm) 0%, var(--page-mist) 28%, var(--page-aqua) 55%, var(--page-peach) 78%, #edf7f6 100%) !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

main,
#main-content {
  background: transparent !important;
}

/* Remove full-width hard color bands from the light sections. */
.hero,
.providers-hero,
.doctor-hero,
.intro,
.symptoms,
.approach,
.benefits,
.team,
.provider-feature,
.faq,
.contact,
.referral-signs,
.referral-process,
.provider-form-section,
.doctor-trust-band,
.about,
.clinical-learning,
.family-trust,
.choice,
.conditions,
.philosophy,
.section:not(.pillars):not(.home-training-trust):not(.provider-collab):not(.verified-training),
.section-sm:not(.faq),
.section-tight {
  background: transparent !important;
  background-color: transparent !important;
}

/* Eliminate decorative shapes that read like isolated background blocks. */
.benefits::before,
.hero::after,
.providers-hero::after,
.doctor-hero::after {
  display: none !important;
}

/* Keep decorative aqua forms, but make them diffuse and integrated. */
.hero::before,
.providers-hero::before,
.doctor-hero::before {
  opacity: .12 !important;
  filter: blur(26px) !important;
  background: radial-gradient(circle at center, rgba(111,183,190,.74) 0%, rgba(111,183,190,.28) 44%, transparent 72%) !important;
  transform: none !important;
}

/* Dark storytelling areas become contained glass panels instead of full-width sections. */
.pillars,
.home-training-trust,
.provider-collab,
.verified-training {
  background: transparent !important;
  background-color: transparent !important;
  overflow: visible !important;
}

.pillars > .container,
.home-training-trust > .container,
.provider-collab > .container,
.verified-training > .container {
  position: relative;
  overflow: hidden;
  padding: clamp(46px, 6vw, 76px) clamp(28px, 5vw, 62px);
  border: 1px solid rgba(255,255,255,.16);
  border-radius: clamp(34px, 5vw, 58px);
  background:
    radial-gradient(circle at 10% 18%, rgba(111,183,190,.18), transparent 31%),
    radial-gradient(circle at 91% 82%, rgba(255,104,90,.12), transparent 28%),
    linear-gradient(145deg, rgba(15,78,92,.98) 0%, rgba(10,61,73,.96) 100%) !important;
  box-shadow: 0 28px 72px rgba(15,78,92,.18);
}

.pillars::before,
.pillars::after,
.home-training-trust::before,
.home-training-trust::after,
.provider-collab::before,
.provider-collab::after,
.verified-training::before,
.verified-training::after {
  display: none !important;
}

/* Light cards remain readable while allowing the page gradient to show through. */
.card,
.contact-card,
.quick-form-shell,
.faq details,
.family-trust-card,
.provider-learning-card,
.clinical-flow-card,
.referral-card,
.process-card,
.provider-form-wrap,
.team-air-story,
.team-side-panel:not(.team-side-panel--dark),
.about-panel,
.choice-card,
.condition-card,
.philosophy-step {
  background: rgba(255,255,255,.88) !important;
  border-color: rgba(15,78,92,.10) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

/* Navigation becomes part of the same gradient canvas. */
nav {
  background: rgba(255,250,243,.82) !important;
  border-bottom-color: rgba(15,78,92,.07) !important;
  backdrop-filter: blur(22px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(22px) saturate(1.08) !important;
}

/* Center the main TC TOTs hero mark optically on every page. */
.hero-brand-lockup,
.hero-brand-center {
  width: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-inline: auto !important;
  text-align: center !important;
}

.hero-brand-lockup .hero-logo,
.hero-brand-center .hero-logo,
.hero-logo {
  display: block !important;
  width: clamp(245px, 22vw, 360px) !important;
  max-width: min(78vw, 360px) !important;
  height: auto !important;
  margin: 0 auto 28px !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
}

/* The home hero logo sits inside the text column; center that column as one unit. */
.hero-copy {
  align-items: center;
}

.hero-copy .hero-brand-lockup {
  min-height: 0 !important;
  padding: 0 !important;
}

/* Softer hero composition with no visible left/right color split. */
.hero,
.providers-hero,
.doctor-hero {
  background:
    radial-gradient(50rem 34rem at 88% 18%, rgba(111,183,190,.14), transparent 72%),
    radial-gradient(36rem 30rem at 10% 18%, rgba(255,214,190,.10), transparent 72%),
    transparent !important;
}

/* Remove the former solid yellow circle on the doctor hero. */
.doctor-hero .yellow-circle,
.doctor-hero .sun-circle,
.doctor-hero [class*="yellow-circle"],
.doctor-hero [class*="sun-circle"] {
  display: none !important;
}

/* Portrait stage also uses a blended background rather than a geometric split. */
.hero-portrait-stage {
  background:
    radial-gradient(circle at 25% 78%, rgba(255,214,190,.22) 0%, transparent 32%),
    radial-gradient(circle at 76% 18%, rgba(111,183,190,.24) 0%, transparent 46%),
    linear-gradient(150deg, rgba(255,255,255,.96), rgba(224,243,242,.88)) !important;
}

@media (max-width: 900px) {
  body { background-attachment: scroll !important; }
  .pillars > .container,
  .home-training-trust > .container,
  .provider-collab > .container,
  .verified-training > .container {
    width: min(94vw, 1200px);
  }
  .hero-brand-lockup .hero-logo,
  .hero-brand-center .hero-logo,
  .hero-logo {
    width: min(320px, 72vw) !important;
    max-width: 72vw !important;
    margin-bottom: 22px !important;
  }
}

@media (max-width: 680px) {
  .pillars > .container,
  .home-training-trust > .container,
  .provider-collab > .container,
  .verified-training > .container {
    width: min(92vw, 1200px);
    padding: 40px 24px;
    border-radius: 34px;
  }
  .hero-brand-lockup .hero-logo,
  .hero-brand-center .hero-logo,
  .hero-logo {
    width: min(280px, 76vw) !important;
    max-width: 76vw !important;
    margin-bottom: 18px !important;
  }
}
