/* RelationshipsIQ — final website composition layer
   Loaded after all legacy/page CSS. The canonical color tokens live in palette-lock.css.
   This file owns hierarchy, spacing, component geometry, responsive behavior and motion only. */

:root{
  --section-space:clamp(4.5rem,8vw,8.5rem);
  --section-space-compact:clamp(2.8rem,5vw,5rem);
  --shell:max(1180px,min(calc(100vw - (var(--gutter) * 2)),1320px));
  --ease-out:cubic-bezier(.2,.75,.25,1);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:92px}
body{overflow-x:hidden}
body::before{
  content:"";
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none;
  z-index:9999;
  opacity:.04!important;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E")!important;
}

/* ---------------------------------------------
   Shell / page rhythm
--------------------------------------------- */
.container,.v2-shell,.shell,.content-shell{
  width:min(calc(100% - (var(--gutter) * 2)),1320px)!important;
  max-width:1320px!important;
  margin-inline:auto!important;
}
.v2-hero,.page-hero,.hero{padding:clamp(7.5rem,12vw,11rem) 0 clamp(4rem,7vw,7rem)!important;border-bottom:1px solid var(--rule)!important}
.v2-section,.section{padding:var(--section-space) 0!important;border-top:0!important}
.v2-section.compact,.section.compact{padding:var(--section-space-compact) 0!important}
.v2-section+.v2-section,.section+.section{border-top:1px solid var(--rule-soft)!important}
.v2-section.dark,.section.dark{background:var(--page)!important;color:var(--ink)!important}

.v2-section-head{display:grid!important;grid-template-columns:minmax(0,1.12fr) minmax(280px,.72fr)!important;gap:clamp(2rem,7vw,7rem)!important;align-items:end!important;margin-bottom:clamp(2.2rem,4.5vw,4.5rem)!important}
.v2-section-copy{max-width:var(--measure)!important;line-height:1.72!important;margin:0!important}
.v2-display{max-width:15ch!important;font-size:clamp(3.4rem,7.2vw,7.7rem)!important}
.v2-display>span{display:block!important;color:var(--hot)!important;margin-top:.08em!important}
.v2-lede{max-width:70ch!important;font-size:clamp(1.02rem,1.45vw,1.22rem)!important;line-height:1.72!important;margin-top:1.45rem!important}
.v2-section-title{max-width:14ch!important;font-size:clamp(2.7rem,5.2vw,5.5rem)!important;line-height:.98!important;letter-spacing:-.035em!important;margin:.45rem 0 0!important}
.v2-kicker,.v2-eyebrow{font-size:.68rem!important;letter-spacing:.18em!important;text-transform:uppercase!important}

/* ---------------------------------------------
   Header / nav
--------------------------------------------- */
.site-header,.home-header,.hdr{
  position:sticky!important;
  top:0!important;
  z-index:900!important;
  background:rgba(235,232,222,.94)!important;
  border-bottom:1px solid var(--rule)!important;
  backdrop-filter:blur(16px) saturate(.85)!important;
  -webkit-backdrop-filter:blur(16px) saturate(.85)!important;
}
.site-header .nav,.home-header .nav{
  min-height:74px!important;
  display:grid!important;
  grid-template-columns:auto 1fr auto!important;
  gap:1.5rem!important;
  align-items:center!important;
}
.brand{display:inline-flex!important;align-items:center!important;gap:.7rem!important;text-decoration:none!important;color:var(--ink)!important}
.brand img{width:30px!important;height:30px!important;object-fit:contain!important}
.brand span{font-family:var(--font-ui)!important;font-size:1rem!important;letter-spacing:-.015em!important;color:var(--ink)!important}
.brand b{color:var(--hot)!important;font-weight:650!important}
.nav-links,.home-links{display:flex!important;justify-content:center!important;gap:clamp(.8rem,2vw,1.65rem)!important;align-items:center!important}
.nav-links a,.home-links a{position:relative!important;color:var(--muted)!important;text-decoration:none!important;font-family:var(--font-data)!important;font-size:.67rem!important;letter-spacing:.09em!important;text-transform:uppercase!important;padding:.6rem 0!important}
.nav-links a::after,.home-links a::after{content:"";position:absolute;left:0;right:100%;bottom:.2rem;height:1px;background:var(--hot);transition:right .22s var(--ease-out)}
.nav-links a:hover,.home-links a:hover,.nav-links a[aria-current="page"],.home-links a[aria-current="page"]{color:var(--ink)!important}
.nav-links a:hover::after,.home-links a:hover::after,.nav-links a[aria-current="page"]::after,.home-links a[aria-current="page"]::after{right:0}
.nav-actions{display:flex!important;gap:.55rem!important;align-items:center!important;justify-content:flex-end!important}
.menu-toggle{display:none!important}

