@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('assets/PlusJakartaSans.woff2') format('woff2');
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
}
@font-face {
  font-family: 'Inter';
  src: url('assets/Inter.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
:root {
  --paper: #faf7f0;
  --ink: #052a22;
  --orange: #fd4a00;
  --green: #478a2b;
}
*,*::before,*::after{box-sizing:border-box}
html{min-width:300px;scroll-behavior:smooth}
body{
  margin:0;
  min-width:300px;
  min-height:100svh;
  color:var(--ink);
  background:#edf1e7;
  font-family:'Plus Jakarta Sans','Inter',system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.skip-link{position:fixed;z-index:10;top:10px;left:10px;background:#fff;border:2px solid var(--orange);padding:10px 15px;transform:translateY(-160%)}
.skip-link:focus{transform:none}
a:focus-visible,button:focus-visible{outline:3px solid var(--green);outline-offset:4px}
.linktree{
  position:relative;
  z-index:0;
  isolation:isolate;
  margin:0 auto;
  width:100%;
  max-width:468px;
  min-height:100svh;
  overflow:hidden;
  background:var(--paper);
  box-shadow:0 0 0 1px rgba(5,42,34,.06),0 25px 75px rgba(15,44,30,.11);
}
.linktree::before{
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  background:url('assets/paper-grain.png') repeat;
  background-size:128px 128px;
  opacity:.15;
  pointer-events:none;
}
.decor{position:absolute;z-index:-1;pointer-events:none}
.decor svg{width:100%;height:100%;display:block}
.decor--top{top:-5px;left:-2px;width:195px;height:195px;opacity:.83}
.decor--bottom{left:-35px;bottom:-12px;width:235px;height:235px;opacity:.70}
.watermark{position:absolute;z-index:-1;pointer-events:none;top:2px;right:-225px;width:610px;height:auto;opacity:.072;transform:rotate(-13deg)}
.content{
  position:relative;
  min-height:100svh;
  z-index:1;
  display:flex;
  flex-direction:column;
  align-items:center;
  padding:58px clamp(20px,6.2vw,34px) 24px;
}
.scene-wrap{
  position:relative;
  width:100%;
  max-width:392px;
  margin:0 auto;
  line-height:0;
  pointer-events:none;
}
.scene{display:block;width:100%;height:auto;object-fit:contain;mix-blend-mode:normal}
.brand-header{
  margin:0;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}
.brand-title{margin:0;width:min(88%,338px);line-height:0}
.wordmark{display:block;width:100%;height:auto;object-fit:contain}
.link-list{
  display:flex;
  flex-direction:column;
  width:100%;
  gap:11px;
  margin-top:18px;
}
.link-button{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:61px;
  padding:13px 12px;
  border-radius:999px;
  text-align:center;
  text-decoration:none;
  font-size:clamp(15px,4vw,19px);
  font-weight:760;
  letter-spacing:-.035em;
  line-height:1.2;
  box-shadow:0 3px 0 rgba(71,51,27,.045),0 7px 17px rgba(43,39,32,.045);
  transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease;
  overflow:hidden;
}
.link-button::before{
  content:'';
  position:absolute;
  inset:0;
  z-index:0;
  background:url('assets/paper-grain.png') repeat;
  background-size:128px 128px;
  opacity:.62;
  pointer-events:none;
}
.link-button>*{position:relative;z-index:1}
.link-button:hover{transform:translateY(-2px);box-shadow:0 7px 20px rgba(43,39,32,.10)}
.link-button:active{transform:translateY(0)}
.link-button--primary{
  color:#fff;
  background:#f6530b;
  border:2px solid #f6530b;
}
.link-button--primary:hover{background:#e54b07}
.link-button--secondary{
  color:#092b26;
  background:#fffcf6;
  border:2px solid var(--orange);
}
.link-button--secondary:hover{background:#fff5e8}
.link-button--ardake{
  background:#fff5d6;
  border:1px solid rgba(219,181,84,.30);
  min-height:65px;
  margin-top:1px;
}
.link-button--ardake:hover{background:#fff0c2}
.link-button--ardake img{display:block;width:auto;max-width:min(64%,225px);height:49px;object-fit:contain}
.social-bar{display:flex;gap:19px;justify-content:center;align-items:center;margin-top:22px}
.social-link{
  width:47px;height:47px;
  border-radius:50%;
  background:rgba(205,231,189,.73);
  display:inline-flex;align-items:center;justify-content:center;
  color:#092b25;
  text-decoration:none;
  border:1px solid rgba(73,138,43,.08);
  transition:transform .18s ease,background .18s ease;
}
.social-link:hover{transform:translateY(-3px);background:#c3dfa9}
.social-link svg{width:25px;height:25px;display:block}
.footer-tools{margin-top:15px;display:flex;justify-content:center;width:100%}
.lang-switch{display:flex;align-items:center;gap:7px;color:#7a8d79;font-weight:670;font-size:10px;letter-spacing:.02em}
.language-button{border:0;background:none;color:#7a8d79;font-family:inherit;font-size:10px;font-weight:760;cursor:pointer;padding:7px 6px;border-radius:5px}
.language-button.is-active{color:var(--ink)}
.language-button:hover{background:rgba(201,225,189,.35)}
@media(min-width:540px){
  body{padding:24px 0}
  .linktree{min-height:calc(100svh - 48px);border-radius:30px}
  .content{min-height:calc(100svh - 48px)}
  .decor--top{width:205px;height:205px}
  .watermark{right:-235px;width:645px}
}
@media(max-width:389px){
  .content{padding:44px 19px 22px}
  .link-list{margin-top:12px;gap:10px}
  .link-button{min-height:55px;font-size:15px}
  .link-button--ardake{min-height:58px}
  .link-button--ardake img{height:42px}
  .social-bar{margin-top:15px;gap:17px}
  .social-link{width:43px;height:43px}
  .social-link svg{width:24px;height:24px}
  .footer-tools{margin-top:9px}
}
@media(max-width:335px){
  .link-button{font-size:14px}
  .content{padding-top:36px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;scroll-behavior:auto!important}
}
