/* Bharat Joy, Direction B "Gota invitation". Self-hosted fonts (SIL OFL, see /assets/fonts/licenses/). */
@font-face{font-family:Yeseva;src:url("/assets/fonts/YesevaOne.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:EBGaramond;src:url("/assets/fonts/EBGaramond-latin.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:EBGaramond;src:url("/assets/fonts/EBGaramond-Italic-latin.woff2") format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:Literata;src:url("/assets/fonts/Literata-latin.woff2") format("woff2");font-weight:400 600;font-display:swap}
@font-face{font-family:NotoDev;src:url("/assets/fonts/NotoSerifDevanagari-deva.woff2") format("woff2");font-weight:400;font-display:swap;unicode-range:U+0900-097F,U+1CD0-1CF9,U+200C-200D,U+25CC,U+A8E0-A8FF}

:root{
  --paper:#f3e6c8;--paper2:#efe0b8;--ink:#3d1014;--maroon:#6b1d24;--gold:#c4891a;--gold-text:#8a5a0c;
  --gold-line:#e8c56b;--mute:#5e4029;
  --display:Yeseva,NotoDev,Georgia,serif;
  --italic:EBGaramond,NotoDev,Georgia,serif;
  --text:Literata,NotoDev,Georgia,serif;
  --dev:NotoDev,Literata,Georgia,serif;
  --pad:64px;
}
*,*::before,*::after{box-sizing:border-box}
html,body,h1,h2,h3,p,ul,ol,li,figure{margin:0;padding:0}
html{background:#6b1d24;color:var(--ink);font-family:var(--text);-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  background:repeating-linear-gradient(90deg,#7a2428 0 10px,#5c171c 10px 14px,#8a3030 14px 18px,#5c171c 18px 22px),#6b1d24;
  padding:14px;min-height:100vh;overflow-x:hidden;line-height:1.5;
}
img,svg{display:block;max-width:100%}
ul[class],ol[class]{list-style:none}
a{color:var(--maroon)}
a:focus-visible,button:focus-visible{outline:3px solid var(--ink);outline-offset:3px;box-shadow:0 0 0 6px var(--gold-line);border-radius:2px}
[lang="hi"]{font-family:var(--dev)}
html[lang="hi"] body{font-family:var(--text)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:24px;top:-60px;z-index:20;background:var(--maroon);color:var(--paper);padding:0 16px;min-height:48px;display:inline-flex;align-items:center;text-decoration:none;font-weight:600}
.skip:focus{top:20px}

.page{
  background:
    radial-gradient(circle at 12% 8%,rgba(227,155,28,.16),transparent 28%),
    radial-gradient(circle at 90% 90%,rgba(107,29,36,.08),transparent 30%),
    linear-gradient(180deg,#f7edd4 0%,#f3e6c8 40%,#efe0b8 100%);
  min-height:calc(100vh - 28px);
  border:1px solid var(--gold-line);
  box-shadow:inset 0 0 0 6px #6b1d24,inset 0 0 0 7px var(--gold-line),inset 0 0 0 11px #6b1d24;
  position:relative;overflow:hidden;padding-bottom:16px;
}
.page-home{padding-bottom:110px}
.page-home::before,.page-home::after{
  content:"";position:absolute;width:160px;height:160px;pointer-events:none;opacity:.4;z-index:0;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 80'><path d='M10 70 C10 30 40 10 55 18 C70 26 62 48 40 50 C58 52 68 68 40 72 C24 74 10 70 10 70Z' fill='none' stroke='%236b1d24' stroke-width='1.4'/><circle cx='48' cy='32' r='4' fill='none' stroke='%23c4891a' stroke-width='1.2'/></svg>") no-repeat;
}
.page-home::before{top:18px;left:18px}
.page-home::after{bottom:18px;right:18px;transform:rotate(180deg)}
main{display:block;position:relative;z-index:2}

/* Header */
.site-header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px var(--pad) 10px;position:relative;z-index:3}
.home-header{padding-bottom:0}
.brand{font-family:var(--display);font-size:18px;color:var(--ink);text-decoration:none;line-height:1.2;padding:6px 0;display:inline-block;min-height:48px}
.brand span{display:block;font-size:13px;color:var(--maroon)}
.nav{display:flex;flex-wrap:wrap;gap:4px 22px}
.nav a{color:var(--maroon);font-size:16px;text-decoration:none;font-family:var(--italic);font-style:italic;padding:0 4px;min-height:48px;min-width:48px;display:inline-flex;align-items:center;justify-content:center}
.nav a:hover,.nav a[aria-current="page"]{text-decoration:underline;text-underline-offset:4px}
.lang{display:none;align-items:center;border:1px solid var(--maroon);padding:2px;gap:2px}
.js .lang{display:inline-flex}
.no-js .home-header{justify-content:flex-end}
.lang-btn{font:inherit;font-size:13px;letter-spacing:.1em;min-width:48px;min-height:48px;padding:0 10px;border:0;background:transparent;color:var(--maroon);cursor:pointer}
.lang-btn[data-lang="hi"]{font-family:var(--dev);letter-spacing:0;font-size:15px}
.lang-btn[aria-pressed="true"]{background:var(--maroon);color:var(--paper)}

/* Toran */
.toran{display:flex;justify-content:center;align-items:flex-start;gap:5px;padding:16px 0 0;position:relative;z-index:2;border-top:1px solid rgba(196,137,26,.35);margin:8px 80px 0}
.bead{width:22px;height:22px;border-radius:50% 50% 45% 45%;background:radial-gradient(circle at 35% 30%,#f7d56a,#e39b1c 45%,#b86a0c);box-shadow:0 4px 0 #6b1d24;flex:none}
.bead:nth-child(4n+2){background:radial-gradient(circle at 35% 30%,#f6c9c0,#c94b4b 50%,#7a1c1c);margin-top:8px}
.leaf{width:14px;height:28px;background:#2f6b38;border-radius:80% 0 80% 0;margin-top:4px;opacity:.85;flex:none}

/* Home hero */
.hero{text-align:center;padding:18px 48px 0;position:relative;z-index:2}
.kicker{font-family:var(--italic);font-style:italic;color:var(--mute);letter-spacing:.18em;font-size:14px;text-transform:uppercase}
.hero h1{font-family:var(--display);font-size:92px;line-height:.95;color:var(--ink);margin:10px 0 6px;font-weight:400}
.hero .hi{font-size:36px;color:var(--maroon);margin-bottom:12px}
.tag{font-family:var(--italic);font-style:italic;font-size:28px;color:var(--maroon)}
.manifesto{max-width:560px;margin:16px auto 0;font-size:18px;line-height:1.65;color:var(--mute)}

/* Studio band */
.studio-band{
  margin:36px 48px 8px;padding:18px 20px 16px;
  background:radial-gradient(circle at 50% 30%,rgba(232,197,107,.16),transparent 55%),repeating-linear-gradient(90deg,rgba(232,197,107,.07) 0 12px,transparent 12px 24px),#5a1820;
  border-top:3px solid var(--maroon);border-bottom:3px solid var(--maroon);
  box-shadow:0 0 0 1px var(--gold-line),0 0 0 4px var(--maroon);position:relative;z-index:2;
}
.windows{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}
.win{aspect-ratio:4/3;border-radius:6px;overflow:hidden;box-shadow:0 0 0 2px var(--gold-line),0 0 0 5px #3d1014,0 0 0 6px var(--gold-line)}
.win a{display:block;width:100%;height:100%;min-width:48px;min-height:48px}
.win img{width:100%;height:100%;object-fit:cover;object-position:center}
.icon-rail{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:16px}
.icon-rail a,.icon-rail span{display:block;border-radius:11px}
.icon-rail a{display:flex;align-items:center;justify-content:center;min-width:48px;min-height:48px}
.icon-rail img{width:44px;height:44px;border-radius:11px;box-shadow:0 0 0 2px var(--gold-line),0 3px 8px rgba(0,0,0,.35)}
.band-caption{text-align:center;font-family:var(--italic);font-style:italic;color:var(--maroon);font-size:16px;margin:12px 48px 8px;position:relative;z-index:2}

/* Catalogue */
.catalog{padding:28px var(--pad) 20px}
.catalog-intro{text-align:center;margin:0 0 8px}
.catalog-intro h2{font-family:var(--display);font-weight:400;font-size:36px;margin-bottom:6px}
.catalog-intro p{color:var(--mute);font-size:17px}
.entry{display:grid;grid-template-columns:280px 1fr;gap:48px;align-items:center;padding:40px 0;border-bottom:1px solid rgba(107,29,36,.25)}
.entry.alt{grid-template-columns:1fr 280px}
.entry.alt .copy{order:1}
.entry.alt .frame{order:2}
.game-name{font-family:var(--display);font-size:42px;font-weight:400;line-height:1.1;margin:4px 0}
.game-name a{color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;min-height:48px}
.game-name a:hover{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:6px}
.hn{color:var(--maroon);font-size:20px;margin-bottom:10px}
.pill{display:inline-block;border:1px solid var(--maroon);color:var(--maroon);font-size:12px;letter-spacing:.12em;text-transform:uppercase;padding:3px 9px;margin-bottom:12px}
html[lang="hi"] .pill,html[lang="hi"] .kicker{letter-spacing:0;font-size:14px;text-transform:none}
p.body{font-size:17px;line-height:1.6;color:var(--mute);max-width:520px}
.more{display:inline-flex;align-items:center;min-height:48px;margin-top:6px;font-family:var(--italic);font-style:italic;font-size:18px;color:var(--maroon);text-decoration:none;border-bottom:1px solid rgba(107,29,36,.35)}
.more:hover{border-bottom-color:var(--maroon)}

/* Phone frame */
.phone{width:240px;margin:0 auto;filter:drop-shadow(0 18px 22px rgba(80,20,20,.28))}
.bezel{background:#2a1610;border-radius:34px;padding:10px;box-shadow:inset 0 0 0 1px var(--gold-line)}
.screen{border-radius:24px;overflow:hidden;aspect-ratio:390/844;background:#1a0a08}
.screen img{width:100%;height:100%;object-fit:cover;object-position:top}
.screen.r169{aspect-ratio:9/16}

/* Workshop */
.workshop{padding:36px var(--pad) 20px}
.workshop h2{font-family:var(--display);font-weight:400;font-size:28px;margin-bottom:6px}
.workshop .lead{color:var(--mute);margin-bottom:22px}
.contents{display:grid;grid-template-columns:1fr 1fr;gap:0 48px;border-top:1px solid rgba(107,29,36,.3)}
.contents li{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid rgba(107,29,36,.2)}
.contents img{width:52px;height:52px;border-radius:12px;flex:none}
.contents strong{display:block;font-family:var(--display);font-weight:400;font-size:18px}
.contents span{display:block;color:var(--maroon);font-size:14px}
.contents em{display:block;font-style:normal;color:var(--mute);font-size:14px;margin-top:2px}

/* Footer */
.site-footer{margin:20px var(--pad) 36px;padding-top:20px;border-top:3px solid var(--maroon);display:grid;grid-template-columns:1.2fr .8fr 1.6fr;gap:24px;font-size:16px;color:var(--mute);font-family:var(--italic);position:relative;z-index:2}
.site-footer p{margin-bottom:4px}
.colophon-title{font-family:var(--display);color:var(--ink);font-size:18px}
.colophon-title span{font-size:14px;color:var(--maroon);margin-left:4px}
.foot-h{color:var(--ink);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
html[lang="hi"] .foot-h{letter-spacing:0;font-size:15px}
.foot-links{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.foot-links li a{display:inline-flex;align-items:center;min-height:48px;min-width:48px;padding:0}
.foot-mail{display:inline-flex;align-items:center;min-height:48px}

/* Game page */
.game-hero{display:grid;grid-template-columns:280px 1fr;gap:56px;align-items:center;padding:28px var(--pad) 20px}
.game-icon{width:84px;height:84px;border-radius:20px;margin-bottom:16px;box-shadow:0 8px 20px rgba(80,20,20,.25)}
.game-hero .kicker,.legal .kicker,.contact .kicker,.nf .kicker{color:var(--gold-text);letter-spacing:.08em;text-transform:none}
.game-hero h1{font-family:var(--display);font-size:56px;font-weight:400;line-height:1;margin:6px 0 4px}
.game-hero .hi{font-size:24px;color:var(--maroon);margin-bottom:10px}
.game-hero .tag{font-size:24px;margin-bottom:10px}
.lede{font-size:17px;line-height:1.65;color:var(--mute);max-width:520px}
.feature-block{display:grid;grid-template-columns:minmax(0,42rem) 260px;justify-content:space-between;gap:40px;align-items:center;padding:20px var(--pad) 28px}
.feature-block h2{font-family:var(--display);font-size:28px;font-weight:400;margin:0 0 12px}
.feats{border-top:1px solid rgba(107,29,36,.25)}
.feats li{padding:11px 0 11px 20px;position:relative;border-bottom:1px solid rgba(107,29,36,.2);font-size:16px;line-height:1.45}
.feats li::before{content:"";position:absolute;left:0;top:19px;width:7px;height:7px;border-radius:50%;background:var(--gold)}
.feat-shot .phone{width:220px}
.note{color:var(--mute);font-size:15px;line-height:1.55;padding:0 var(--pad) 18px;max-width:calc(40rem + 2 * var(--pad))}
.links{padding:0 var(--pad) 28px;display:flex;flex-wrap:wrap;gap:8px 22px;align-items:center}
.links a,.cta{font-family:var(--italic);font-style:italic;font-size:18px;color:var(--maroon);min-height:48px;display:inline-flex;align-items:center}
.cta-label{border:1px solid var(--maroon);padding:0 14px;font-style:normal;font-family:var(--text);font-size:15px;letter-spacing:.04em}
a.cta{border:1px solid var(--maroon);background:var(--maroon);color:var(--paper);padding:0 16px;text-decoration:none;font-style:normal}

/* Legal + contact + 404 */
.wrap{padding:28px var(--pad) 40px;max-width:calc(46rem + 2 * var(--pad));margin:0 auto}
.legal h1,.contact h1,.nf h1{font-family:var(--display);font-size:40px;font-weight:400;line-height:1.1;margin:8px 0 6px}
.legal .hi{color:var(--maroon);font-size:20px;margin-bottom:10px}
.meta{color:var(--mute);font-size:15px;margin-bottom:22px;line-height:1.55}
.legal h2,.contact h2{font-family:var(--display);font-size:22px;margin:28px 0 8px;color:var(--maroon);font-weight:400}
.legal p,.legal li,.contact p{font-size:16px;line-height:1.7}
.legal p+p{margin-top:10px}
.legal ul,.legal ol{padding-left:20px;margin:6px 0 10px}
.legal li{margin:4px 0}
.legal a{overflow-wrap:anywhere}
.rule{border:0;border-top:1px solid rgba(107,29,36,.3);margin:28px 0}
.legal-note{margin:12px auto 0;max-width:calc(46rem);padding:10px 14px;border:1px dashed var(--maroon);color:var(--maroon);font-size:16px;background:rgba(255,248,231,.6)}
.legal-foot{display:flex;flex-wrap:wrap;gap:4px 22px;padding:0 var(--pad);max-width:calc(46rem + 2 * var(--pad));margin:0 auto}
.legal-foot a{font-family:var(--italic);font-style:italic;font-size:17px;min-height:48px;display:inline-flex;align-items:center}
.contact .lede{margin:8px 0 18px}
.contact p{margin-bottom:12px;color:var(--ink)}
.mail-card{border:1px solid var(--maroon);box-shadow:inset 0 0 0 3px var(--paper),inset 0 0 0 4px var(--gold-line);padding:18px 20px;margin:0 0 18px;background:rgba(255,248,231,.55)}
.mail{font-family:var(--display);font-size:24px;overflow-wrap:anywhere;display:inline-flex;align-items:center;min-height:48px}
.contact-games li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:6px 12px;padding:8px 0;border-bottom:1px solid rgba(107,29,36,.2)}
.contact-game{display:flex;align-items:center;gap:12px;min-height:48px;text-decoration:none;color:var(--ink)}
.contact-game img{width:48px;height:48px;border-radius:11px}
.contact-game strong{display:block;font-family:var(--display);font-weight:400;font-size:18px}
.contact-game span span{display:block;color:var(--maroon);font-size:14px}
.small{font-family:var(--italic);font-style:italic;font-size:16px;min-height:48px;display:inline-flex;align-items:center}
.contact-more{display:flex;flex-wrap:wrap;align-items:center;column-gap:10px;margin-top:6px}
.center{text-align:center}
.still-board{width:180px;height:180px;margin:12px auto 18px;filter:drop-shadow(0 12px 18px rgba(80,20,20,.25))}
.nf .lede{margin:0 auto 10px}

/* Language swap fade */
.swap main,.swap .site-footer,.swap .nav{opacity:0}
main,.site-footer,.nav{transition:opacity .2s ease}

/* Motion: only when the visitor has not asked for less */
@media (prefers-reduced-motion:no-preference){
  .lift{transition:transform .35s ease,filter .35s ease}
  .entry:hover .lift{transform:translateY(-5px);filter:drop-shadow(0 26px 26px rgba(80,20,20,.32))}
  .float{animation:float 7s ease-in-out infinite}
  @keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
  .sheen{background:linear-gradient(100deg,var(--ink) 0 42%,#a2661a 48%,var(--ink) 54% 100%) 0 0/250% 100% no-repeat;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sheen 8s ease-in-out infinite}
  @keyframes sheen{0%,70%{background-position:100% 0}100%{background-position:-50% 0}}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  main,.site-footer,.nav{transition:none}
}

/* Wide */
@media (min-width:1400px){
  :root{--pad:88px}
  .hero h1{font-size:104px}
  .studio-band{margin-left:72px;margin-right:72px;padding:22px 26px 18px}
  .icon-rail img{width:48px;height:48px}
  .entry .phone{width:252px}
  .entry{grid-template-columns:300px 1fr}
  .entry.alt{grid-template-columns:1fr 300px}
}

/* Tablet */
@media (max-width:900px){
  :root{--pad:36px}
  .page-home::before{display:none}
  .hero{padding-left:36px;padding-right:36px}
  .site-header{padding-top:18px}
  .nav{gap:0 16px}
  .nav a{font-size:15px}
  .toran{margin:8px 36px 0;gap:4px}
  .hero h1{font-size:72px}
  .hero .hi{font-size:30px}
  .tag{font-size:24px}
  .studio-band{margin:28px 28px 8px;padding:14px 14px 12px}
  .windows{gap:10px}
  .icon-rail{gap:10px}
  .icon-rail img{width:38px;height:38px;border-radius:9px}
  .band-caption{margin:10px 28px 8px;font-size:15px}
  .entry,.entry.alt{grid-template-columns:1fr;gap:20px;padding:32px 0}
  .entry .frame,.entry.alt .frame{order:-1}
  .entry .copy,.entry.alt .copy{order:1}
  .entry .phone{width:220px}
  .game-name{font-size:34px}
  .site-footer{grid-template-columns:1fr 1fr}
  .site-footer>div:first-child{grid-column:1/-1}
  .game-hero{grid-template-columns:1fr;gap:22px;text-align:center}
  .game-hero .phone{width:220px}
  .game-icon{margin-left:auto;margin-right:auto}
  .game-hero .lede{margin:0 auto}
  .game-hero h1{font-size:44px}
  .feature-block{grid-template-columns:1fr}
  .legal h1,.contact h1,.nf h1{font-size:34px}
}

/* Phone */
@media (max-width:600px){
  :root{--pad:22px}
  body{padding:8px}
  .page{box-shadow:inset 0 0 0 4px #6b1d24,inset 0 0 0 5px var(--gold-line),inset 0 0 0 8px #6b1d24}
  .page-home::before{display:none}
  .page-home::after{width:96px;height:96px;bottom:14px;right:14px}
  .page-home{padding-bottom:90px}
  .foot-links{grid-template-columns:1fr}
  .hero{padding-left:22px;padding-right:22px}
  .site-header{padding-top:14px;flex-wrap:wrap;row-gap:0}
  .site-header .nav{order:3;width:100%;justify-content:center;gap:0 14px;border-top:1px solid rgba(196,137,26,.3);margin-top:6px}
  .nav a{font-size:15px}
  .toran{margin:6px 16px 0;gap:3px}
  .bead{width:16px;height:16px}
  .leaf{width:10px;height:20px}
  .hero h1{font-size:56px}
  .hero .hi{font-size:26px}
  .tag{font-size:22px}
  .manifesto{font-size:17px}
  .studio-band{margin:22px 14px 6px;padding:10px}
  .windows{gap:7px}
  .win{aspect-ratio:1/1;box-shadow:0 0 0 1px var(--gold-line),0 0 0 3px #3d1014,0 0 0 4px var(--gold-line)}
  .icon-rail{gap:6px;margin-top:12px}
  .icon-rail img{width:32px;height:32px;border-radius:8px}
  .band-caption{margin:8px 22px 4px;font-size:14px}
  .entry,.entry.alt{padding:28px 0}
  .entry .phone,.game-hero .phone{width:210px}
  .game-name{font-size:32px}
  .contents{grid-template-columns:1fr}
  .site-footer{grid-template-columns:1fr;margin:10px var(--pad) 28px}
  .game-hero h1{font-size:40px}
  .feat-shot .phone{width:210px}
  .legal h1,.contact h1,.nf h1{font-size:30px}
  .legal-note{margin:12px var(--pad) 0}
  .mail{font-size:20px}
}
@media (max-width:360px){
  .site-header .nav{gap:0 4px}
  .nav a{font-size:14px}
  .hero h1{font-size:48px}
}
