/* ============================================================
   HARMONIA — GLOBAL CLEAN CSS + NEUROTOXINS PAGE
   Paste into Appearance > Customize > Additional CSS
   ============================================================ */

/* -------------------------
   0) Brand tokens + font
------------------------- */
:root{
  --harmonia-ink:#2f4f4f;
  --harmonia-text-soft:#7a6454;
  --harmonia-teal:#1f8a8a;
  --harmonia-gold:#B68C62;
  --harmonia-gold-light:#e5c7a3;
  --harmonia-sand:#f7f0e7;
  --harmonia-sand-soft:#fbf6f0;
  --harmonia-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* -------------------------
   1) Global base
------------------------- */
html,
body{
  min-height:100%;
  color:var(--harmonia-ink);
  font-family:var(--harmonia-font);
  background:transparent !important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(
    145deg,
    #2f4f4f 0%,
    #355757 25%,
    #3f6767 50%,
    #6f7f74 78%,
    #b68c62 100%
  );
  background-size:cover;
  background-repeat:no-repeat;
}

#page,
.site,
.site-content,
.site-content-contain,
.site-main,
.entry-content,
#primary,
main,
.wp-block-group.has-background,
.wp-block-cover{
  background:transparent !important;
}

body,
body *{
  font-family:var(--harmonia-font) !important;
}

/* -------------------------
   2) Buttons
------------------------- */
a.hero-cta,
.hero-cta,
.hero-cta-primary,
.hero-cta-secondary,
.wp-block-button__link,
a.wp-element-button,
button.wp-element-button,
button.button,
a.button,
input[type="submit"],
input[type="button"],
input[type="reset"]{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  padding:0.9rem 2.4rem !important;
  border-radius:999px !important;
  font-size:0.95rem !important;
  font-weight:600 !important;
  letter-spacing:0.16em !important;
  text-transform:uppercase !important;
  color:#fff !important;
  background:linear-gradient(120deg,var(--harmonia-gold),var(--harmonia-gold-light)) !important;
  border:none !important;
  text-decoration:none !important;
  opacity:1 !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  -webkit-text-fill-color:#fff !important;
  box-shadow:
    0 14px 30px rgba(0,0,0,0.28),
    0 0 0 1px rgba(255,255,255,0.70) !important;
  transition:transform .2s ease, box-shadow .2s ease, background .2s ease !important;
}

a.hero-cta:hover,
.hero-cta:hover,
.hero-cta-primary:hover,
.hero-cta-secondary:hover,
.wp-block-button__link:hover,
a.wp-element-button:hover,
button.wp-element-button:hover,
button.button:hover,
a.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover{
  background:linear-gradient(120deg,#c69667,#eed1aa) !important;
  transform:translateY(-1px) !important;
  box-shadow:
    0 18px 40px rgba(0,0,0,0.32),
    0 0 0 1px rgba(255,255,255,0.90) !important;
}

.hero-cta-row,
.nt-final-cta{
  display:flex !important;
  justify-content:center !important;
  flex-wrap:wrap;
  gap:0.9rem;
}

/* -------------------------
   3) Glass cards / tiles
------------------------- */
.glass-tile,
.nt-box,
.area-card-inner,
.icon-card,
.hx-card,
.service-card,
.nt-expect-card,
.step,
.sk-brand-card,
.sk-icon-card,
.wte-card,
.nt-faq,
.nt-intro-card,
.nt-result-card{
  border-radius:1.5rem;
  padding:1.7rem;
  background:
    radial-gradient(circle at top left,
      rgba(255,255,255,0.95),
      rgba(252,244,234,0.96)
    );
  box-shadow:
    0 18px 40px rgba(0,0,0,0.14),
    0 0 0 1px rgba(255,255,255,0.9);
  backdrop-filter:blur(14px);
  color:var(--harmonia-ink);
}

.glass-tile p,
.nt-box p,
.area-card-text,
.nt-final-text,
.nt-hero-text,
.nt-intro-card p,
.icon-card p,
.nt-expect-card p,
.step p,
.nt-faq p,
.centered-tile p,
.nt-result-copy p{
  font-size:0.98rem;
  line-height:1.75;
  color:var(--harmonia-text-soft);
}

/* -------------------------
   4) Headings
------------------------- */
.lux-h2,
.nt-section-heading,
.section-title,
.cherry-section-title,
.cherry-steps-title,
h2.has-text-align-center{
  font-weight:600;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:#cfa774 !important;
  background:none !important;
  -webkit-text-fill-color:#cfa774 !important;
  text-shadow:0 2px 6px rgba(0,0,0,0.35);
  margin-top:0;
  margin-bottom:1.75rem;
}

.nt-subheading,
.icon-card h3,
.nt-expect-card h3,
.nt-result-copy h3{
  color:var(--harmonia-ink);
  font-weight:600;
}

/* -------------------------
   5) Hero layout
------------------------- */
.harmonia-hero,
.nt-hero{
  padding:7.5rem 1.5rem 4.5rem;
  background:transparent !important;
  margin-top:0 !important;
}

.harmonia-hero-inner{
  max-width:1440px;
  margin:0 auto;
  border-radius:2.2rem;
  padding:2.4rem 2.6rem 2.6rem;
  background:rgba(255,255,255,0.08);
  backdrop-filter:blur(12px);
  border:1px solid rgba(255,255,255,0.10);
  box-shadow:
    0 28px 60px rgba(0,0,0,0.35),
    0 0 0 1px rgba(255,255,255,0.16);
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);
  gap:2.4rem;
  align-items:center;
}

.harmonia-hero-media{
  width:100%;
}

