/* origamens.com — paper & ink design system */

:root{
  --paper:#FBF8F1;
  --paper-raised:#FFFDF7;
  --paper-deep:#F1EBDE;
  --crease:#DFD6C3;
  --ink:#141820;
  --ink-soft:#4A5162;
  --ink-faint:#7C8396;
  --indigo:#25336B;
  --indigo-lift:#37478A;
  --seal:#B1452F;
  --shadow-near:0 1px 0 rgba(20,24,32,.06), 0 6px 16px -10px rgba(20,24,32,.35);
  --shadow-lift:0 2px 0 rgba(20,24,32,.05), 0 22px 44px -28px rgba(20,24,32,.55);
  --fold:22px;
  --wrap:1140px;
  --serif:"Cormorant Garamond",Georgia,serif;
  --display:"Jost",-apple-system,"Segoe UI",sans-serif;
  --body:"Karla","Helvetica Neue",Arial,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  font-size:17px;
  line-height:1.68;
  background-image:
    linear-gradient(115deg,rgba(255,255,255,.7) 0 38%,rgba(241,235,222,.55) 38% 39%,rgba(255,255,255,0) 39%),
    linear-gradient(200deg,rgba(241,235,222,.4) 0 62%,rgba(223,214,195,.35) 62% 62.4%,rgba(255,255,255,0) 62.4%);
  background-attachment:fixed;
}
img{max-width:100%;display:block}
a{color:var(--indigo);text-underline-offset:3px}
a:hover{color:var(--seal)}
h1,h2,h3,h4{font-family:var(--display);font-weight:400;letter-spacing:.005em;line-height:1.18;margin:0 0 .6em}
h1{font-size:clamp(2.2rem,5.4vw,3.5rem)}
h2{font-size:clamp(1.55rem,3.2vw,2.15rem)}
h3{font-size:1.18rem;letter-spacing:.04em}
p{margin:0 0 1.15em}
.wrap{width:min(100% - 2.6rem,var(--wrap));margin-inline:auto}
.eyebrow{font-family:var(--display);text-transform:uppercase;letter-spacing:.28em;font-size:.7rem;color:var(--ink-faint);margin:0 0 1rem}