/* ---------------------------------------------
   Buttons — canonical outlined Folio III behavior
--------------------------------------------- */
.btn,.btn-action,button:not(.menu-toggle),.home-cta,.hero-primary,.hero-secondary{
  min-height:42px!important;
  padding:.72rem 1rem!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:.65rem!important;
  text-decoration:none!important;
  border:1px solid var(--rule)!important;
  border-radius:var(--radius)!important;
  background:transparent!important;
  color:var(--ink)!important;
  font-family:var(--font-data)!important;
  font-size:.68rem!important;
  font-weight:500!important;
  letter-spacing:.12em!important;
  text-transform:uppercase!important;
  box-shadow:none!important;
  transition:background .15s ease,color .15s ease,border-color .15s ease,transform .15s ease!important;
}
.btn:hover,.btn-action:hover,button:not(.menu-toggle):hover,.home-cta:hover,.hero-primary:hover,.hero-secondary:hover{
  background:var(--ink)!important;
  color:var(--surface)!important;
  border-color:var(--ink)!important;
  transform:translateY(-1px)!important;
}
.btn-primary{border-color:rgba(18,22,26,.32)!important}
.v2-actions{display:flex!important;flex-wrap:wrap!important;gap:.7rem!important;margin-top:2rem!important}

/* ---------------------------------------------
   Plates / cards / data surfaces
--------------------------------------------- */
.v2-glass,.card,.metric-panel,.goal-card,.access-card,.matrix-card,.proof,.person,.product-frame,.graph-panel,.intel-panel,.show-panel,.workflow,.integration-panel,.integration-item,.pricing-card,.resource-card,.comparison-card,.feature-panel,.timeline-content,.content-card,.quote-card,.privacy-card,.article-card,.answer-box,.form-shell,.selector,.selector-result,.comparison-wrap,.table-wrap,.security-callout,.notice,.graph-float,.queue,.stat,.goal-lens-card,.today-brief,.weather-board,.change-timeline,.portfolio-card,.runway-summary,.asset-card,.reciprocity-panel,.room-panel,.agent-answer,.evidence-card,.intel-instrument,.usecase-card,.usecase-mini,.merge-card,.atlas-link,.resource-guide,.plan-tier,.plan-note,.shift-old,.shift-new,.chain-step,.integration-side,.source-chip,.activation-item,.v2-cta,.os-map a,.agent-question,.give-row,.room-slot{
  background:var(--surface)!important;
  border:1px solid var(--rule)!important;
  border-radius:var(--radius)!important;
  box-shadow:none!important;
}
.v2-inverse,.runway-bars,.demo-dark-section{background:var(--app-surface)!important;border-color:var(--rule-soft)!important;color:var(--ink)!important}
[data-surface="ink"],.ink-panel,.demo-command,.demo-conversion{background:var(--ink)!important;color:var(--surface)!important;border-color:var(--ink)!important}

