/* ============================================================
   NOYAN CAPITAL — "The Holding" flagship layer
   Survey frame · compounding curve · register of holdings
   Loads on top of site.css
   ============================================================ */

/* paper grain for atmosphere */
body.survey{
  position:relative;z-index:0;
  background-image:
    radial-gradient(120% 80% at 50% -10%, rgba(60,88,82,0.05), transparent 60%);
}
body.survey::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:0.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}

/* ---------- fixed survey frame ---------- */
.survey-frame{
  position:fixed;inset:13px;z-index:60;pointer-events:none;
  border:1px solid color-mix(in srgb,var(--teal) 26%,transparent);
}
.survey-frame .corner{position:absolute;width:13px;height:13px;border:0}
.survey-frame .corner::before,.survey-frame .corner::after{content:"";position:absolute;background:var(--copper)}
.survey-frame .corner::before{width:13px;height:1.5px;top:0;left:0}
.survey-frame .corner::after{width:1.5px;height:13px;top:0;left:0}
.survey-frame .tl{top:-1px;left:-1px}
.survey-frame .tr{top:-1px;right:-1px;transform:scaleX(-1)}
.survey-frame .bl{bottom:-1px;left:-1px;transform:scaleY(-1)}
.survey-frame .br{bottom:-1px;right:-1px;transform:scale(-1)}
.frame-label{
  position:absolute;font-family:var(--mono);font-size:0.6rem;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--sage);white-space:nowrap;
}
.frame-label.fl-bl{left:14px;bottom:-9px;background:var(--paper);padding:0 8px}
.frame-label.fl-br{right:14px;bottom:-9px;background:var(--paper);padding:0 8px;color:var(--copper)}
.frame-label.fl-side{
  top:50%;right:-1px;transform-origin:right center;transform:rotate(-90deg) translateX(50%);
  background:var(--paper);padding:0 10px;
}
@media (max-width:760px){
  .survey-frame{inset:7px}
  .frame-label.fl-bl,.frame-label.fl-side{display:none}
}

/* keep nav clear of the frame */
body.survey .nav{margin-top:0}

/* ---------- folio marks & marginalia ---------- */
.folio{
  font-family:var(--serif);font-weight:500;font-style:italic;
  font-size:clamp(3rem,8vw,6.5rem);line-height:0.8;
  color:color-mix(in srgb,var(--teal) 16%,transparent);
  user-select:none;pointer-events:none;
}
.marginal{
  font-family:var(--mono);font-size:0.66rem;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--sage);line-height:1.9;
}
.marginal .dot{color:var(--copper)}
.sectionhead{display:flex;align-items:baseline;gap:1.4rem;flex-wrap:wrap}

/* ---------- HERO ---------- */
.hero-survey{
  padding-top:clamp(2rem,5vh,4rem);
  padding-bottom:clamp(2rem,5vh,3rem);
  position:relative;
}
.hero-survey .h1-mark{
  font-family:var(--mono);font-size:0.7rem;letter-spacing:0.22em;text-transform:uppercase;
  color:var(--copper);display:flex;align-items:center;gap:1rem;margin-bottom:2rem;
}
.hero-survey .h1-mark::before{content:"";width:42px;height:1px;background:var(--copper)}
.hero-survey h1{
  font-family:var(--serif);font-weight:500;letter-spacing:-0.012em;
  font-size:clamp(2.5rem,1.5rem + 4.4vw,5rem);line-height:1.0;
  max-width:16ch;color:var(--forest);text-wrap:balance;
}
.hero-survey h1 .amp{color:var(--copper);font-style:italic}
.hero-survey .subhead{
  font-family:var(--serif);font-style:italic;color:var(--copper);
  font-size:clamp(1.4rem,1rem + 1.6vw,2.3rem);line-height:1.2;margin-top:1.6rem;
}

