@import url('/site/visual-system-v1.css');

/*
 * Shadow OS Learn — Visual System v1 adapter
 * Visual-only layer for the frozen Learn family.
 * Content, information architecture, analytics, routes, and CTA destinations stay untouched.
 */

html{background:#F5EFE5!important;color-scheme:light!important}
body{background:#F5EFE5!important;color:#11110F!important;font-family:'Cormorant Garamond',Georgia,serif!important}
.grain{display:none!important}

/* Type system */
body :where(h1,h2,h3,h4,.logo,.wordmark,.card-t,.rc-t,.cc-h,.learn-capsule h2,.final-cta h2){
  font-family:'Cormorant Garamond',Georgia,serif!important;
  color:#11110F!important;
  font-weight:400!important;
}
body :where(.nav-tab,.hd-nav,.hd-stores,.crumbs,.eyebrow,.faq-label,.related-label,.sources-label,.sec-label,.path-label,.more-label,.ctx-cta,.attrib){
  font-family:'Inter',Arial,sans-serif!important;
}
body :where(.eyebrow,.faq-label,.related-label,.sec-label,.path-label){color:#B78758!important}
body :where(.crumbs,.crumbs a,.hero-p,.hero-p2,.sec-intro,.card-d,.rc-d,.qa p,.term,.stack span,.cc-sub,.cc-note,.sources,.sources li,.attrib,.more-d,.final-sub){color:#6F695F!important}
body :where(article,p,.answer,.spine p){color:#2E2B27}

/* Header — keep the existing Learn structure, change only the visual language. */
.site-header,body>header{
  background:#F5EFE5!important;
  border-bottom:1px solid rgba(38,35,31,.34)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.logo,.wordmark,.nav-tab,.hd-nav a,.hd-stores a{color:#11110F!important}
.nav-tab-gold{
  background:#B78758!important;
  color:#F7EFE3!important;
  border-radius:2px!important;
  box-shadow:none!important;
}
.nav-store,.hd-stores a{color:#6F695F!important;border-bottom-color:rgba(38,35,31,.34)!important}
.nav-store:hover,.hd-stores a:hover{color:#11110F!important;border-bottom-color:#B78758!important}

/* Editorial canvas and rules */
.page,.wrap,.groups,.more{background:transparent!important}
.answer,.spine{border-left-color:#B78758!important}
.spine p{color:#795537!important}
.faq-block,.sources,.related,.group,.path-strip,.final-cta,footer{
  border-color:rgba(38,35,31,.34)!important;
}

/* Retire the old dark-card visual language without changing markup. */
.stack,.term,.cta-card,.qa,.rcard,.learn-capsule,.ctx-cta,.more-grid a,.groups .card{
  background:transparent!important;
  background-image:none!important;
  border-color:rgba(38,35,31,.34)!important;
  border-radius:0!important;
  box-shadow:none!important;
}
.stack,.term,.cta-card,.qa,.learn-capsule{
  border-left:0!important;
  border-right:0!important;
}
.rcard:hover,.groups .card:hover,.more-grid a:hover{
  border-color:#B78758!important;
  box-shadow:none!important;
  transform:none!important;
}
.rc-t,.card-t,.qa h3,.term b{color:#11110F!important}
.card-a{color:#B78758!important}

/* Index-only bands: one continuous ivory editorial canvas. */
.path-strip,.final-cta{
  background:transparent!important;
  background-image:none!important;
}
.hero::before{display:none!important}
.path-steps .n{
  background:transparent!important;
  color:#B78758!important;
  border:1px solid rgba(183,135,88,.5)!important;
}
.path-steps a{color:#11110F!important}
.final-cta h2,.final-cta h2 em{color:#11110F!important}

/* CTA system. Official store badges remain official black/multicolor. */
.btn-store:not(.badge),.nav-tab-gold{
  background:#B78758!important;
  color:#F7EFE3!important;
  border:1px solid #B78758!important;
  border-radius:2px!important;
  box-shadow:none!important;
}
.btn-store:not(.badge):hover{
  background:#A87950!important;
  border-color:#A87950!important;
  box-shadow:none!important;
}
.badge{
  background:#000!important;
  color:#fff!important;
  border-color:#8A7F71!important;
  box-shadow:none!important;
}
.badge .b-top,.badge .b-bot{color:#fff!important}

/* The legacy mini-cast strip is inline-styled; override it deliberately. */
.cast-strip{
  background:transparent!important;
  color:#11110F!important;
  border-radius:0!important;
  border-top:1px solid rgba(38,35,31,.55)!important;
  border-bottom:1px solid rgba(38,35,31,.55)!important;
  padding:32px 0!important;
}
.cast-strip>div:first-child{color:#B78758!important;font-family:'Inter',Arial,sans-serif!important}
.cast-strip>div:nth-child(2){color:#11110F!important;font-family:'Cormorant Garamond',Georgia,serif!important;font-size:32px!important}
.cast-strip>div:nth-child(3){color:#6F695F!important;font-family:'Inter',Arial,sans-serif!important}
.cast-strip a{
  border-radius:2px!important;
  font-family:'Inter',Arial,sans-serif!important;
  box-shadow:none!important;
}
.cast-strip a:first-child{background:#B78758!important;color:#F7EFE3!important}
.cast-strip a:last-child{background:transparent!important;color:#795537!important;border-color:#B78758!important}

/* Mobile sticky download bar becomes an ivory utility strip. */
.sticky-cta{
  background:rgba(245,239,229,.97)!important;
  border-top:1px solid rgba(38,35,31,.34)!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}

/* Fine interactions: no glow / glass / SaaS lift. */
a:focus-visible{outline:2px solid #B78758!important;outline-offset:3px!important}
body :where(.card,.rcard,.qa,.cta-card,.term,.stack){transition:border-color .16s ease!important}

@media(max-width:700px){
  body{font-size:18px!important}
  .page{padding-left:20px!important;padding-right:20px!important}
  h1{font-size:clamp(40px,11vw,50px)!important;line-height:1.02!important}
  h2{font-size:clamp(34px,9vw,42px)!important;line-height:1.05!important}
  .answer{font-size:19px!important}
  .cast-strip{margin-left:20px!important;margin-right:20px!important}
}