/* SELF ENTOURAGE — BACKGROUND GOVERNANCE V22
   2026-09-18
   Truth OS: one readable public surface system.
   Black Crown: no low-contrast text/background collisions.
   Neverloop: this stylesheet is appended last by contrast-runtime-v14.js.

   Rule:
   1) Ordinary public surfaces use the warm ivory/paper treatment from the approved homepage.
   2) Surfaces that intentionally carry light text are inverted to governed deep teal.
   3) Cards stay paper/white so content remains legible and visually separated.
*/

:root{
  --se-bg-ivory:#f6f2e8;
  --se-bg-paper:#fffdf8;
  --se-bg-white:#ffffff;
  --se-bg-ink:#10252d;
  --se-bg-ink-soft:#334b54;
  --se-bg-muted:#48616a;
  --se-bg-navy:#183e4a;
  --se-bg-navy-deep:#0b2933;
  --se-bg-navy-black:#071c24;
  --se-bg-gold:#d2a63b;
  --se-bg-red:#a83d37;
  --se-bg-line:#c2cdca;
  --se-bg-shadow:0 18px 46px rgba(16,37,45,.11);
  --se-bg-warm-gradient:
    radial-gradient(circle at 50% -12%,rgba(210,166,59,.16),transparent 32%),
    radial-gradient(circle at 88% 18%,rgba(168,61,55,.055),transparent 27%),
    linear-gradient(180deg,#fffdf9 0%,#f5f0e6 100%);
}

/* --------------------------------------------------------------------------
   ROOT + ORDINARY PUBLIC SURFACES
   -------------------------------------------------------------------------- */
html,
body,
body[data-se-page],
body[data-se-canonical-product="true"]{
  background:var(--se-bg-ivory)!important;
  color:var(--se-bg-ink)!important;
}

main,
#main-content{
  background:var(--se-bg-ivory)!important;
  color:var(--se-bg-ink)!important;
}

/* Every normal top-level content band gets the approved warm homepage field. */
main > section:not(.signal-band):not(.movement-banner),
main > .section,
.section,
.section.light-section,
.light-section,
.route-guide-section,
.funnel-close,
.catalog-controls{
  background:var(--se-bg-ivory)!important;
  color:var(--se-bg-ink)!important;
}

/* Heroes keep the exact premium warm treatment seen on the approved homepage. */
.page-hero,
.product-hero,
.hero,
main > section.page-hero,
main > section.product-hero{
  background:var(--se-bg-warm-gradient)!important;
  color:var(--se-bg-ink)!important;
  border-color:var(--se-bg-line)!important;
}

/* Keep light-surface typography dark and readable even when older layers disagree. */
main > section:not(.signal-band):not(.movement-banner) :is(h1,h2,h3,h4,h5,h6),
.catalog-controls :is(h1,h2,h3,h4,h5,h6),
.page-hero :is(h1,h2,h3,h4,h5,h6),
.product-hero :is(h1,h2,h3,h4,h5,h6){
  color:var(--se-bg-ink)!important;
}

main > section:not(.signal-band):not(.movement-banner) :is(p,li,dd,dt,label,figcaption),
.catalog-controls :is(p,li,dd,dt,label,figcaption),
.page-hero :is(p,li,dd,dt,label,figcaption),
.product-hero :is(p,li,dd,dt,label,figcaption){
  color:var(--se-bg-ink-soft)!important;
  opacity:1!important;
}

main > section:not(.signal-band):not(.movement-banner) .eyebrow,
.catalog-controls .eyebrow,
.page-hero .eyebrow,
.product-hero .eyebrow{
  color:var(--se-bg-navy)!important;
}

/* --------------------------------------------------------------------------
   PAPER / CARD SURFACES
   -------------------------------------------------------------------------- */
.hero-aside,
.feature-card,
.poster-pillar,
.number-card,
.contact-panel,
.funnel-proof,
.step-card,
.related-card,
.price-card,
.next-step,
.notice,
.decision-panel,
.route-guide-shell,
.directory-control-panel,
.catalog-section,
.catalog-card,
.catalog-empty,
.one-percent-panel,
.crown-callout,
.standards-grid > div,
.comparison-card,
.policy-card,
.trust-card,
.booking-card,
.membership-card,
.product-card,
.product-detail-card,
.detail-card,
.info-card,
.route-card,
.choice-card,
.result-card,
.panel,
.card{
  background:var(--se-bg-white)!important;
  color:var(--se-bg-ink)!important;
  border-color:var(--se-bg-line)!important;
}

