/* Product-grade refinement layer for PR #4.
   Purpose: reduce generic card/grid styling, strengthen navigation typography,
   and replace fragile Unicode UI glyphs with CSS-drawn signals. */

:root{
  --surface:#0a162b;
  --surface-2:#0d1c35;
  --surface-3:#102344;
  --signal:#6e94ff;
  --signal-soft:#b9cbff;
  --hairline:rgba(137,165,219,.24);
  --hairline-strong:rgba(137,165,219,.42);
}

body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  background:
    radial-gradient(circle at 82% 9%,rgba(47,91,196,.16),transparent 27rem),
    radial-gradient(circle at 16% 46%,rgba(36,87,255,.08),transparent 34rem),
    #071326;
}

/* Header: preserve the clean white bar, but make it feel intentional and product-grade. */
.site-header{
  min-height:76px;
  padding-block:14px;
  border-bottom:1px solid #d9dee8;
  background:#f7f8fa;
}
.site-header nav{
  gap:6px;
  font-size:.93rem;
  font-weight:610;
  letter-spacing:-.012em;
  color:#263248;
}
.site-header nav a{
  min-height:42px;
  padding:0 14px;
  border-radius:999px;
  transition:background .18s ease,color .18s ease,transform .18s ease;
}
.site-header nav a:after{display:none}
.site-header nav a:hover,
.site-header nav a:focus-visible{
  background:#e8edfa;
  color:#153a93;
  transform:translateY(-1px);
}
.access-link{
  min-height:42px;
  padding:0 15px;
  border:1px solid #152a4e;
  border-radius:999px;
  background:#0b1930;
  color:#f7f9ff;
  font-size:.88rem;
  font-weight:650;
  letter-spacing:-.01em;
  box-shadow:0 7px 22px rgba(7,19,38,.13);
}
.access-link span{width:7px;height:7px;background:#7298ff;box-shadow:0 0 15px rgba(91,136,255,.78)}
.access-link:hover,.access-link:focus-visible{background:#10264b;border-color:#315aaa}

/* Standard right-arrow signals. The underlying Unicode text is visually suppressed. */
.button.primary span,
.result-panel a span,
.case-row summary span,
.text-link span{
  position:relative;
  display:inline-block;
  flex:0 0 auto;
  width:20px;
  height:8px;
  font-size:0!important;
  line-height:0;
  color:currentColor;
  vertical-align:middle;
}
.button.primary span:before,
.result-panel a span:before,
.case-row summary span:before,
.text-link span:before{
  content:"";
  position:absolute;
  inset:1px 0;
  background:currentColor;
  clip-path:polygon(0 42%,72% 42%,72% 0,100% 50%,72% 100%,72% 58%,0 58%);
  opacity:.9;
}
.button.primary span:after,
.result-panel a span:after,
.case-row summary span:after,
.text-link span:after{content:none!important;display:none!important}

/* External-link signals. */
.access-link b,
.site-footer a span{
  position:relative;
  display:inline-block;
  flex:0 0 auto;
  width:15px;
  height:15px;
  font-size:0!important;
  line-height:0;
  color:currentColor;
}
.access-link b:before,
.site-footer a span:before{
  content:"";
  position:absolute;
  left:1px;
  top:5px;
  width:13px;
  height:5px;
  background:currentColor;
  clip-path:polygon(0 38%,68% 38%,68% 0,100% 50%,68% 100%,68% 62%,0 62%);
  transform:rotate(-45deg);
  transform-origin:center;
}
.access-link b:after,.site-footer a span:after{content:none!important;display:none!important}

.confidence i{
  display:inline-block;
  width:22px;
  height:8px;
  margin-right:7px;
  font-size:0!important;
  vertical-align:1px;
  background:linear-gradient(90deg,var(--signal) 0 24%,transparent 24% 34%,var(--signal) 34% 58%,transparent 58% 68%,var(--signal) 68% 92%,transparent 92%);
}

/* Clean bidirectional trade signal. */
.case-type h3 span,
.swap-visual>b,
.barter-visual>b{
  position:relative;
  display:inline-block;
  width:34px;
  height:18px;
  margin-inline:.42em;
  font-size:0!important;
  line-height:0;
  vertical-align:middle;
}
.case-type h3 span:before,
.case-type h3 span:after,
.swap-visual>b:before,
.swap-visual>b:after,
.barter-visual>b:before,
.barter-visual>b:after{
  content:"";
  position:absolute;
  left:2px;
  width:30px;
  height:6px;
  background:var(--signal);
  clip-path:polygon(0 42%,74% 42%,74% 0,100% 50%,74% 100%,74% 58%,0 58%);
  opacity:.86;
}
.case-type h3 span:before,
.swap-visual>b:before,
.barter-visual>b:before{top:1px}
.case-type h3 span:after,
.swap-visual>b:after,
.barter-visual>b:after{bottom:1px;transform:rotate(180deg)}

/* Single flow arrows in the operating-principle band. */
.principle-strip p b{
  position:relative;
  display:inline-block;
  width:22px;
  height:8px;
  margin-inline:8px;
  padding:0!important;
  font-size:0!important;
  line-height:0;
  vertical-align:middle;
}
.principle-strip p b:before{
  content:"";
  position:absolute;
  inset:1px 0;
  background:var(--signal);
  clip-path:polygon(0 42%,72% 42%,72% 0,100% 50%,72% 100%,72% 58%,0 58%);
  opacity:.82;
}
.principle-strip p b:after{content:none!important;display:none!important}

/* Make major instruments sculpted surfaces, not generic square cards. */
.analysis-console,
.evidence-instrument{
  border-radius:26px 26px 26px 8px;
  box-shadow:0 34px 85px rgba(0,5,18,.36),inset 0 1px rgba(142,177,255,.08);
}
.analysis-console:after{
  content:"";
  position:absolute;
  width:140px;height:140px;
  right:-72px;bottom:-72px;
  border:1px solid rgba(105,145,241,.23);
  border-radius:50%;
  box-shadow:0 0 0 28px rgba(74,112,205,.05),0 0 0 56px rgba(74,112,205,.025);
  pointer-events:none;
}
.result-panel{border-radius:18px 18px 18px 5px;background:linear-gradient(155deg,rgba(17,42,81,.9),rgba(7,20,41,.92))}
.analysis-console select{border-radius:12px;background:#0d2141}
.intent-options{border:1px solid var(--navy-line);border-radius:13px;overflow:hidden}
.intent-options span{border-bottom:0}

/* One continuous case ledger with internal rhythm instead of a stack of boxed cards. */
.case-ledger{
  overflow:hidden;
  border:1px solid var(--hairline-strong);
  border-radius:28px 28px 28px 8px;
  background:linear-gradient(155deg,rgba(13,29,56,.82),rgba(7,19,38,.68));
  box-shadow:0 28px 70px rgba(0,5,18,.22);
}
.case-row{
  padding:30px 28px;
  border-bottom:1px solid var(--hairline);
  transition:background .18s ease;
}
.case-row:last-child{border-bottom:0}
.case-row:hover{background:linear-gradient(90deg,rgba(38,78,159,.12),transparent 70%)}
.case-index{border-right:1px solid var(--hairline)}
.case-index strong{color:#8294b7}
.case-visual{
  min-height:108px;
  padding:14px 2px 14px 20px;
  border:0;
  border-left:1px solid rgba(111,148,226,.42);
  background:transparent;
}
.case-row details{border-left:1px solid var(--hairline)}
.hat-grid span{
  border:1px solid rgba(130,159,220,.36);
  border-radius:50%;
  aspect-ratio:1;
  display:grid;
  place-items:center;
  padding:0;
  background:rgba(53,87,154,.12);
}
.chain-visual li{border-color:var(--hairline)}

/* Make the method a flowing analytical rail. */
.method{
  overflow:hidden;
  border:1px solid var(--hairline-strong);
  border-radius:28px 28px 8px 28px;
  background:linear-gradient(120deg,rgba(13,30,58,.78),rgba(8,20,40,.5));
  box-shadow:0 24px 64px rgba(0,5,18,.17);
}
.method-heading{padding:20px 24px;border-bottom:1px solid var(--hairline)}
.method-rail{border-top:0;padding:0 24px}
.method-rail li{position:relative;border-right:0;padding:30px 24px 28px 0;min-height:190px}
.method-rail li+li{padding-left:34px}
.method-rail li:not(:last-child):after{
  content:"";
  position:absolute;
  right:10px;top:34px;bottom:34px;
  width:1px;
  background:linear-gradient(transparent,var(--hairline-strong),transparent);
}
.method-rail span{
  width:32px;height:32px;
  margin-bottom:34px;
  display:grid;place-items:center;
  border:1px solid rgba(111,151,245,.42);
  border-radius:50%;
  background:rgba(54,91,174,.12);
  box-shadow:0 0 0 7px rgba(53,89,173,.035);
}

/* Decision modes read as a connected list, not six independent cards. */
.decision-matrix{
  grid-template-columns:repeat(2,1fr);
  gap:0 54px;
  padding:18px 26px;
  border:1px solid var(--hairline-strong);
  border-radius:8px 28px 28px 28px;
  background:linear-gradient(145deg,rgba(10,24,47,.7),rgba(7,19,38,.4));
}
.decision-matrix article{
  position:relative;
  min-height:0;
  padding:24px 10px 24px 56px;
  border:0;
  border-bottom:1px solid var(--hairline);
  background:transparent!important;
}
.decision-matrix article:nth-last-child(-n+2){border-bottom:0}
.decision-matrix article>span{
  position:absolute;left:4px;top:25px;
  width:31px;height:31px;
  display:grid;place-items:center;
  border:1px solid rgba(111,151,245,.4);
  border-radius:50%;
  background:rgba(49,83,155,.12);
}
.decision-matrix h3{margin:0 0 7px;font-size:1.18rem}
.decision-matrix p{max-width:none}

/* Shared-engine area: retain open architecture instead of cards. */
.engine-stamp{
  border:0;
  border-left:2px solid var(--signal);
  border-radius:0;
  padding:9px 0 9px 20px;
  background:transparent;
}
.audience-branches{border-top:1px solid var(--hairline-strong)}
.audience-path ul{border-top:1px solid var(--hairline)}

/* Platform: continuous signal line and round nodes replace empty square markers. */
.architecture{
  padding:0 26px 18px;
  border:1px solid var(--hairline-strong);
  border-radius:28px 8px 28px 28px;
  background:linear-gradient(155deg,rgba(13,29,56,.72),rgba(7,19,38,.48));
}
.architecture-foundation{border-color:var(--hairline)}
.module-rail{position:relative}
.module-rail:before{
  content:"";
  position:absolute;
  left:0;right:0;top:30px;
  height:1px;
  background:linear-gradient(90deg,var(--signal),rgba(104,143,230,.22) 46%,rgba(104,143,230,.08));
}
.module{
  min-height:200px;
  padding:54px 28px 12px 0;
  border:0;
  position:relative;
}
.module+article{padding-left:28px}
.module:before,
.module+article:before{
  left:0;
  top:25px;
  width:10px;height:10px;
  border-radius:50%;
  border:1px solid #6683bd;
  background:#0c1c37;
  box-shadow:0 0 0 6px rgba(69,103,173,.08);
}
.module+article:before{left:28px}
.module.current:before{background:var(--signal);border-color:var(--signal);box-shadow:0 0 18px rgba(93,139,255,.72),0 0 0 6px rgba(69,103,173,.09)}
.module h3{margin:28px 0 12px}

/* Explicitly neutralize legacy decorative markers from older CSS layers. */
.decision-matrix article:after,
.audience-path:before,
.audience-path+.audience-path:before,
.method-rail li:before{
  content:none!important;
  display:none!important;
}

/* Softer transitions between page systems. */
.principle-strip{border-color:var(--hairline);background:rgba(7,19,38,.74);backdrop-filter:blur(12px)}
.evidence-section,.audience-section{background:transparent}
.case-section,.value-section,.decisions,.platform-section{position:relative}
.case-section:before,.value-section:before,.decisions:before,.platform-section:before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(106,145,229,.28),transparent);
}

.site-footer{background:#f7f8fa;border-top:1px solid #d9dee8;color:#263248}
.site-footer p{color:#657086}

@media(max-width:850px){
  .site-header nav{font-size:.86rem;gap:2px}
  .site-header nav a{padding-inline:10px}
  .decision-matrix{gap:0 26px}
  .case-row{padding-inline:22px}
}

@media(max-width:600px){
  .site-header{min-height:0}
  .site-header nav{font-size:.78rem;padding-top:8px}
  .site-header nav a{padding:0 9px;min-height:38px}
  .access-link{font-size:.76rem;padding-inline:12px;min-height:38px}
  .analysis-console,.evidence-instrument,.case-ledger,.method,.decision-matrix,.architecture{border-radius:18px 18px 18px 6px}
  .case-row{padding:24px 18px}
  .method-rail{padding:0 18px}
  .method-rail li,.method-rail li+li{padding:18px 0;display:grid;grid-template-columns:40px 82px 1fr}
  .method-rail li:not(:last-child):after{display:none}
  .method-rail span{width:28px;height:28px;margin:0}
  .decision-matrix{grid-template-columns:1fr;padding:12px 18px}
  .decision-matrix article:nth-last-child(-n+2){border-bottom:1px solid var(--hairline)}
  .decision-matrix article:last-child{border-bottom:0}
  .architecture{padding-inline:18px}
}