/* ---- signature device: folded-corner paper panel ---- */
.fold{
  position:relative;
  background:var(--paper-raised);
  border:1px solid var(--crease);
  box-shadow:var(--shadow-near);
  padding:1.9rem 1.9rem 1.75rem;
  clip-path:polygon(0 0,calc(100% - var(--fold)) 0,100% var(--fold),100% 100%,0 100%);
}
.fold::after{
  content:"";position:absolute;top:0;right:0;
  width:var(--fold);height:var(--fold);
  background:linear-gradient(225deg,var(--paper-deep) 0 50%,var(--crease) 50% 52%,rgba(0,0,0,.07) 52%);
}
.fold--lift{box-shadow:var(--shadow-lift)}
.fold--ink{background:var(--indigo);border-color:var(--indigo);color:#F3F0E8}
.fold--ink h1,.fold--ink h2,.fold--ink h3{color:#FFFDF7}
.fold--ink::after{background:linear-gradient(225deg,#1B2650 0 50%,#4A5A9B 50% 52%,rgba(0,0,0,.25) 52%)}
.fold--ink a{color:#D9CFAF}

/* fold-line divider */
.crease{
  height:26px;margin:3.6rem 0;border:0;
  background:
    linear-gradient(to right,transparent,var(--crease) 12%,var(--crease) 88%,transparent) center/100% 1px no-repeat,
    linear-gradient(45deg,transparent calc(50% - .6px),var(--crease) calc(50% - .6px) calc(50% + .6px),transparent calc(50% + .6px)) center/26px 26px no-repeat;
}

/* ---- header ---- */
.site-head{border-bottom:1px solid var(--crease);background:rgba(251,248,241,.94);backdrop-filter:blur(6px);position:sticky;top:0;z-index:40}
.head-in{display:flex;align-items:center;gap:1.2rem;padding:.9rem 0;justify-content:space-between}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:var(--ink)}
.brand .mark{width:30px;height:30px;flex:none;border-radius:6px}
.brand b{font-family:var(--display);font-weight:400;font-size:1.32rem;letter-spacing:.14em;text-transform:lowercase}
.brand span{display:block;font-size:.6rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink-faint);margin-top:-2px}
.nav ul{display:flex;gap:1.5rem;list-style:none;margin:0;padding:0}
.nav a{font-family:var(--display);font-size:.84rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;color:var(--ink-soft)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--indigo)}
.nav a[aria-current="page"]{box-shadow:inset 0 -1px 0 var(--seal)}
.navtoggle{display:none;background:var(--paper-raised);border:1px solid var(--crease);font-family:var(--display);letter-spacing:.16em;text-transform:uppercase;font-size:.74rem;padding:.55rem .9rem;color:var(--ink);cursor:pointer}
@media (max-width:860px){
  .navtoggle{display:block}
  .nav{position:absolute;left:0;right:0;top:100%;background:var(--paper-raised);border-bottom:1px solid var(--crease);box-shadow:var(--shadow-lift);display:none}
  .nav.open{display:block}
  .nav ul{flex-direction:column;gap:0;padding:.5rem 1.3rem 1.1rem}
  .nav li{border-top:1px solid var(--crease)}
  .nav li:first-child{border-top:0}
  .nav a{display:block;padding:.85rem 0;font-size:.95rem}
}

/* ---- buttons ---- */
.btn{
  display:inline-block;font-family:var(--display);letter-spacing:.16em;text-transform:uppercase;font-size:.8rem;
  padding:.85rem 1.6rem;text-decoration:none;cursor:pointer;border:1px solid var(--indigo);
  background:var(--indigo);color:#FFFDF7;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,0 100%);
  transition:background .18s ease,transform .18s ease;
}
.btn:hover{background:var(--indigo-lift);color:#FFFDF7;transform:translateY(-1px)}
.btn--ghost{background:transparent;color:var(--indigo);border-color:var(--crease)}
.btn--ghost:hover{background:var(--paper-deep);color:var(--indigo)}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.42;pointer-events:none}

/* ---- hero ---- */
.hero{
  position:relative;
  padding:0 0 2.4rem;
  background:var(--paper);
}
.hero-stage{
  position:relative;
  height:min(78vh,740px);
  overflow:hidden;
  isolation:isolate;
}
.hero-bleed{
  position:absolute;inset:0;
  background:#0A0A0A;
}
.hero-bleed img{
  width:100%;height:100%;
  object-fit:cover;object-position:62% 38%;
  display:block;
  transform:scale(1.06);
  animation:hero-drift 22s ease-in-out infinite alternate;
  will-change:transform;
}
.hero-fade{
  position:absolute;inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(10,10,10,.55) 0%,rgba(10,10,10,.18) 38%,rgba(10,10,10,0) 62%),
    linear-gradient(180deg,rgba(10,10,10,.35) 0%,transparent 28%,transparent 48%,rgba(251,248,241,.55) 78%,var(--paper) 100%);
}
.hero-grain{
  position:absolute;inset:0;pointer-events:none;opacity:.18;mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
}
.hero-copy{
  position:relative;
  z-index:2;
  margin-top:-11.5rem;
  padding:2.35rem 2.2rem 2.1rem;
  max-width:min(100% - 2.6rem, 34rem);
  margin-inline:max(1.3rem, calc((100% - var(--wrap)) / 2));
  background:var(--paper-raised);
  border:1px solid var(--crease);
  box-shadow:var(--shadow-lift), 0 0 0 1px rgba(255,253,247,.4) inset;
  clip-path:polygon(0 0,calc(100% - var(--fold)) 0,100% var(--fold),100% 100%,0 100%);
  animation:hero-rise .95s cubic-bezier(.22,1,.36,1) both;
}
.hero-copy::after{
  content:"";position:absolute;top:0;right:0;
  width:var(--fold);height:var(--fold);
  background:linear-gradient(225deg,var(--paper-deep) 0 50%,var(--crease) 50% 52%,rgba(0,0,0,.08) 52%);
}
.hero-brand{
  font-family:var(--display);
  font-weight:400;
  font-size:clamp(1.05rem,2.4vw,1.35rem);
  letter-spacing:.28em;
  text-transform:lowercase;
  color:var(--ink);
  margin:0 0 1.15rem;
  animation:hero-fade-up .8s .12s cubic-bezier(.22,1,.36,1) both;
}
.hero-brand span{
  display:block;
  margin-top:.35rem;
  font-size:.62rem;
  letter-spacing:.34em;
  text-transform:uppercase;
  color:var(--ink-faint);
}
.hero-copy .agebadge{
  margin-bottom:1.15rem;
  animation:hero-fade-up .8s .2s cubic-bezier(.22,1,.36,1) both;
}
.hero-copy h1{
  margin-bottom:.5em;
  font-size:clamp(2.35rem,5.8vw,3.65rem);
  letter-spacing:-.01em;
  animation:hero-fade-up .85s .28s cubic-bezier(.22,1,.36,1) both;
}
.hero-copy .lede{
  animation:hero-fade-up .85s .38s cubic-bezier(.22,1,.36,1) both;
}
.hero-copy .cta-row{
  animation:hero-fade-up .85s .48s cubic-bezier(.22,1,.36,1) both;
}
.hero-note{
  margin:1.55rem 0 0;
  font-size:.88rem;
  line-height:1.55;
  color:var(--ink-faint);
  max-width:40ch;
  animation:hero-fade-up .85s .56s cubic-bezier(.22,1,.36,1) both;
}
.hero--page .hero-stage{height:min(52vh,480px)}
.hero--page .hero-copy{
  margin-top:-7.5rem;
  max-width:min(100% - 2.6rem, 38rem);
}
.hero--page .hero-bleed img{object-position:58% 42%;animation-duration:28s}
.lede{font-size:1.14rem;color:var(--ink-soft);max-width:42ch;margin-bottom:0}
.agebadge{
  display:inline-flex;align-items:center;gap:.55rem;
  font-family:var(--display);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--seal);border:1px solid var(--crease);background:var(--paper);
  padding:.45rem .8rem;margin-bottom:1.4rem;
}
.cta-row{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.55rem}