.hero-aside :is(h1,h2,h3,h4,h5,h6,p,li),
.feature-card :is(h1,h2,h3,h4,h5,h6,p,li),
.poster-pillar :is(h1,h2,h3,h4,h5,h6,p,li),
.number-card :is(h1,h2,h3,h4,h5,h6,p,li),
.contact-panel :is(h1,h2,h3,h4,h5,h6,p,li),
.funnel-proof :is(h1,h2,h3,h4,h5,h6,p,li),
.step-card :is(h1,h2,h3,h4,h5,h6,p,li),
.related-card :is(h1,h2,h3,h4,h5,h6,p,li),
.price-card :is(h1,h2,h3,h4,h5,h6,p,li),
.next-step :is(h1,h2,h3,h4,h5,h6,p,li),
.notice :is(h1,h2,h3,h4,h5,h6,p,li),
.decision-panel :is(h1,h2,h3,h4,h5,h6,p,li),
.route-guide-shell :is(h1,h2,h3,h4,h5,h6,p,li),
.directory-control-panel :is(h1,h2,h3,h4,h5,h6,p,li),
.catalog-section :is(h1,h2,h3,h4,h5,h6,p,li),
.catalog-card :is(h1,h2,h3,h4,h5,h6,p,li),
.one-percent-panel :is(h1,h2,h3,h4,h5,h6,p,li),
.crown-callout :is(h1,h2,h3,h4,h5,h6,p,li),
.standards-grid > div :is(h1,h2,h3,h4,h5,h6,p,li),
.comparison-card :is(h1,h2,h3,h4,h5,h6,p,li),
.policy-card :is(h1,h2,h3,h4,h5,h6,p,li),
.trust-card :is(h1,h2,h3,h4,h5,h6,p,li),
.booking-card :is(h1,h2,h3,h4,h5,h6,p,li),
.membership-card :is(h1,h2,h3,h4,h5,h6,p,li),
.product-card :is(h1,h2,h3,h4,h5,h6,p,li),
.product-detail-card :is(h1,h2,h3,h4,h5,h6,p,li),
.detail-card :is(h1,h2,h3,h4,h5,h6,p,li),
.info-card :is(h1,h2,h3,h4,h5,h6,p,li),
.route-card :is(h1,h2,h3,h4,h5,h6,p,li),
.choice-card :is(h1,h2,h3,h4,h5,h6,p,li),
.result-card :is(h1,h2,h3,h4,h5,h6,p,li),
.panel :is(h1,h2,h3,h4,h5,h6,p,li),
.card :is(h1,h2,h3,h4,h5,h6,p,li){
  color:var(--se-bg-ink-soft)!important;
  opacity:1!important;
}

.hero-aside :is(h1,h2,h3,h4,h5,h6),
.feature-card :is(h1,h2,h3,h4,h5,h6),
.poster-pillar :is(h1,h2,h3,h4,h5,h6),
.number-card :is(h1,h2,h3,h4,h5,h6),
.funnel-proof :is(h1,h2,h3,h4,h5,h6),
.step-card :is(h1,h2,h3,h4,h5,h6),
.related-card :is(h1,h2,h3,h4,h5,h6),
.catalog-card :is(h1,h2,h3,h4,h5,h6),
.catalog-section :is(h1,h2,h3,h4,h5,h6),
.decision-panel :is(h1,h2,h3,h4,h5,h6),
.route-guide-shell :is(h1,h2,h3,h4,h5,h6),
.one-percent-panel :is(h1,h2,h3,h4,h5,h6),
.crown-callout :is(h1,h2,h3,h4,h5,h6),
.standards-grid > div :is(h1,h2,h3,h4,h5,h6),
.panel :is(h1,h2,h3,h4,h5,h6),
.card :is(h1,h2,h3,h4,h5,h6){
  color:var(--se-bg-ink)!important;
}

/* Form and control surfaces stay paper-light unless they intentionally belong to a dark overlay. */
main :is(input,select,textarea):not(.crown-butler-search){
  background:var(--se-bg-white)!important;
  color:var(--se-bg-ink)!important;
  border-color:#8fa2a6!important;
}
main :is(input,textarea):not(.crown-butler-search)::placeholder{
  color:#60767d!important;
  opacity:1!important;
}

/* --------------------------------------------------------------------------
   INVERTED SURFACES — WHEN THE COPY IS LIGHT, THE BACKGROUND FLIPS DARK
   -------------------------------------------------------------------------- */