/* ---------- COMPOUNDING CURVE ---------- */
.curve-wrap{margin-top:clamp(2.5rem,5vh,4rem);position:relative}
.curve-cap{
  font-family:var(--mono);font-size:0.7rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--sage);margin-bottom:1.2rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;
}
.curve-cap .y-label{color:var(--teal)}
.curve-svg{width:100%;height:auto;display:block;overflow:visible}
.curve-base{stroke:var(--line);stroke-width:1}
.curve-tick{stroke:color-mix(in srgb,var(--teal) 32%,transparent);stroke-width:1}
.curve-path{
  fill:none;stroke:var(--copper);stroke-width:2.5;stroke-linecap:round;
  stroke-dasharray:1600;stroke-dashoffset:0;
}
.curve-area{fill:url(#curveFill);opacity:0.5}
.cnode circle{fill:var(--paper);stroke:var(--copper);stroke-width:2.5}
.cnode .dot{fill:var(--copper);stroke:none}
.cnode text.t-verb{font-family:var(--serif);font-weight:500;font-size:23px;fill:var(--forest)}
.cnode text.t-desc{font-family:var(--mono);font-size:9.5px;letter-spacing:0.12em;fill:var(--sage);text-transform:uppercase}
.cnode .t-num{font-family:var(--mono);font-size:9px;letter-spacing:0.1em;fill:var(--copper)}

@media (prefers-reduced-motion:no-preference){
  .curve-path{animation:curveDraw 2.7s cubic-bezier(.22,.61,.36,1) .25s both}
  .curve-area{opacity:0;animation:fadeArea 1.4s ease 2.2s forwards}
  .cnode{opacity:0;animation:nodePop .7s cubic-bezier(.2,.8,.3,1) both}
  .cnode.cn1{animation-delay:1.35s}
  .cnode.cn2{animation-delay:1.95s}
  .cnode.cn3{animation-delay:2.55s}
  .hero-survey .h1-mark,.hero-survey h1,.hero-survey .subhead{animation:riseIn .9s cubic-bezier(.2,.7,.3,1) both}
  .hero-survey h1{animation-delay:.12s}
  .hero-survey .subhead{animation-delay:.26s}
}
@keyframes curveDraw{from{stroke-dashoffset:1600}to{stroke-dashoffset:0}}
@keyframes fadeArea{to{opacity:0.5}}
@keyframes nodePop{from{opacity:0;transform:translateY(8px) scale(.7)}to{opacity:1;transform:none}}
@keyframes riseIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.cnode{transform-box:fill-box;transform-origin:center}

/* ---------- REGISTRY DEFINITION ---------- */
.registry-def{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.registry-def .wrap{display:grid;grid-template-columns:auto 1fr;gap:clamp(1.5rem,4vw,4rem);
  padding-block:clamp(2.5rem,5vh,4rem);align-items:start}
.registry-def .def-mark{font-family:var(--mono);font-size:0.66rem;letter-spacing:0.16em;
  text-transform:uppercase;color:var(--copper);white-space:nowrap;padding-top:0.4rem}
.registry-def .def-body{font-family:var(--serif);font-size:clamp(1.3rem,1rem + 1.3vw,2rem);
  line-height:1.32;color:var(--forest);max-width:38ch;font-weight:500}
.registry-def .def-body b{color:var(--copper);font-weight:500}

/* ---------- REGISTER OF HOLDINGS ---------- */
.register{border-top:1px solid var(--forest)}
.reg-row{
  display:grid;grid-template-columns:5.5rem 1fr 13rem 11rem;gap:1.5rem;
  align-items:center;padding-block:clamp(1.6rem,3vw,2.4rem);
  border-bottom:1px solid var(--line);position:relative;transition:padding-left .35s ease;
}
.reg-row:hover{padding-left:1rem}
.reg-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:0;background:var(--copper);transition:width .35s ease}
.reg-row:hover::before{width:3px}
.reg-no{font-family:var(--mono);font-size:0.8rem;letter-spacing:0.08em;color:var(--copper)}
.reg-name{font-family:var(--serif);font-weight:500;font-size:clamp(1.5rem,1.1rem + 1.4vw,2.3rem);line-height:1.04;color:var(--forest)}
.reg-name .sub{display:block;font-family:var(--mono);font-size:0.68rem;letter-spacing:0.1em;
  text-transform:uppercase;color:var(--sage);margin-top:0.5rem}
.reg-sector{font-family:var(--sans);font-size:0.95rem;color:var(--sage);line-height:1.4}
.reg-site{justify-self:start}
@media (max-width:880px){
  .reg-row{grid-template-columns:3.5rem 1fr;gap:0.5rem 1.2rem}
  .reg-sector{grid-column:2;font-size:0.9rem}
  .reg-site{grid-column:2;margin-top:0.4rem}
}

/* ---------- HOLD / compounding statement band ---------- */
.thesis{position:relative;overflow:hidden}
.thesis .wrap{position:relative;z-index:2}
.thesis .lead{font-family:var(--serif);font-weight:500;font-style:italic;
  font-size:clamp(1.9rem,1.2rem + 3vw,3.6rem);line-height:1.16;color:var(--paper);max-width:20ch}
.thesis .lead em{color:var(--copper-light);font-style:italic}

/* big watermark roman folio in dark sections */
.thesis .watermark{position:absolute;right:-2%;bottom:-22%;z-index:1;
  font-family:var(--serif);font-style:italic;font-weight:500;font-size:34vh;line-height:0.7;
  color:rgba(198,138,77,0.07);user-select:none;pointer-events:none}

/* ---------- END BLOCK horizon echo ---------- */
.endblock .horizon{position:absolute;left:0;right:0;bottom:0;height:42%;z-index:1;opacity:0.5;pointer-events:none}
.endblock .horizon path{fill:none;stroke:rgba(198,138,77,0.35);stroke-width:1.5}

/* register hover micro for the learn-more */
@media (hover:hover){
  .reg-row .sitelink,.reg-row .tlink{opacity:0.85;transition:opacity .3s}
  .reg-row:hover .sitelink,.reg-row:hover .tlink{opacity:1}
}