/* ============ CDD: Ciridae shared system ============ */
:root{
  --ember:#cc6437; --void:#0b0b0b; --abyss:#050505; --charcoal:#272a2a;
  --steel:#484848; --ash:#cecece; --bone:#edebe7; --white:#fff;
  --cond:'Barlow Condensed',Oswald,sans-serif;
  --prose:'Inter',system-ui,sans-serif;
  --mono:'Roboto Mono',monospace;
  --hair:rgba(206,206,206,.14);
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;font-weight:400}
html{scroll-behavior:auto;overflow-anchor:none}
body{margin:0;background:var(--void);color:var(--white);font-family:var(--cond);font-size:14px;letter-spacing:-.02em;line-height:1.43;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
b,strong{font-weight:400}
button{font-weight:400}
::selection{background:var(--ember);color:var(--void)}
.wrap{max-width:1400px;margin:0 auto;padding:0 32px}
section,footer,header{position:relative;z-index:1}
#env{position:fixed;inset:0;z-index:0;pointer-events:none}
.grain{position:fixed;inset:-60%;z-index:400;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 9s steps(7) infinite}
@keyframes grain{to{transform:translate(5%,-4%)}}
#cur{position:fixed;left:0;top:0;z-index:500;pointer-events:none;font-size:22px;line-height:1;color:#fff;mix-blend-mode:difference;transform:translate(-100px,-100px);will-change:transform;transition:color .3s,font-size .35s var(--ease)}
#cur.on{color:var(--ember);mix-blend-mode:normal;font-size:34px}
@media(pointer:coarse){#cur{display:none}}
.strip{position:absolute;top:0;left:0;right:0;z-index:150;background:var(--abyss);border-bottom:1px solid var(--hair);height:30px;display:flex;align-items:center;overflow:hidden}
.strip .tk{display:flex;white-space:nowrap;animation:tick 46s linear infinite}
.strip span{font-family:var(--mono);font-size:11px;text-transform:uppercase;color:var(--ash);padding-right:12px}
.strip i{font-style:normal;color:var(--ember);padding-right:12px}
@keyframes tick{to{transform:translateX(-50%)}}
.nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:44px 32px 14px;transition:background .6s,backdrop-filter .6s,padding .6s,border-color .6s;border-bottom:1px solid transparent}
.nav.scrolled{background:rgba(5,5,5,.66);backdrop-filter:blur(18px) saturate(140%);border-color:var(--hair);padding:14px 32px}
.pill{display:inline-flex;align-items:center;gap:10px;font-family:var(--cond);font-size:14px;letter-spacing:-.02em;text-transform:uppercase;color:var(--white);border:1px solid var(--white);border-radius:1440px;padding:11px 26px;background:none;cursor:pointer;transition:border-color .3s var(--ease),color .3s var(--ease);will-change:transform}
.pill:hover{border-color:var(--ember);color:var(--ember)}
.pill.q{border-color:var(--steel)}
.pill .dot{width:5px;height:5px;border-radius:50%;background:var(--ember)}
.burger{width:52px;height:40px;border:0;background:none;cursor:pointer;display:flex;flex-direction:column;justify-content:center;gap:7px;align-items:flex-end;will-change:transform}
.burger span{display:block;height:1px;background:var(--white);width:34px;transition:transform .5s var(--ease)}
.burger:hover span{background:var(--ember)}
.burger.open span:nth-child(1){transform:translateY(4px) rotate(45deg)}
.burger.open span:nth-child(2){transform:translateY(-4px) rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:190;background:var(--abyss);transform:translateY(-102%);transition:transform .9s var(--ease);display:flex;flex-direction:column;justify-content:center;padding:0 32px;overflow:hidden}
.menu.open{transform:none}
.menu .mstar{position:absolute;right:-4vw;top:50%;transform:translateY(-50%);font-size:56vh;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(204,100,55,.25);pointer-events:none;user-select:none}
.menu a.mlink{display:flex;align-items:baseline;gap:22px;font-family:var(--cond);font-size:clamp(34px,5.6vw,66px);line-height:1.12;text-transform:uppercase;letter-spacing:-.02em;color:var(--white);opacity:0;transform:translateY(30px);transition:opacity .7s var(--ease),transform .7s var(--ease),color .3s;max-width:1400px;margin:0 auto;width:100%}
.menu a.mlink .mn{font-family:var(--mono);font-size:12px;color:var(--ember)}
.menu a.mlink:hover{color:var(--ember)}
.menu.open a.mlink{opacity:1;transform:none}
.menu.open a.mlink:nth-child(2){transition-delay:.13s}.menu.open a.mlink:nth-child(3){transition-delay:.19s}
.menu.open a.mlink:nth-child(4){transition-delay:.25s}.menu.open a.mlink:nth-child(5){transition-delay:.31s}
.menu.open a.mlink:nth-child(6){transition-delay:.37s}.menu.open a.mlink:nth-child(7){transition-delay:.43s}
.menu.open a.mlink:nth-child(8){transition-delay:.49s}
.menu .mfoot{position:absolute;bottom:30px;left:32px;right:32px;display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;text-transform:uppercase;color:var(--ash);max-width:1400px;margin:0 auto}
.menu .mfoot i{font-style:normal;color:var(--ember)}
.corner{position:absolute;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:rgba(206,206,206,.5);z-index:3;line-height:1.7}
.corner i{font-style:normal;color:var(--ember)}
.c-tl{top:46px;left:32px}.c-tr{top:46px;right:32px;text-align:right}
.c-bl{bottom:30px;left:32px}.c-br{bottom:30px;right:32px;text-align:right}
/* sub-page hero */
.hero-lite{position:relative;height:82vh;overflow:hidden;display:flex;align-items:center;justify-content:center;text-align:center}
.hbg{position:absolute;inset:-9%;background-size:cover;background-position:center 30%;filter:blur(20px) brightness(.4) saturate(.9);will-change:transform;transform:scale(1.16)}
.hero-veil{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(11,11,11,.2) 0%,rgba(11,11,11,.8) 100%)}
.hero-core{position:relative;z-index:2;padding:0 24px;max-width:1100px}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ash);margin-bottom:38px}
.eyebrow i{font-style:normal;color:var(--ember)}
h1.big{font-family:var(--cond);font-size:clamp(44px,7vw,96px);line-height:.98;letter-spacing:.06em;text-transform:uppercase;margin:0;text-indent:.06em}
.hero-lite .h-sub{margin-top:26px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ash)}
.hero-lite .h-foot{position:absolute;bottom:34px;left:0;right:0;text-align:center;z-index:2;font-family:var(--mono);font-size:11px;text-transform:uppercase;color:var(--steel)}
p.ws{font-family:var(--cond);font-size:clamp(26px,3.8vw,52px);line-height:1.14;letter-spacing:-.01em;text-transform:uppercase;margin:0 auto;max-width:1000px}
.ws .w{opacity:.1;will-change:opacity}
.stmt{padding:20vh 0;text-align:center;position:relative;z-index:1}
.sec{padding:13vh 0 0;position:relative;z-index:1}
.sec-label{display:flex;align-items:center;gap:16px;margin-bottom:44px}
.sec-label .n{font-family:var(--mono);font-size:11px;color:var(--ember)}
.sec-label .t{font-size:20px;line-height:1;text-transform:uppercase}
.sec-label .ln{flex:1;height:1px;background:var(--hair);transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease) .2s}
.rv.in .ln{transform:scaleX(1)}
/* numbered step cards */
.steps{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.step{position:relative;background:rgba(39,42,42,.55);backdrop-filter:blur(6px);border:1px solid var(--hair);border-radius:10px;padding:30px 32px 34px;overflow:hidden;transition:border-color .35s}
.step:hover{border-color:var(--ember)}
.step .sn{font-family:var(--mono);font-size:11px;color:var(--ember);display:inline-block;border:1px solid rgba(204,100,55,.5);border-radius:1440px;padding:5px 14px;margin-bottom:18px}
.step p{font-family:var(--prose);font-size:15px;letter-spacing:-.01em;line-height:1.6;color:var(--ash);margin:0}
.step .ghost{position:absolute;right:-8px;bottom:-34px;font-size:120px;line-height:1;color:transparent;-webkit-text-stroke:1px rgba(206,206,206,.12);user-select:none}
.steps.one{grid-template-columns:1fr}
@media(max-width:860px){.steps{grid-template-columns:1fr}}
/* mono facts list */
.facts{border-top:1px solid var(--hair)}
.fact{display:flex;gap:26px;align-items:baseline;border-bottom:1px solid var(--hair);padding:18px 4px}
.fact .fn{font-family:var(--mono);font-size:11px;color:var(--ember);min-width:34px}
.fact p{font-family:var(--prose);font-size:15px;letter-spacing:-.01em;line-height:1.6;color:var(--ash);margin:0}
/* rates */
.cur-toggle{display:flex;gap:8px;margin-bottom:28px}
.chip{font-family:var(--cond);font-size:14px;letter-spacing:-.02em;text-transform:uppercase;color:var(--ash);background:none;border:1px solid var(--steel);border-radius:1440px;padding:9px 22px;cursor:pointer;transition:border-color .3s,color .3s}
.chip:hover{border-color:var(--ash);color:var(--white)}
.chip.active{border-color:var(--ember);color:var(--white)}
.rate-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.rcol{display:flex;flex-direction:column;gap:16px}
.rate{background:rgba(39,42,42,.55);backdrop-filter:blur(6px);border:1px solid var(--hair);border-radius:10px;padding:24px 28px;display:flex;justify-content:space-between;align-items:baseline;gap:20px;transition:border-color .35s}
.rate:hover{border-color:var(--ember)}
.rate .rl{font-size:20px;line-height:1.1;text-transform:uppercase}
.rate .rd{font-family:var(--prose);font-size:14px;letter-spacing:-.01em;color:var(--ash);margin-top:8px}
.rate .rp{font-family:var(--mono);font-size:14px;white-space:nowrap}
.rate-note{font-family:var(--prose);font-size:14px;letter-spacing:-.01em;color:var(--ash);line-height:1.6;max-width:760px;margin-top:28px}
.rate-note b{color:var(--ember)}
@media(max-width:860px){.rate-grid{grid-template-columns:1fr}}
/* parallax band */
.band{display:block;position:relative;height:70vh;margin:14vh 16px 0;border-radius:10px;overflow:hidden;z-index:1}
.band .pbg{position:absolute;left:0;right:0;top:-12%;height:124%;background-size:cover;background-position:center 30%;will-change:transform}
.band .pveil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,11,.42) 0%,rgba(11,11,11,.08) 50%,rgba(11,11,11,.55) 100%)}
.band .bin{position:relative;z-index:2;height:100%;display:flex;align-items:flex-end;justify-content:space-between;padding:34px;font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.75)}
/* bone flip */
.bone-sec{background:var(--bone);color:var(--void);margin-top:14vh;padding:13vh 0;position:relative;z-index:1}
.bone-sec .sec-label .t{color:var(--void)}
.bone-sec .sec-label .ln{background:rgba(11,11,11,.14)}
.bone-sec .fact{border-color:rgba(11,11,11,.16)}
.bone-sec .facts{border-color:rgba(11,11,11,.16)}
.bone-sec .fact p{color:rgba(11,11,11,.72)}
.bone-sec h2{font-family:var(--cond);font-size:clamp(30px,4vw,54px);line-height:1;text-transform:uppercase;margin:0 0 40px}
.bone-sec h2 i{font-style:normal;color:var(--ember)}
/* tag pills row */
.tags{display:flex;gap:10px;flex-wrap:wrap}
.tag{font-family:var(--mono);font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ash);border:1px solid var(--steel);border-radius:1440px;padding:9px 18px}
.tag i{font-style:normal;color:var(--ember)}
/* footer */
.foot{position:relative;min-height:88vh;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:12vh 16px;z-index:1}
.foot .fbg{position:absolute;left:0;right:0;top:-10%;height:120%;background-size:cover;background-position:center 20%;filter:brightness(.5) saturate(.9);will-change:transform}
.foot .fveil{position:absolute;inset:0;background:linear-gradient(180deg,var(--void) 0%,rgba(11,11,11,.15) 30%,rgba(11,11,11,.55) 100%)}
.glass{position:relative;z-index:2;width:min(1100px,94vw);border-radius:10px;border:1px solid rgba(255,255,255,.14);background:rgba(18,18,20,.34);backdrop-filter:blur(34px) saturate(130%);padding:8vh 24px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:30px}
.glass .floc{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--ash);line-height:1.8}
.glass .fmark{height:66px;filter:invert(1) brightness(1.9)}
.glass .fword{font-family:var(--cond);font-size:clamp(24px,3vw,40px);letter-spacing:.16em;text-transform:uppercase;text-indent:.16em;line-height:1}
.glass .fpills{display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.glass .gp{font-family:var(--prose);font-size:14px;color:var(--ash);max-width:560px;line-height:1.6;letter-spacing:-.01em;margin:0}
.fbot{position:absolute;bottom:22px;left:32px;right:32px;z-index:2;display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;text-transform:uppercase;color:var(--ash)}
@media(max-width:640px){.fbot{flex-direction:column;gap:6px;align-items:center}}
/* reveal */
.rv{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.08s}.rv.d2{transition-delay:.16s}.rv.d3{transition-delay:.24s}
/* preloader */
.pre{position:fixed;inset:0;z-index:600;background:var(--abyss);display:flex;align-items:center;justify-content:center;transition:opacity 1s var(--ease),visibility 1s}
.pre.done{opacity:0;visibility:hidden}
.pre img{height:64px;filter:invert(1) brightness(1.8);opacity:0;animation:preIn 1.4s var(--ease) .15s forwards}
@keyframes preIn{to{opacity:1}}
@media (prefers-reduced-motion: reduce){
  .strip .tk,.grain{animation:none}
  #env,#cur{display:none}
  .ws .w{opacity:1!important}
  .rv{opacity:1;transform:none;transition:none}
  .rv .ln,.sec-label .ln{transform:scaleX(1)}
  .menu,.pill,.burger span{transition-duration:.01s}
}