@keyframes hero-drift{
  from{transform:scale(1.06) translate3d(0,0,0)}
  to{transform:scale(1.12) translate3d(-1.4%,1%,0)}
}
@keyframes hero-rise{
  from{opacity:0;transform:translateY(28px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes hero-fade-up{
  from{opacity:0;transform:translateY(14px)}
  to{opacity:1;transform:translateY(0)}
}

@media (max-width:860px){
  .hero-stage{height:min(62vh,560px)}
  .hero-bleed img{object-position:70% 35%}
  .hero-fade{
    background:
      linear-gradient(180deg,rgba(10,10,10,.25) 0%,transparent 22%,transparent 40%,rgba(251,248,241,.7) 72%,var(--paper) 100%);
  }
  .hero-copy{
    margin-top:-8.5rem;
    max-width:calc(100% - 2.6rem);
    padding:1.85rem 1.55rem 1.7rem;
  }
  .hero--page .hero-stage{height:min(46vh,380px)}
  .hero--page .hero-copy{margin-top:-5.5rem}
}
@media (prefers-reduced-motion:reduce){
  .hero-bleed img,.hero-copy,.hero-brand,.hero-copy .agebadge,.hero-copy h1,.hero-copy .lede,.hero-copy .cta-row,.hero-note{
    animation:none!important;
  }
  .hero-bleed img{transform:none}
}

/* ---- generic sections ---- */
.section{padding:3.2rem 0}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.3rem}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.3rem}
@media (max-width:900px){.grid-3,.grid-2{grid-template-columns:1fr}}
.num{font-family:var(--display);font-size:.72rem;letter-spacing:.26em;color:var(--seal);display:block;margin-bottom:.6rem}
.prose{max-width:66ch}
.prose h2{margin-top:2.2rem}
.prose ul{padding-left:1.1rem}
.prose li{margin-bottom:.5rem}

/* ---- trust strip ---- */
.trust{border-block:1px solid var(--crease);background:var(--paper-deep);padding:1.6rem 0}
.trust ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.trust li{font-size:.9rem;color:var(--ink-soft);padding-left:1.6rem;position:relative}
.trust li::before{content:"";position:absolute;left:0;top:.5em;width:10px;height:10px;background:var(--indigo);clip-path:polygon(0 0,100% 0,0 100%)}
@media (max-width:860px){.trust ul{grid-template-columns:1fr}}

/* ---- game ---- */
.game{--fold:26px}
.game-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap;margin-bottom:1.1rem}
.meters{display:flex;gap:.6rem;flex-wrap:wrap}
.meter{background:var(--paper-deep);border:1px solid var(--crease);padding:.5rem .9rem;min-width:118px}
.meter span{display:block;font-family:var(--display);font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;color:var(--ink-faint)}
.meter b{font-family:var(--display);font-size:1.35rem;font-weight:400}
.dice-tray{display:flex;gap:1rem;justify-content:center;padding:1.9rem 0 1.4rem;flex-wrap:wrap}
.die{
  width:78px;height:78px;background:var(--paper-raised);border:1px solid var(--crease);
  box-shadow:var(--shadow-near);display:grid;grid-template:repeat(3,1fr)/repeat(3,1fr);
  padding:12px;gap:2px;
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);
}
.die i{width:11px;height:11px;border-radius:50%;background:var(--ink);align-self:center;justify-self:center}
.die i.off{background:transparent}
.die.rolling{animation:tumble .42s linear infinite}
@keyframes tumble{0%{transform:rotate(0) translateY(0)}25%{transform:rotate(7deg) translateY(-8px)}50%{transform:rotate(0) translateY(0)}75%{transform:rotate(-7deg) translateY(-6px)}100%{transform:rotate(0) translateY(0)}}
@media (prefers-reduced-motion:reduce){.die.rolling{animation:none;opacity:.55}}

