:root{
  --orange:#f28a16;
  --orange2:#ff9f1d;
  --cream:#f5e2bd;
  --ink:#0b0b0b;
  --paper:#11100e;
  --muted:#a8a098;
  --line:rgba(245,226,189,.16);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--ink);
  color:#f7ead0;
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
button{font:inherit}
.noise{
  position:fixed; inset:0; pointer-events:none; opacity:.055; z-index:50;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E");
}
.nav{
  position:fixed; z-index:40; top:0; left:0; right:0;
  display:flex; align-items:center; justify-content:space-between;
  padding:16px clamp(18px,4vw,64px);
  background:linear-gradient(180deg,rgba(5,5,5,.94),rgba(5,5,5,.48),transparent);
  backdrop-filter:blur(4px);
}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:-.04em;font-size:20px}
.brand>span:last-child>span{color:var(--orange)}
.brand-mark{
  width:38px;height:38px;border-radius:50%;display:inline-block;flex:0 0 auto;
  background-image:url("assets/catecycle-original.jpg");
  background-size:380% auto;
  background-position:61% 26%;
  border:2px solid var(--orange);
  box-shadow:0 0 0 3px rgba(242,138,22,.16);
}
.nav-links{display:flex;gap:28px;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.nav-links a{opacity:.72;transition:.2s}
.nav-links a:hover{opacity:1;color:var(--orange)}
.button{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:52px;padding:0 24px;border:1px solid var(--orange);
  background:var(--orange);color:#0a0907;font-weight:900;text-transform:uppercase;
  letter-spacing:.04em;clip-path:polygon(0 0,94% 0,100% 22%,100% 100%,6% 100%,0 78%);
  transition:transform .18s ease,filter .18s ease;
}
.button:hover{transform:translateY(-2px);filter:brightness(1.06)}
.button-small{min-height:42px;padding:0 18px;font-size:12px}
.button-ghost{background:rgba(10,9,7,.52);color:#f7ead0;border-color:rgba(247,234,208,.32);backdrop-filter:blur(8px)}
.button.disabled{opacity:.45;pointer-events:none}
.hero{min-height:100svh;position:relative;display:flex;align-items:flex-end;overflow:hidden}
.hero-art{
  position:absolute;inset:0;
  background-image:url("assets/catecycle-original.jpg");
  background-size:cover;background-position:center;
  transform:scale(1.035);
}
.hero-shade{
  position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(0,0,0,.78) 0%,rgba(0,0,0,.47) 40%,rgba(0,0,0,.08) 72%),
    linear-gradient(0deg,rgba(0,0,0,.9) 0%,transparent 48%);
}
.hero-content{
  position:relative;z-index:2;
  width:min(1040px,92vw);margin:0 auto;padding:150px 0 12vh;
}
.eyebrow{
  display:inline-block;background:var(--cream);color:#0a0907;
  padding:7px 10px;font-size:11px;font-weight:900;letter-spacing:.16em;
  transform:rotate(-1deg);margin-bottom:20px;
}
h1,h2,.wide-title{
  font-family:Anton,Impact,sans-serif;font-weight:400;text-transform:uppercase;
  margin:0;line-height:.88;letter-spacing:-.025em;
}
h1{font-size:clamp(62px,10vw,150px);text-shadow:0 5px 30px rgba(0,0,0,.42)}
h1 em{font-style:normal;color:var(--orange)}
.hero-content>p{font-size:clamp(16px,2vw,22px);max-width:560px;margin:22px 0 30px;font-weight:600}
.hero-content>p strong{color:var(--orange)}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.scroll-cue{
  position:absolute;right:3vw;bottom:28px;z-index:2;
  font-size:10px;font-weight:900;letter-spacing:.18em;writing-mode:vertical-rl;
}
.ticker{background:var(--orange);color:#090806;overflow:hidden;border-block:3px solid #090806;transform:rotate(-.55deg) scale(1.01);position:relative;z-index:3}
.ticker-track{
  width:max-content;display:flex;gap:26px;align-items:center;
  padding:12px 0;font-family:Anton,Impact,sans-serif;font-size:24px;letter-spacing:.04em;
  animation:marquee 18s linear infinite;
}
@keyframes marquee{to{transform:translateX(-50%)}}
.section{padding:110px clamp(20px,6vw,90px);max-width:1440px;margin:0 auto}
.section-kicker{font-size:11px;font-weight:900;letter-spacing:.18em;color:var(--orange);margin-bottom:38px}
.story-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:start}
h2{font-size:clamp(54px,7.8vw,112px)}
h2 span,.wide-title span{color:var(--orange)}
.story-copy{padding-top:10px;font-size:clamp(16px,1.6vw,21px);line-height:1.65;color:#d7c9b1}
.story-copy p{margin:0 0 20px}
.quote{font-family:Anton,Impact,sans-serif;font-size:clamp(30px,4vw,58px);line-height:.95;color:#fff;margin-top:34px;border-left:5px solid var(--orange);padding-left:18px}
.poster-section{padding:20px clamp(20px,6vw,90px) 120px;max-width:1440px;margin:auto}
.poster-card{height:min(72vw,760px);min-height:460px;position:relative;overflow:hidden;border:1px solid var(--line);background:#18130f}
.poster-image{
  position:absolute;inset:0;
  background-image:url("assets/catecycle-original.jpg");
  background-size:cover;background-position:center;
  filter:saturate(1.05) contrast(1.03);
}
.poster-card:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 52%,rgba(0,0,0,.8))}
.poster-stamp{
  position:absolute;z-index:2;right:5%;bottom:7%;
  display:flex;flex-direction:column;align-items:flex-end;
  font-family:Anton,Impact,sans-serif;text-transform:uppercase;
  transform:rotate(-4deg);
}
.poster-stamp span{font-size:clamp(48px,8vw,120px);line-height:.72;color:#fff}
.poster-stamp strong{font-size:clamp(48px,8vw,120px);line-height:.78;color:var(--orange);font-weight:400}
.poster-stamp small{font-family:Inter,sans-serif;font-size:11px;font-weight:900;letter-spacing:.28em;background:#0b0b0b;padding:7px 10px;margin-top:12px}
.wide-title{font-size:clamp(64px,9vw,136px);margin-bottom:54px}
.steps{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.step{padding:34px 32px 40px 0;border-right:1px solid var(--line);min-height:250px}
.step+.step{padding-left:32px}
.step:last-child{border-right:0}
.num{font-family:Anton,Impact,sans-serif;color:var(--orange);font-size:28px;margin-bottom:48px}
.step h3{margin:0 0 12px;font-size:20px}
.step p{color:var(--muted);line-height:1.6;margin:0}
.token{padding-top:90px;padding-bottom:130px}
.token-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}
.token-note{color:var(--muted);font-size:16px;line-height:1.7;max-width:520px}
.contract-card{border:1px solid var(--line);background:linear-gradient(160deg,#17130f,#0e0d0c);padding:28px}
.contract-top{display:flex;justify-content:space-between;font-size:10px;font-weight:900;letter-spacing:.16em;color:var(--muted)}
.live-dot{color:var(--orange)}
code{
  display:block;margin:38px 0 20px;padding:18px;border:1px dashed rgba(242,138,22,.45);
  color:var(--orange2);background:#080807;font-size:clamp(16px,2vw,24px);overflow-wrap:anywhere;
}
.copy{width:100%;border:0;background:#28231e;color:#736a61;font-weight:900;padding:13px;cursor:not-allowed}
.token-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.final-cta{
  min-height:72vh;position:relative;display:flex;align-items:center;overflow:hidden;
  background:#e78a20;border-top:4px solid #0a0907;
}
.final-cat{
  position:absolute;inset:0 0 0 42%;
  background-image:url("assets/catecycle-original.jpg");
  background-size:auto 155%;
  background-position:67% center;background-repeat:no-repeat;
  mix-blend-mode:multiply;opacity:.92;
}
.final-cta:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#e78a20 0%,#e78a20 37%,rgba(231,138,32,.7) 55%,rgba(231,138,32,.08) 100%)}
.final-content{position:relative;z-index:2;padding:80px clamp(20px,6vw,90px);color:#090806}
.final-content .eyebrow{background:#090806;color:#f7ead0}
.final-content h2{font-size:clamp(68px,10vw,150px);margin-bottom:30px}
.final-content h2 span{color:#fff}
.final-content .button{background:#0a0907;border-color:#0a0907;color:#fff}
footer{
  padding:34px clamp(20px,6vw,90px);display:grid;grid-template-columns:1fr 2fr 1fr;gap:30px;align-items:center;
  border-top:1px solid var(--line);font-size:11px;color:#81796e;line-height:1.5;
}
footer p{margin:0}
footer p:last-child{text-align:right}
.footer-brand{color:#f7ead0}
@media(max-width:850px){
  .nav-links{display:none}
  .nav{padding:12px 16px}
  .brand{font-size:16px}
  .brand-mark{width:34px;height:34px}
  .hero-art{background-position:58% center}
  .hero-shade{background:linear-gradient(0deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.45) 68%,rgba(0,0,0,.18))}
  .hero-content{padding:130px 20px 9vh;margin:0}
  .scroll-cue{display:none}
  .story-grid,.token-grid{grid-template-columns:1fr;gap:40px}
  .steps{grid-template-columns:1fr}
  .step,.step+.step{padding:28px 0;border-right:0;border-bottom:1px solid var(--line);min-height:auto}
  .step:last-child{border-bottom:0}
  .num{margin-bottom:18px}
  .poster-card{height:70vh}
  .poster-image{background-position:64% center}
  .poster-stamp{right:5%;left:5%;align-items:flex-start}
  .token-actions{grid-template-columns:1fr}
  .final-cat{inset:0 0 0 10%;opacity:.5;background-size:auto 120%}
  .final-cta:after{background:linear-gradient(90deg,#e78a20 0%,rgba(231,138,32,.84) 60%,rgba(231,138,32,.25))}
  footer{grid-template-columns:1fr}
  footer p:last-child{text-align:left}
}