.asset-card,.portfolio-card,.goal-lens-card,.intel-instrument,.usecase-card,.usecase-mini,.merge-card,.evidence-card,.plan-tier,.os-map a,.integration-side,.resource-card{
  position:relative!important;
  overflow:hidden!important;
  transition:background .18s ease,border-color .18s ease,transform .18s var(--ease-out)!important;
}
.asset-card::before,.portfolio-card::before,.goal-lens-card::before,.intel-instrument::before,.usecase-card::before,.usecase-mini::before,.merge-card::before,.evidence-card::before,.plan-tier::before,.os-map a::before,.integration-side::before,.resource-card::before{
  content:"";
  position:absolute;
  left:0;top:0;width:0;height:1px;
  background:var(--hot);
  transition:width .28s var(--ease-out);
}
.asset-card:hover,.portfolio-card:hover,.goal-lens-card:hover,.intel-instrument:hover,.usecase-card:hover,.usecase-mini:hover,.merge-card:hover,.evidence-card:hover,.plan-tier:hover,.os-map a:hover,.integration-side:hover,.resource-card:hover{background:var(--surface)!important;border-color:rgba(18,22,26,.24)!important;transform:translateY(-2px)!important}
.asset-card:hover::before,.portfolio-card:hover::before,.goal-lens-card:hover::before,.intel-instrument:hover::before,.usecase-card:hover::before,.usecase-mini:hover::before,.merge-card:hover::before,.evidence-card:hover::before,.plan-tier:hover::before,.os-map a:hover::before,.integration-side:hover::before,.resource-card:hover::before{width:100%}

/* Clean dense grids */
.asset-grid,.portfolio-grid,.goal-lens-board,.evidence-grid,.usecase-more,.merge-safety{gap:1px!important;background:var(--rule)!important;border:1px solid var(--rule)!important}
.asset-grid>*:not(:last-child),.portfolio-grid>*:not(:last-child),.goal-lens-board>*:not(:last-child),.evidence-grid>*:not(:last-child),.usecase-more>*:not(:last-child),.merge-safety>*:not(:last-child){border:0!important}

/* Remove off-palette inline visual remnants */
.weather-line i,.bar i,.demo-runway-bar i{background:var(--hot)!important}
.weather-line:nth-of-type(2) i,.runway-row:nth-child(2) .bar i{background:var(--warm)!important}
.weather-line:nth-of-type(3) i,.runway-row:nth-child(3) .bar i{background:var(--cool)!important}
.weather-line:nth-of-type(4) i,.runway-row:nth-child(4) .bar i{background:var(--deep)!important}
.usecase-mini{--c:var(--hot)!important}
.v2-note{color:var(--cool)!important}

/* ---------------------------------------------
   Feature-specific composition
--------------------------------------------- */
.hero-layout{display:grid!important;grid-template-columns:minmax(0,1.2fr) minmax(300px,.8fr)!important;gap:clamp(3rem,7vw,8rem)!important;align-items:end!important}
.hero-funnel{padding:clamp(1.4rem,3vw,2.2rem)!important}
.hero-funnel ol{list-style:none!important;padding:0!important;margin:1.5rem 0 0!important;border-top:1px solid var(--rule)!important}
.hero-funnel li{display:grid!important;grid-template-columns:90px 1fr!important;gap:1rem!important;padding:1rem 0!important;border-bottom:1px solid var(--rule-soft)!important}
.hero-funnel li strong{font-family:var(--font-display)!important;font-size:2.1rem!important;font-weight:400!important;color:var(--hot)!important}
.hero-funnel li span{font-size:.85rem!important;line-height:1.45!important;color:var(--muted)!important}

.today-grid,.change-stream,.runway-wrap,.agent-demo,.integration-pipeline{gap:1px!important;background:var(--rule)!important;border:1px solid var(--rule)!important}
.today-grid>*,.change-stream>*,.runway-wrap>*,.agent-demo>*,.integration-pipeline>*{border:0!important}

.product-stage{display:grid!important;grid-template-columns:80px minmax(0,1fr)!important;gap:clamp(1.5rem,4vw,3.5rem)!important;padding:clamp(2rem,4vw,3.5rem) 0!important;border-top:1px solid var(--rule)!important}
.product-stage:last-child{border-bottom:1px solid var(--rule)!important}
.stage-index{font-size:.72rem!important;color:var(--cool)!important;padding-top:.45rem!important}
.stage-body h3{font-size:clamp(2rem,3.7vw,3.8rem)!important;line-height:1!important;max-width:17ch!important;margin:.4rem 0 1rem!important}
.stage-body p{max-width:74ch!important;line-height:1.7!important}
.stage-pills{display:flex!important;flex-wrap:wrap!important;gap:.45rem!important;margin-top:1.2rem!important}
.stage-pills span,.source-chip,.v2-chip,.tag,.badge{border:1px solid var(--rule)!important;border-radius:var(--radius)!important;background:var(--app-surface)!important;color:var(--muted)!important;font-family:var(--font-data)!important;font-size:.61rem!important;letter-spacing:.07em!important;text-transform:uppercase!important;padding:.45rem .62rem!important}