.betgroup{margin-top:1.4rem}
.betgroup h3{font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-faint);margin-bottom:.7rem}
.chips{display:flex;flex-wrap:wrap;gap:.5rem}
.chip{
  font-family:var(--display);font-size:.86rem;letter-spacing:.06em;padding:.5rem .9rem;cursor:pointer;
  background:var(--paper-raised);border:1px solid var(--crease);color:var(--ink-soft);
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);
}
.chip:hover{border-color:var(--indigo);color:var(--indigo)}
.chip[aria-pressed="true"]{background:var(--indigo);border-color:var(--indigo);color:#FFFDF7}
.chip small{display:block;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;opacity:.75}
.totals{display:grid;grid-template-columns:repeat(8,1fr);gap:.4rem}
@media (max-width:700px){.totals{grid-template-columns:repeat(4,1fr)}}
.totals .chip{text-align:center;padding:.45rem .2rem}
.callout{
  margin-top:1.5rem;padding:1rem 1.1rem;border:1px solid var(--crease);background:var(--paper-deep);
  font-family:var(--display);letter-spacing:.04em;min-height:56px;display:flex;align-items:center;
}
.callout.win{border-color:var(--indigo);background:#EDEFF8;color:var(--indigo)}
.callout.lose{border-color:#E3CFC7;background:#F8EFEB;color:var(--seal)}
.controls{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.4rem;align-items:center}
.stakes{display:flex;gap:.4rem;align-items:center}
.paytable{width:100%;border-collapse:collapse;font-size:.94rem}
.paytable th,.paytable td{text-align:left;padding:.62rem .5rem;border-bottom:1px solid var(--crease)}
.paytable th{font-family:var(--display);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink-faint)}
.paytable td:last-child{font-family:var(--display);color:var(--seal);white-space:nowrap}

/* ---- faq ---- */
.faq{border-top:1px solid var(--crease)}
.faq dt{font-family:var(--display);font-size:1.05rem;margin:1.5rem 0 .4rem}
.faq dd{margin:0 0 1.2rem;color:var(--ink-soft)}

/* ---- footer ---- */
.site-foot{margin-top:4rem;border-top:1px solid var(--crease);background:var(--paper-deep);padding:2.8rem 0 2rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:2rem}
@media (max-width:860px){.foot-grid{grid-template-columns:1fr}}
.site-foot h4{font-family:var(--display);font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-faint);margin:0 0 .8rem}
.site-foot ul{list-style:none;margin:0;padding:0}
.site-foot li{margin-bottom:.45rem}
.site-foot a{text-decoration:none;font-size:.95rem}
.site-foot p{font-size:.9rem;color:var(--ink-soft)}
.legal{margin-top:2.2rem;padding-top:1.4rem;border-top:1px solid var(--crease);font-size:.84rem;color:var(--ink-faint)}
.legal strong{color:var(--seal);font-weight:600}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}