.hero-video-frame,
.nt-hero-image-frame{
  position:relative;
  width:100%;
  border-radius:1.9rem;
  overflow:hidden;
  background:#000;
  box-shadow:0 24px 60px rgba(0,0,0,0.35);
}

.hero-video-frame::before,
.nt-hero-image-frame::before{
  content:"";
  display:block;
  padding-top:60%;
}

.hero-video-frame video,
.nt-hero-image-frame img{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center !important;
  display:block !important;
}

.hero-video-frame video{
  opacity:0;
  transition:opacity 1s ease-in-out;
}

.hero-video-frame video.is-ready{
  opacity:1;
}

.harmonia-hero-content{
  max-width:540px;
  margin-left:auto;
}

.hero-eyebrow{
  text-transform:uppercase;
  letter-spacing:0.24em;
  font-size:0.78rem;
  margin:0 0 0.8rem;
  color:#ead9c5;
}

.nt-hero-title{
  font-size:clamp(2.4rem,1.9rem + 1.8vw,3.3rem) !important;
  line-height:1.08 !important;
  font-weight:600 !important;
  margin:0 0 0.9rem !important;
  color:#fff !important;
  background:none !important;
  -webkit-text-fill-color:#fff !important;
  text-shadow:0 8px 24px rgba(0,0,0,0.28);
}

.nt-hero-title span{
  color:#f0d2ab !important;
  -webkit-text-fill-color:#f0d2ab !important;
}

.nt-hero-sub{
  margin:0 0 1.8rem !important;
  font-size:1rem !important;
  line-height:1.75 !important;
  color:rgba(255,255,255,0.88) !important;
  background:none !important;
  -webkit-text-fill-color:rgba(255,255,255,0.88) !important;
}

@media (max-width:1024px){
  .harmonia-hero-inner{
    grid-template-columns:1fr;
    padding:2rem 1.8rem 2.3rem;
  }

  .harmonia-hero-content{
    max-width:100%;
    margin:1.4rem auto 0;
  }
}

@media (max-width:640px){
  .harmonia-hero,
  .nt-hero{
    padding:8.5rem 1.1rem 3.5rem;
  }

  .hero-cta-row{
    flex-direction:column;
  }

  a.hero-cta,
  .hero-cta{
    width:100%;
  }
}

/* -------------------------
   6) Neurotoxins page sections
------------------------- */
.nt-section{
  padding:1rem 1.5rem 3.5rem;
}

.nt-section-inner{
  max-width:1200px;
  margin:0 auto;
}

.nt-section-heading.center,
.nt-final,
.nt-expect-section .nt-section-heading{
  text-align:center;
}

.nt-intro-card{
  max-width:820px;
  margin:0 auto;
}

.nt-intro-card p{
  margin:0 0 0.85rem;
}

.nt-intro-card p:last-child{
  margin-bottom:0;
}

.nt-subheading{
  margin-top:1.1rem;
  margin-bottom:0.75rem;
  font-size:1.1rem;
}

.nt-final-text.center{
  text-align:center;
}

/* -------------------------
   7) Grids
------------------------- */
.nt-icon-grid,
.nt-expect-grid,
.nt-steps,
.nt-area-grid,
.sk-brand-grid,
.sk-icon-grid,
.wte-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:1.6rem;
  max-width:1200px;
  margin:0 auto;
}

@media (max-width:960px){
  .nt-icon-grid,
  .nt-expect-grid,
  .nt-steps,
  .nt-area-grid,
  .sk-brand-grid,
  .sk-icon-grid,
  .wte-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media (max-width:640px){
  .nt-icon-grid,
  .nt-expect-grid,
  .nt-steps,
  .nt-area-grid,
  .sk-brand-grid,
  .sk-icon-grid,
  .wte-grid{
    grid-template-columns:1fr;
  }
}

.icon-card,
.nt-expect-card{
  text-align:center;
}

.icon-card svg,
.nt-expect-card svg{
  display:block;
  margin:0 auto 12px;
}

.icon-card h3,
.nt-expect-card h3{
  margin:0 0 0.45rem;
  font-size:1.05rem;
}

.icon-card p,
.nt-expect-card p{
  margin:0;
  font-size:0.94rem;
  line-height:1.65;
}

/* -------------------------
   8) Before / After cards
------------------------- */
.nt-results-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1.6rem;
  max-width:980px;
  margin:0 auto;
}

@media (max-width:640px){
  .nt-results-grid{
    grid-template-columns:1fr;
  }
}

.nt-result-card{
  overflow:hidden;
  padding:0;
  display:flex;
  flex-direction:column;
}

.nt-result-img{
  display:block;
  width:100%;
  height:320px;
  object-fit:cover;
  object-position:center;
}

.nt-result-copy{
  padding:1.2rem 1.25rem 1.35rem;
  display:flex;
  flex-direction:column;
  gap:0.65rem;
  flex:1;
}

.nt-result-copy h3{
  margin:0 0 0.4rem;
  font-size:1.05rem;
}

.nt-result-copy p{
  margin:0;
  font-size:0.94rem;
  line-height:1.65;
}

.nt-result-copy p strong{
  color:var(--harmonia-ink);
}

/* -------------------------
   9) Final CTA
------------------------- */
.nt-final-inner{
  text-align:center;
}

.nt-final-text{
  max-width:640px;
  margin:0.5rem auto 1.8rem;
  font-size:0.98rem;
  line-height:1.7;
  color:var(--harmonia-text-soft);
}

.nt-final-cta .hero-cta-primary{
  min-width:230px;
}

/* -------------------------
   10) Utility / WP fixes
------------------------- */
body{
  padding-top:0 !important;
}

#wpadminbar #adminbarsearch,
#wpadminbar .adminbar-button{
  display:none !important;
}