.intelligence-index{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:1px!important;background:var(--rule)!important;border:1px solid var(--rule)!important;margin-top:clamp(3rem,6vw,5.5rem)!important}
.intelligence-index a{min-height:120px!important;padding:1rem!important;background:var(--surface)!important;text-decoration:none!important;display:grid!important;align-content:space-between!important;color:var(--ink)!important}
.intelligence-index b{font-family:var(--font-display)!important;font-size:1.45rem!important;font-weight:400!important;color:var(--ink)!important}
.intelligence-index span{font-size:.72rem!important;line-height:1.4!important;color:var(--muted)!important}

.intel-cluster{display:grid!important;grid-template-columns:minmax(280px,.7fr) minmax(0,1.3fr)!important;gap:clamp(3rem,7vw,7rem)!important;align-items:start!important}
.intel-cluster__copy{position:sticky!important;top:110px!important}
.intel-cluster__copy h2{font-size:clamp(2.7rem,5vw,5.2rem)!important;line-height:.98!important;letter-spacing:-.035em!important;margin:.45rem 0 1.2rem!important}
.intel-stack{display:grid!important;gap:1px!important;background:var(--rule)!important;border:1px solid var(--rule)!important}
.intel-instrument{padding:clamp(1.4rem,3vw,2.5rem)!important;border:0!important}
.intel-instrument h3{font-size:clamp(1.65rem,2.4vw,2.35rem)!important;line-height:1.05!important;margin:.65rem 0 .9rem!important}

.os-map{display:grid!important;grid-template-columns:repeat(7,minmax(0,1fr))!important;gap:1px!important;background:var(--rule)!important;border:1px solid var(--rule)!important;margin-top:clamp(3rem,6vw,5rem)!important}
.os-map a{border:0!important;min-height:112px!important;padding:.9rem!important;text-decoration:none!important;display:grid!important;align-content:space-between!important}
.os-map small{font-family:var(--font-data)!important;color:var(--cool)!important;font-size:.58rem!important;text-transform:uppercase!important;letter-spacing:.09em!important}
.os-map strong{font-family:var(--font-display)!important;font-size:1.3rem!important;font-weight:400!important;color:var(--ink)!important}

/* Forms */
input,select,textarea{border:1px solid var(--rule)!important;border-radius:var(--radius)!important;min-height:48px!important;padding:.8rem .9rem!important;background:var(--surface)!important;color:var(--ink)!important;box-shadow:none!important}
textarea{min-height:120px!important}
input:focus,select:focus,textarea:focus{outline:1px solid var(--hot)!important;outline-offset:1px!important;border-color:var(--hot)!important}

/* Footer */
.footer{padding:clamp(3rem,6vw,5.5rem) 0 1.6rem!important;border-top:1px solid var(--rule)!important}
.footer-top{display:grid!important;grid-template-columns:minmax(260px,1.3fr) repeat(3,minmax(130px,.55fr))!important;gap:clamp(2rem,5vw,5rem)!important}
.footer h4{font-family:var(--font-data)!important;font-size:.62rem!important;text-transform:uppercase!important;letter-spacing:.13em!important;margin:0 0 .9rem!important}
.footer a{display:block!important;text-decoration:none!important;font-size:.84rem!important;margin:.45rem 0!important}
.footer a:hover{color:var(--hot)!important}
.footer-bottom{display:flex!important;justify-content:space-between!important;gap:1rem!important;margin-top:3rem!important;padding-top:1rem!important;border-top:1px solid var(--rule-soft)!important;font-family:var(--font-data)!important;font-size:.59rem!important;letter-spacing:.07em!important;text-transform:uppercase!important}