.site-header,
.site-footer,
.signal-band,
.movement-banner,
.sticky-cta,
.se-route-dock-toggle,
.se-route-dock-panel,
.crown-butler-trigger,
.crown-butler-dialog,
main > section[class*="dark"],
main > section[class*="navy"],
main > section[class*="black"]{
  background:var(--se-bg-navy-deep)!important;
  color:#f7fbfc!important;
}

.signal-band,
.movement-banner,
.site-footer{
  border-color:rgba(255,255,255,.16)!important;
}

.signal-band :is(h1,h2,h3,h4,h5,h6,p,li,span,small,a),
.movement-banner :is(h1,h2,h3,h4,h5,h6,p,li,span,small,a),
.site-footer :is(h1,h2,h3,h4,h5,h6,p,li,span,small,a),
.sticky-cta :is(h1,h2,h3,h4,h5,h6,p,li,span,small,a),
.se-route-dock-toggle,
.se-route-dock-panel :is(h1,h2,h3,h4,h5,h6,p,li,span,small,a),
main > section[class*="dark"] :is(h1,h2,h3,h4,h5,h6,p,li,span,small,a),
main > section[class*="navy"] :is(h1,h2,h3,h4,h5,h6,p,li,span,small,a),
main > section[class*="black"] :is(h1,h2,h3,h4,h5,h6,p,li,span,small,a){
  color:#f3f7f8!important;
  opacity:1!important;
}

.signal-band :is(.eyebrow,strong),
.site-footer :is(.eyebrow,h4),
.se-route-dock-crown,
.se-route-dock-title span,
main > section[class*="dark"] .eyebrow,
main > section[class*="navy"] .eyebrow,
main > section[class*="black"] .eyebrow{
  color:#f4d477!important;
}

/* Crown Butler already uses the inverted rule; protect it from generic light-surface selectors. */
.crown-butler-dialog :is(h1,h2,h3,h4,h5,h6,.crown-butler-search-label,.crown-butler-result strong){
  color:#fff!important;
}
.crown-butler-dialog :is(p,li,.crown-butler-intro,.crown-butler-status,.crown-butler-result small,.crown-butler-route span,.crown-butler-foot){
  color:#d7e2e5!important;
}
.crown-butler-dialog :is(.crown-butler-kicker,.crown-butler-route strong,.crown-butler-result-price,.crown-butler-foot a){
  color:#f4d477!important;
}
.crown-butler-search{
  background:var(--se-bg-navy-black)!important;
  color:#fff!important;
  border-color:#466671!important;
}

/* Mobile menu is another intentional light-text surface. */
@media(max-width:980px){
  body[data-nav-open="true"] .site-header,
  body[data-nav-open="true"] .nav-links{
    background:var(--se-bg-navy-deep)!important;
    color:#fff!important;
  }
  body[data-nav-open="true"] .nav-links :is(a,button,span){
    color:#f7fbfc!important;
  }
}

/* --------------------------------------------------------------------------
   SMALL SURFACE DETAILS
   -------------------------------------------------------------------------- */
.hero-proof-row span,
.turnaround-badge,
.catalog-status,
.route-guide-privacy,
.badge,
.pill,
.chip{
  background:var(--se-bg-paper)!important;
  color:var(--se-bg-ink-soft)!important;
  border-color:var(--se-bg-line)!important;
}

.catalog-controls{
  border-color:var(--se-bg-line)!important;
  box-shadow:0 12px 30px rgba(16,37,45,.06)!important;
}

.catalog-search{
  box-shadow:none!important;
}

/* Buttons keep their hierarchy; secondary controls sit cleanly on the warm field. */
.btn-secondary:not(.crown-butler-dialog .btn-secondary),
.filter-button,
.choice-button,
.directory-filter-row button{
  background:var(--se-bg-white)!important;
  color:var(--se-bg-navy-deep)!important;
  border-color:#81979d!important;
}
.btn-ghost:not(.crown-butler-dialog .btn-ghost){
  color:var(--se-bg-navy-deep)!important;
}

/* Footer/header stay governed dark even if an older stylesheet arrives late. */
html body header.site-header,
html body footer.site-footer,
html body .site-footer{
  background:var(--se-bg-navy-deep)!important;
}

/* Print should remain simple and ink-efficient. */
@media print{
  html,body,main,#main-content,
  main > section,
  .section,
  .page-hero,
  .product-hero,
  .signal-band,
  .movement-banner{
    background:#fff!important;
    color:#111!important;
  }
  *{box-shadow:none!important;text-shadow:none!important}
}
