:root{
  --pp-ink: rgba(245,248,255,.90);
  --pp-ink2: rgba(245,248,255,.66);
  --pp-line: rgba(245,248,255,.16);
  --pp-glass: rgba(14,18,28,.42);
}

/* Remove teal bullets / dots / accents globally (but keep hover states) */
[class*="dot" i],
[class*="teal" i],
[style*="#33cccc" i],
[style*="33cccc" i]{
  background: transparent !important;
  color: inherit !important;
  border-color: rgba(255,255,255,.14) !important;
  box-shadow: none !important;
}
.hero .kicker .dot, .kicker .dot, .kicker::before{ display:none !important; }

/* ---------- Top brand lockup ---------- */
header .brand, header .logo, header .mark, header .pp-brand{
  display:flex !important;
  align-items:center !important;
  gap:.70rem !important;
}
header img, header .brand img, header .logo img{
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.55) !important;
  filter: saturate(1.05) contrast(1.05);
}
header .brand-title, header .title, header h1, header strong{
  letter-spacing:.14em !important;
  text-transform: uppercase !important;
}
header .brand-subtitle, header .subtitle, header small{
  letter-spacing:.22em !important;
  opacity:.72 !important;
}

/* ---------- Hero panel: less “generic window”, more gallery ---------- */
.hero, .hero-card, .panel, .shell{
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  box-shadow: 0 40px 120px rgba(0,0,0,.55) !important;
  backdrop-filter: blur(14px) !important;
  -webkit-backdrop-filter: blur(14px) !important;
}
.hero::before, .hero-card::before, .panel::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background: radial-gradient(900px 420px at 30% 30%, rgba(255,255,255,.06), transparent 60%);
  mix-blend-mode: screen;
  opacity:.55;
}

/* Headline + copy polish */
.hero h1, .hero .headline{
  letter-spacing:.02em !important;
}
.hero p, .hero .subhead{
  color: rgba(245,248,255,.72) !important;
}

/* Buttons: cleaner, upscale */
.hero .btn, .hero a.button, .hero button{
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(14,18,28,.35) !important;
  box-shadow: 0 18px 46px rgba(0,0,0,.45) !important;
}
.hero .btn.primary, .hero a.primary, .hero button.primary{
  background: linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04)) !important;
}

/* ---------- Signature spine: luxury signature treatment ---------- */
.spine{
  width: 44px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;

  position:absolute !important;
  left: 18px !important;
  top: 22px !important;
  bottom: 22px !important;

  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:space-between !important;
  padding: 0 !important;
}
.spine::before{
  content:"";
  position:absolute;
  left:50%;
  top: 46px;
  bottom: 64px;
  width:1px;
  transform:translateX(-50%);
  background: linear-gradient(180deg, rgba(255,255,255,0), var(--pp-line), rgba(255,255,255,0));
  opacity:.95;
  pointer-events:none;
}
/* logo “seal” placement: centered near bottom */
.spine img{
  width: 22px !important;
  height: 22px !important;
  border-radius: 11px !important;
  object-fit: cover !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.60) !important;
  opacity: .96 !important;
  margin: 0 0 4px 0 !important;
}
/* wrappers: no boxes */
.spine .mark, .spine .logo, .spine .brand{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
/* signature text */
.spine .sig,
.spine .signature,
.spine .spine-text,
.spine .label,
.spine p,
.spine span{
  writing-mode: vertical-rl !important;
  transform: rotate(180deg) !important;
  font-family: "Snell Roundhand","Segoe Script","Apple Chancery","Lucida Handwriting","Brush Script MT",cursive !important;
  font-weight: 500 !important;
  font-size: 14px !important;
  letter-spacing: .16em !important;
  text-transform: none !important;
  color: var(--pp-ink) !important;
  opacity: .88 !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.35) !important;
  line-height: 1.05 !important;
}
.spine .sig::after,
.spine .signature::after,
.spine .spine-text::after,
.spine .label::after{
  content:"";
  display:block;
  width: 14px;
  height: 1px;
  margin: 10px auto 0 auto;
  background: linear-gradient(90deg, rgba(255,255,255,0), var(--pp-line), rgba(255,255,255,0));
  opacity:.95;
}
/* add a refined second line if you have multiple spans */
.spine .muted, .spine small{
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial !important;
  font-size: 11px !important;
  letter-spacing: .24em !important;
  text-transform: uppercase !important;
  opacity: .55 !important;
  color: var(--pp-ink2) !important;
}