/* ---------------------------------------------
   Motion — restrained, editorial, evidence-like
--------------------------------------------- */
.riq-reveal{opacity:0;transform:translateY(16px);transition:opacity .58s var(--ease-out),transform .58s var(--ease-out);transition-delay:var(--riq-delay,0ms)}
.riq-reveal.is-visible{opacity:1;transform:none}
.riq-progress-line{position:fixed;z-index:1001;top:0;left:0;width:100%;height:2px;pointer-events:none;background:linear-gradient(90deg,var(--hot),var(--warm));transform-origin:left center;transform:scaleX(0)}
.riq-page-ready .v2-hero .v2-kicker,.riq-page-ready .v2-hero .v2-display,.riq-page-ready .v2-hero .v2-lede,.riq-page-ready .v2-hero .v2-actions{animation:riq-enter .62s var(--ease-out) both}
.riq-page-ready .v2-hero .v2-display{animation-delay:70ms}
.riq-page-ready .v2-hero .v2-lede{animation-delay:130ms}
.riq-page-ready .v2-hero .v2-actions{animation-delay:190ms}
@keyframes riq-enter{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

/* Demo polish */
.demo-page .demo-main{padding-top:clamp(7rem,10vw,9rem)!important}
.demo-panel,.demo-quadrant,.demo-person-detail,.demo-runway,.demo-path-map{border-radius:var(--radius)!important}
.demo-objective{transition:background .16s ease,transform .16s ease!important}
.demo-objective:hover{background:var(--app-surface)!important;transform:translateY(-1px)!important}
.demo-primary,.demo-outline{border-radius:var(--radius)!important}
.demo-primary{background:transparent!important;color:var(--ink)!important;border-color:rgba(18,22,26,.32)!important}
.demo-primary:hover{background:var(--ink)!important;color:var(--surface)!important;border-color:var(--ink)!important}
.demo-command .demo-primary,.demo-conversion .demo-primary{background:var(--surface)!important;color:var(--ink)!important;border-color:var(--surface)!important}
.demo-command .demo-primary:hover,.demo-conversion .demo-primary:hover{background:var(--ghost)!important;color:var(--ink)!important;border-color:var(--ghost)!important}

/* ---------------------------------------------
   Responsive
--------------------------------------------- */
@media(max-width:1080px){
  .site-header .nav,.home-header .nav{grid-template-columns:auto 1fr auto!important}
  .menu-toggle{display:inline-flex!important;min-width:74px!important}
  .nav-links,.home-links{position:absolute!important;left:var(--gutter)!important;right:var(--gutter)!important;top:calc(100% + 1px)!important;display:none!important;flex-direction:column!important;align-items:stretch!important;gap:0!important;background:var(--surface)!important;border:1px solid var(--rule)!important;padding:.6rem!important}
  .nav-links.open,.home-links.open{display:flex!important}
  .nav-links a,.home-links a{padding:.85rem .8rem!important;border-bottom:1px solid var(--rule-soft)!important}
  .nav-links a:last-child,.home-links a:last-child{border-bottom:0!important}
  .nav-actions .btn{display:none!important}
  .nav-actions .menu-toggle{display:inline-flex!important}
  .hero-layout,.v2-section-head,.intel-cluster{grid-template-columns:1fr!important}
  .intel-cluster__copy{position:static!important}
  .intelligence-index{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .os-map{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .footer-top{grid-template-columns:1fr 1fr!important}
}

@media(max-width:720px){
  :root{--gutter:1rem}
  .v2-hero,.page-hero,.hero{padding:6.7rem 0 3.5rem!important}
  .v2-section,.section{padding:4rem 0!important}
  .v2-display{font-size:clamp(3rem,15vw,4.75rem)!important}
  .v2-section-title{font-size:clamp(2.4rem,11vw,3.8rem)!important}
  .v2-actions{display:grid!important;grid-template-columns:1fr!important}
  .btn,.btn-action{width:100%!important}
  .product-stage{grid-template-columns:1fr!important;gap:.75rem!important}
  .intelligence-index,.os-map{grid-template-columns:1fr 1fr!important}
  .asset-grid,.portfolio-grid,.goal-lens-board,.evidence-grid,.usecase-more,.merge-safety{display:grid!important;grid-template-columns:1fr!important}
  .hero-funnel li{grid-template-columns:72px 1fr!important}
  .footer-top{grid-template-columns:1fr!important}
  .footer-bottom{display:grid!important}
}

@media(max-width:460px){
  .intelligence-index,.os-map{grid-template-columns:1fr!important}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .riq-reveal{opacity:1!important;transform:none!important}
  .riq-progress-line{display:none!important}
}
