diff --git a/assets/bitsindri/bitsindri-1.webp b/assets/bitsindri/bitsindri-1.webp new file mode 100644 index 0000000..898eac4 Binary files /dev/null and b/assets/bitsindri/bitsindri-1.webp differ diff --git a/assets/bitsindri/bitsindri-2.webp b/assets/bitsindri/bitsindri-2.webp new file mode 100644 index 0000000..48239eb Binary files /dev/null and b/assets/bitsindri/bitsindri-2.webp differ diff --git a/assets/logos/juu-ride-logo.png b/assets/logos/juu-ride-logo.png new file mode 100644 index 0000000..52eb65c Binary files /dev/null and b/assets/logos/juu-ride-logo.png differ diff --git a/css/main.css b/css/main.css index 6832156..e32878e 100644 --- a/css/main.css +++ b/css/main.css @@ -41,7 +41,7 @@ body[data-theme=dark] { p, strong { - font-size: 0.9rem; + font-size: 1rem; max-width: 70ch; line-height: 1.6; color: rgba(var(--text-color), 0.8); @@ -79,6 +79,10 @@ ul { list-style: none; } +ol { + padding-left: 1rem; +} + .icon { width: 1.2rem; height: 1.2rem; @@ -219,23 +223,30 @@ article > * { display: flex; } -#above_fold { - padding-top: 0; - height: calc(100vh - 6rem); - text-align: center; - align-content: center; -} #above_fold h2 { - margin: auto; max-width: 46rem; + justify-self: center; + text-align: center; + margin-bottom: 3rem; } -#above_fold p { - max-width: none; +#above_fold ol { + display: block; + -moz-columns: 2 24rem; + columns: 2 24rem; + -moz-column-gap: 2rem; + column-gap: 2rem; +} +#above_fold ol li { + page-break-inside: avoid; + -moz-column-break-inside: avoid; + break-inside: avoid; + margin-bottom: 3rem; } #hero_illustration { - width: min(100%, 26rem); margin: auto; + margin-top: 4rem; + width: min(100%, 26rem); } section { @@ -351,6 +362,10 @@ section:nth-of-type(2) { padding-bottom: 3rem; } +#projects_section h2 { + margin-bottom: 3rem; +} + .project { display: grid; width: 100%; @@ -478,19 +493,49 @@ section:nth-of-type(2) { } #methodology_wrapper { - margin-bottom: 0; + display: flex; + flex-direction: column; + margin-top: 3rem; +} +#methodology_wrapper .milestone { + display: grid; + max-width: 42rem; + width: auto; + grid-template-areas: "label title" "label description"; + align-items: center; +} +#methodology_wrapper .milestone:not(:last-child) { + padding-bottom: 3rem; +} +#methodology_wrapper .milestone__label { + align-items: flex-start; + justify-content: center; + grid-area: label; +} +#methodology_wrapper .milestone__label::before { + width: 0.1rem; + height: 100%; +} +#methodology_wrapper .milestone__title { + grid-area: title; + margin-top: 0; + padding-left: 3rem; +} +#methodology_wrapper .milestone__description { + grid-area: description; + padding-left: 3rem; } -#economics_section h2 { +#economic_framework h2 { margin-bottom: 3rem; } -#economics_section ul { +#economic_framework ul { -moz-columns: 3 16rem; columns: 3 16rem; -moz-column-gap: 0.5rem; column-gap: 0.5rem; } -#economics_section li { +#economic_framework ul li { display: grid; gap: 0.5rem; align-items: flex-start; @@ -536,39 +581,47 @@ section:nth-of-type(2) { } #partners { - display: flex; - flex-wrap: wrap; + display: grid; + grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 1rem; - margin: auto; - justify-content: space-evenly; + margin-top: 3rem; } #partners a, #partners li:not(li:has(a)) { display: flex; - flex-direction: column; gap: 0.8rem; - text-align: center; - align-items: center; padding: 1rem; text-decoration: none; + width: 100%; + align-items: center; + background-color: rgba(var(--text-color), 0.06); + border-radius: 0.5rem; } #partners a .icon, #partners li:not(li:has(a)) .icon { width: 2rem; height: 2rem; } +#partners img { + height: 2rem; +} #partners span { font-weight: 500; color: rgba(var(--text-color), 0.8); + width: 100%; } -#media_coverage_section .carousel { +#media_coverage_section .masonry { + margin-top: 3rem; + display: flex; + flex-wrap: wrap; gap: 1rem; } -#media_coverage_section .carousel > * { - flex-shrink: 0; - width: min(100% - 2rem, 32rem); +#media_coverage_section .masonry iframe { + display: flex; + flex: 1 1 15rem; border-radius: 0.5rem; + max-width: max(100vw - 2.5rem); } #social_links { @@ -604,14 +657,15 @@ section:nth-of-type(2) { font-weight: 500; } -#services ul { - -moz-columns: 4 16rem; - columns: 4 16rem; - -moz-column-gap: 0.5rem; - column-gap: 0.5rem; -} -#services li { +#services_section ul { display: flex; + flex-wrap: wrap; + gap: 1rem; + margin-top: 3rem; +} +#services_section li { + display: flex; + flex: 1 1 20rem; gap: 1rem; align-items: center; padding: max(1rem, 2vw); @@ -621,12 +675,8 @@ section:nth-of-type(2) { -webkit-animation: slide-up 0.5s ease var(--delay) forwards; animation: slide-up 0.5s ease var(--delay) forwards; opacity: 0; - margin-bottom: 0.5rem; - -moz-column-break-inside: avoid; - break-inside: avoid; - page-break-inside: avoid; } -#services .icon { +#services_section .icon { height: 2.5rem; width: 2.5rem; } diff --git a/css/main.min.css b/css/main.min.css index f638b6f..ee86537 100644 --- a/css/main.min.css +++ b/css/main.min.css @@ -1 +1 @@ -*{padding:0;margin:0;box-sizing:border-box;font-family:"Roboto",sans-serif}:root{font-size:clamp(1rem,1.2vmax,1.2rem)}html,body{height:100%}body{--accent-color: #3d5afe;--secondary-color: #ffac2e;--text-color: 20, 20, 20;--foreground-color: 252, 253, 255;--background-color: 241, 243, 248;--danger-color: rgb(255, 75, 75);--green: #1cad59;--yellow: rgb(220, 165, 0);--inline-padding: max(1rem, 6vw);background-color:rgba(var(--background-color), 1)}body[data-theme=dark]{--accent-color: #6d83ff;--secondary-color: #d60739;--text-color: 220, 220, 220;--foreground-color: 27, 28, 29;--background-color: 21, 22, 22;--danger-color: rgb(255, 106, 106);--green: #00e676;--yellow: rgb(255, 213, 5)}p,strong{font-size:.9rem;max-width:70ch;line-height:1.6;color:rgba(var(--text-color), 0.8)}img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}h1{font-size:max(1.8rem,4vw)}h2{font-size:max(1.5rem,3vw)}h3{font-size:max(1.2rem,2vw)}h4{font-size:max(1rem,1.3vw)}img{-o-object-fit:contain;object-fit:contain}ul{list-style:none}.icon{width:1.2rem;height:1.2rem;fill:rgba(var(--text-color), 0.9)}.flex{display:flex}.align-items-center{align-items:center}.justify-content-center{justify-content:center}.justify-content-center{justify-content:center}.justify-self-start{justify-self:start}.justify-self-end{justify-self:end}.justify-self-center{justify-self:center}.align-self-start{align-self:start}.align-self-end{align-self:end}.align-self-center{align-self:center}.flex-column{flex-direction:column}.flex-1{flex:1}.grid{display:grid}.gap-0-3{gap:.3rem}.gap-0-5{gap:.5rem}.gap-1{gap:1rem}.gap-1-5{gap:1.5rem}.gap-2{gap:2rem}.gap-3{gap:3rem}.gap-4{gap:4rem}.text-center{text-align:center}article{padding-top:4rem}article>*{padding:max(1rem,2vw) var(--inline-padding)}#main_header{display:flex;align-items:center;justify-content:space-between;position:fixed;left:0;right:0;top:0;background-color:rgba(var(--foreground-color), 0.5);z-index:10;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem);padding:max(1rem,2vw) var(--inline-padding)}#main_header a{color:rgba(var(--text-color), 0.9);text-decoration:none}#main_header ul{list-style:none;display:flex;gap:.8rem}#main_header ul a{font-weight:500;font-size:.9rem}#main_header ul a::after{content:"";display:block;width:0;height:.15rem;background:var(--accent-color);transition:width .3s;margin:auto}#main_header ul a.active::after{width:1rem}#main_header ul .icon{display:flex}#above_fold{padding-top:0;height:calc(100vh - 6rem);text-align:center;align-content:center}#above_fold h2{margin:auto;max-width:46rem}#above_fold p{max-width:none}#hero_illustration{width:min(100%,26rem);margin:auto}section{display:grid;position:relative;min-height:90vh;align-content:center}section:nth-of-type(2){overflow:hidden}.section-header{display:flex;flex-direction:column;text-align:center;margin-bottom:3rem}.section-header::after{content:"•••";line-height:.5}#bitcoin_lineart{position:absolute;opacity:.2;height:80vh;width:auto;align-self:center;right:0}#el_salvador_section{position:relative;overflow:hidden}#el_salvador_map{position:absolute;opacity:.06;top:0;width:max(100vh,90vw);height:auto;left:50%;transform:translateX(-50%)}.carousel{display:flex;overflow-x:auto;border-radius:.5rem;margin-top:1.5rem;scroll-snap-type:x mandatory;scroll-padding:0 calc(1*var(--inline-padding));margin:3rem calc(-1*var(--inline-padding));padding:1rem calc(1*var(--inline-padding));scrollbar-width:none}.carousel::-webkit-scrollbar{display:none}.milestone{position:relative;display:flex;flex-direction:column;gap:1rem;width:min(100% - 1rem,28rem);flex-shrink:0;scroll-snap-align:start;padding-right:3rem}.milestone:last-of-type{padding-right:0}.milestone:last-of-type .milestone__label::before{display:none}.milestone__label{display:flex;align-items:center;background-color:rgba(var(--text-color), 1);color:rgba(var(--foreground-color), 1);padding:.4rem .5rem;align-self:flex-start;border-radius:.3rem;font-size:.9rem}.milestone__label::before{position:absolute;content:"";display:block;width:100%;height:.1rem;background-color:rgba(var(--text-color), 0.3);z-index:-1}.milestone__title{margin-top:3rem}.carousel-control{display:flex;border:none;background:none;padding:.7rem;border:solid thin rgba(var(--text-color), 0.5);border-radius:50%;cursor:pointer}.carousel:has(.project){padding-bottom:3rem}.project{display:grid;width:100%;border-radius:.8rem;border:solid thin rgba(var(--text-color), 0.1);background-color:rgba(var(--foreground-color), 1);box-shadow:0 .5rem 1rem rgba(var(--text-color), 0.1)}.project__images{display:flex;gap:1rem;flex-direction:column;flex:1;overflow-x:hidden;padding:1rem}.project__image{display:flex;flex:1;aspect-ratio:4/3;min-width:12rem;height:30vmax}.project__image img{min-height:30vmax;width:100%;-o-object-fit:cover;object-fit:cover;border-radius:.5rem}.project__images-wrapper{display:flex;overflow-x:auto;gap:.5rem}.project .thumbnail-button{width:5rem;aspect-ratio:4/3;border-radius:.5rem;overflow:hidden;cursor:pointer;border:none;flex-shrink:0;transition:transform .2s}.project .thumbnail-button.active{transform:scale(0.9)}.project .thumbnail{-o-object-fit:cover;object-fit:cover}.project__content{padding:max(1rem,2vw);text-align:left;display:flex;flex-direction:column;gap:1rem;flex:1}.project__button{font-size:.8rem;font-weight:700;text-decoration:none;text-transform:uppercase;color:rgba(var(--text-color), 1);background-color:rgba(var(--text-color), 0.1);padding:.5rem 1rem;border-radius:1rem;letter-spacing:.05em;align-self:flex-end;border:none;cursor:pointer}.project .project__hidden-details{grid-column:1/-1;padding:1rem;border-top:solid thin rgba(var(--text-color), 0.5);overflow:hidden}.project .project__hidden-details .carousel{z-index:2;margin-top:0;margin-bottom:0}.project .project__hidden-details .milestone{width:min(100% - 1rem,20rem)}.project .project__hidden-details .milestone__title{margin-top:.5rem;font-size:1.2rem}.badge{background-color:rgba(var(--text-color), 1);color:rgba(var(--foreground-color), 1);padding:.4rem .5rem;align-self:flex-start;border-radius:.3rem;font-size:.9rem;font-weight:500}#poc_stats{list-style:none;display:flex;gap:1rem;margin:1rem 0;padding:1rem;background-color:rgba(var(--text-color), 0.06);border-radius:.5rem}#poc_stats .stat{display:flex;flex-direction:column;gap:.5rem;flex:1}#poc_stats .stat__number{font-size:max(1.2rem,1.8vmax);font-weight:700}#poc_stats .stat__title{font-size:.9rem}#methodology_wrapper{margin-bottom:0}#economics_section h2{margin-bottom:3rem}#economics_section ul{-moz-columns:3 16rem;columns:3 16rem;-moz-column-gap:.5rem;column-gap:.5rem}#economics_section li{display:grid;gap:.5rem;align-items:flex-start;align-content:flex-start;background-color:rgba(var(--text-color), 0.06);border-radius:.5rem;padding:max(1rem,2vw);page-break-inside:avoid;-moz-column-break-inside:avoid;break-inside:avoid;margin-bottom:.5rem}#team_members{display:grid;grid-template-columns:repeat(auto-fill, minmax(max(8rem, 12vw), 1fr));gap:3rem 1.5rem;margin-top:3rem}.team-member{display:flex;flex-direction:column;text-align:center}.team-member img{-o-object-fit:cover;object-fit:cover;width:100%;aspect-ratio:3/3.5;border-radius:1rem;margin-bottom:1.2rem}.team-member__name{font-weight:700;font-size:1rem;line-height:1.2}.team-member__title{line-height:normal;font-weight:500;font-size:.9rem}#partners{display:flex;flex-wrap:wrap;gap:1rem;margin:auto;justify-content:space-evenly}#partners a,#partners li:not(li:has(a)){display:flex;flex-direction:column;gap:.8rem;text-align:center;align-items:center;padding:1rem;text-decoration:none}#partners a .icon,#partners li:not(li:has(a)) .icon{width:2rem;height:2rem}#partners span{font-weight:500;color:rgba(var(--text-color), 0.8)}#media_coverage_section .carousel{gap:1rem}#media_coverage_section .carousel>*{flex-shrink:0;width:min(100% - 2rem,32rem);border-radius:.5rem}#social_links{display:flex;flex-wrap:wrap;gap:.5rem;justify-items:center;width:100%;margin-top:3rem;grid-template-columns:repeat(auto-fill, minmax(8rem, 1fr))}#social_links li{width:100%;justify-content:center;box-shadow:0 0 0 0 rgba(var(--text-color), 1);transition:box-shadow .1s ease;flex:1 1 8rem;border-radius:.5rem}#social_links li:hover{box-shadow:0 0 0 .1rem rgba(var(--text-color), 1)}#social_links a{display:flex;width:100%;gap:.5rem;text-decoration:none;color:rgba(var(--text-color), 0.9);padding:1rem;justify-content:center;border-radius:inherit;background-color:rgba(var(--text-color), 0.06);font-weight:500}#services ul{-moz-columns:4 16rem;columns:4 16rem;-moz-column-gap:.5rem;column-gap:.5rem}#services li{display:flex;gap:1rem;align-items:center;padding:max(1rem,2vw);border:solid thin rgba(var(--text-color), 0.2);border-radius:.5rem;font-weight:500;-webkit-animation:slide-up .5s ease var(--delay) forwards;animation:slide-up .5s ease var(--delay) forwards;opacity:0;margin-bottom:.5rem;-moz-column-break-inside:avoid;break-inside:avoid;page-break-inside:avoid}#services .icon{height:2.5rem;width:2.5rem}#news_list{display:grid;gap:.5rem}#news_list li{container:news-item/inline-size}.news-item{display:grid;grid-template-columns:auto 1fr;grid-template-areas:" icon ." "icon ." "icon ." "icon .";gap:.5rem 1rem;border:solid thin rgba(var(--text-color), 0.5);border-radius:.5rem;padding:max(1rem,2vw);text-decoration:none;color:rgba(var(--text-color), 0.9);-webkit-animation:slide-up .5s ease var(--delay) forwards;animation:slide-up .5s ease var(--delay) forwards;opacity:0}.news-item__icon{grid-area:icon}.news-item__icon .icon{height:2rem;width:2rem}.news-item__date{background-color:rgba(var(--text-color), 0.1);margin-right:auto;padding:.1rem .5rem;border-radius:.3rem;font-weight:500;font-size:.8rem}@-webkit-keyframes slide-up{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@container news-item (max-width: 400px){.news-item{grid-template-areas:none;grid-template-columns:1fr}.news-item__icon{grid-area:unset}}@media screen and (max-width: 768px){#poc_images .poc-wrapper:nth-of-type(5){grid-area:3/2/4/3}.hide-on-small{display:none !important}}@media screen and (min-width: 768px){body{--inline-padding: max(1rem, 12vw)}#bitcoin_lineart{opacity:.6;left:calc(100% - 50vw)}.project{grid-template-columns:1fr 1fr}.hide-on-large{display:none !important}}@media screen and (any-hover: none){.carousel-controls{display:none}}@media screen and (any-hover: hover){::-webkit-scrollbar{width:.5rem;height:.5rem}::-webkit-scrollbar-thumb{background:rgba(var(--text-color), 0.3);border-radius:1rem}::-webkit-scrollbar-thumb:hover{background:rgba(var(--text-color), 0.5)}#main_header ul a:hover::after{width:1rem}}.hidden{display:none} \ No newline at end of file +*{padding:0;margin:0;box-sizing:border-box;font-family:"Roboto",sans-serif}:root{font-size:clamp(1rem,1.2vmax,1.2rem)}html,body{height:100%}body{--accent-color: #3d5afe;--secondary-color: #ffac2e;--text-color: 20, 20, 20;--foreground-color: 252, 253, 255;--background-color: 241, 243, 248;--danger-color: rgb(255, 75, 75);--green: #1cad59;--yellow: rgb(220, 165, 0);--inline-padding: max(1rem, 6vw);background-color:rgba(var(--background-color), 1)}body[data-theme=dark]{--accent-color: #6d83ff;--secondary-color: #d60739;--text-color: 220, 220, 220;--foreground-color: 27, 28, 29;--background-color: 21, 22, 22;--danger-color: rgb(255, 106, 106);--green: #00e676;--yellow: rgb(255, 213, 5)}p,strong{font-size:1rem;max-width:70ch;line-height:1.6;color:rgba(var(--text-color), 0.8)}img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}h1{font-size:max(1.8rem,4vw)}h2{font-size:max(1.5rem,3vw)}h3{font-size:max(1.2rem,2vw)}h4{font-size:max(1rem,1.3vw)}img{-o-object-fit:contain;object-fit:contain}ul{list-style:none}ol{padding-left:1rem}.icon{width:1.2rem;height:1.2rem;fill:rgba(var(--text-color), 0.9)}.flex{display:flex}.align-items-center{align-items:center}.justify-content-center{justify-content:center}.justify-content-center{justify-content:center}.justify-self-start{justify-self:start}.justify-self-end{justify-self:end}.justify-self-center{justify-self:center}.align-self-start{align-self:start}.align-self-end{align-self:end}.align-self-center{align-self:center}.flex-column{flex-direction:column}.flex-1{flex:1}.grid{display:grid}.gap-0-3{gap:.3rem}.gap-0-5{gap:.5rem}.gap-1{gap:1rem}.gap-1-5{gap:1.5rem}.gap-2{gap:2rem}.gap-3{gap:3rem}.gap-4{gap:4rem}.text-center{text-align:center}article{padding-top:4rem}article>*{padding:max(1rem,2vw) var(--inline-padding)}#main_header{display:flex;align-items:center;justify-content:space-between;position:fixed;left:0;right:0;top:0;background-color:rgba(var(--foreground-color), 0.5);z-index:10;-webkit-backdrop-filter:blur(1rem);backdrop-filter:blur(1rem);padding:max(1rem,2vw) var(--inline-padding)}#main_header a{color:rgba(var(--text-color), 0.9);text-decoration:none}#main_header ul{list-style:none;display:flex;gap:.8rem}#main_header ul a{font-weight:500;font-size:.9rem}#main_header ul a::after{content:"";display:block;width:0;height:.15rem;background:var(--accent-color);transition:width .3s;margin:auto}#main_header ul a.active::after{width:1rem}#main_header ul .icon{display:flex}#above_fold h2{max-width:46rem;justify-self:center;text-align:center;margin-bottom:3rem}#above_fold ol{display:block;-moz-columns:2 24rem;columns:2 24rem;-moz-column-gap:2rem;column-gap:2rem}#above_fold ol li{page-break-inside:avoid;-moz-column-break-inside:avoid;break-inside:avoid;margin-bottom:3rem}#hero_illustration{margin:auto;margin-top:4rem;width:min(100%,26rem)}section{display:grid;position:relative;min-height:90vh;align-content:center}section:nth-of-type(2){overflow:hidden}.section-header{display:flex;flex-direction:column;text-align:center;margin-bottom:3rem}.section-header::after{content:"•••";line-height:.5}#bitcoin_lineart{position:absolute;opacity:.2;height:80vh;width:auto;align-self:center;right:0}#el_salvador_section{position:relative;overflow:hidden}#el_salvador_map{position:absolute;opacity:.06;top:0;width:max(100vh,90vw);height:auto;left:50%;transform:translateX(-50%)}.carousel{display:flex;overflow-x:auto;border-radius:.5rem;margin-top:1.5rem;scroll-snap-type:x mandatory;scroll-padding:0 calc(1*var(--inline-padding));margin:3rem calc(-1*var(--inline-padding));padding:1rem calc(1*var(--inline-padding));scrollbar-width:none}.carousel::-webkit-scrollbar{display:none}.milestone{position:relative;display:flex;flex-direction:column;gap:1rem;width:min(100% - 1rem,28rem);flex-shrink:0;scroll-snap-align:start;padding-right:3rem}.milestone:last-of-type{padding-right:0}.milestone:last-of-type .milestone__label::before{display:none}.milestone__label{display:flex;align-items:center;background-color:rgba(var(--text-color), 1);color:rgba(var(--foreground-color), 1);padding:.4rem .5rem;align-self:flex-start;border-radius:.3rem;font-size:.9rem}.milestone__label::before{position:absolute;content:"";display:block;width:100%;height:.1rem;background-color:rgba(var(--text-color), 0.3);z-index:-1}.milestone__title{margin-top:3rem}.carousel-control{display:flex;border:none;background:none;padding:.7rem;border:solid thin rgba(var(--text-color), 0.5);border-radius:50%;cursor:pointer}.carousel:has(.project){padding-bottom:3rem}#projects_section h2{margin-bottom:3rem}.project{display:grid;width:100%;border-radius:.8rem;border:solid thin rgba(var(--text-color), 0.1);background-color:rgba(var(--foreground-color), 1);box-shadow:0 .5rem 1rem rgba(var(--text-color), 0.1)}.project__images{display:flex;gap:1rem;flex-direction:column;flex:1;overflow-x:hidden;padding:1rem}.project__image{display:flex;flex:1;aspect-ratio:4/3;min-width:12rem;height:30vmax}.project__image img{min-height:30vmax;width:100%;-o-object-fit:cover;object-fit:cover;border-radius:.5rem}.project__images-wrapper{display:flex;overflow-x:auto;gap:.5rem}.project .thumbnail-button{width:5rem;aspect-ratio:4/3;border-radius:.5rem;overflow:hidden;cursor:pointer;border:none;flex-shrink:0;transition:transform .2s}.project .thumbnail-button.active{transform:scale(0.9)}.project .thumbnail{-o-object-fit:cover;object-fit:cover}.project__content{padding:max(1rem,2vw);text-align:left;display:flex;flex-direction:column;gap:1rem;flex:1}.project__button{font-size:.8rem;font-weight:700;text-decoration:none;text-transform:uppercase;color:rgba(var(--text-color), 1);background-color:rgba(var(--text-color), 0.1);padding:.5rem 1rem;border-radius:1rem;letter-spacing:.05em;align-self:flex-end;border:none;cursor:pointer}.project .project__hidden-details{grid-column:1/-1;padding:1rem;border-top:solid thin rgba(var(--text-color), 0.5);overflow:hidden}.project .project__hidden-details .carousel{z-index:2;margin-top:0;margin-bottom:0}.project .project__hidden-details .milestone{width:min(100% - 1rem,20rem)}.project .project__hidden-details .milestone__title{margin-top:.5rem;font-size:1.2rem}.badge{background-color:rgba(var(--text-color), 1);color:rgba(var(--foreground-color), 1);padding:.4rem .5rem;align-self:flex-start;border-radius:.3rem;font-size:.9rem;font-weight:500}#poc_stats{list-style:none;display:flex;gap:1rem;margin:1rem 0;padding:1rem;background-color:rgba(var(--text-color), 0.06);border-radius:.5rem}#poc_stats .stat{display:flex;flex-direction:column;gap:.5rem;flex:1}#poc_stats .stat__number{font-size:max(1.2rem,1.8vmax);font-weight:700}#poc_stats .stat__title{font-size:.9rem}#methodology_wrapper{display:flex;flex-direction:column;margin-top:3rem}#methodology_wrapper .milestone{display:grid;max-width:42rem;width:auto;grid-template-areas:"label title" "label description";align-items:center}#methodology_wrapper .milestone:not(:last-child){padding-bottom:3rem}#methodology_wrapper .milestone__label{align-items:flex-start;justify-content:center;grid-area:label}#methodology_wrapper .milestone__label::before{width:.1rem;height:100%}#methodology_wrapper .milestone__title{grid-area:title;margin-top:0;padding-left:3rem}#methodology_wrapper .milestone__description{grid-area:description;padding-left:3rem}#economic_framework h2{margin-bottom:3rem}#economic_framework ul{-moz-columns:3 16rem;columns:3 16rem;-moz-column-gap:.5rem;column-gap:.5rem}#economic_framework ul li{display:grid;gap:.5rem;align-items:flex-start;align-content:flex-start;background-color:rgba(var(--text-color), 0.06);border-radius:.5rem;padding:max(1rem,2vw);page-break-inside:avoid;-moz-column-break-inside:avoid;break-inside:avoid;margin-bottom:.5rem}#team_members{display:grid;grid-template-columns:repeat(auto-fill, minmax(max(8rem, 12vw), 1fr));gap:3rem 1.5rem;margin-top:3rem}.team-member{display:flex;flex-direction:column;text-align:center}.team-member img{-o-object-fit:cover;object-fit:cover;width:100%;aspect-ratio:3/3.5;border-radius:1rem;margin-bottom:1.2rem}.team-member__name{font-weight:700;font-size:1rem;line-height:1.2}.team-member__title{line-height:normal;font-weight:500;font-size:.9rem}#partners{display:grid;grid-template-columns:repeat(auto-fill, minmax(14rem, 1fr));gap:1rem;margin-top:3rem}#partners a,#partners li:not(li:has(a)){display:flex;gap:.8rem;padding:1rem;text-decoration:none;width:100%;align-items:center;background-color:rgba(var(--text-color), 0.06);border-radius:.5rem}#partners a .icon,#partners li:not(li:has(a)) .icon{width:2rem;height:2rem}#partners img{height:2rem}#partners span{font-weight:500;color:rgba(var(--text-color), 0.8);width:100%}#media_coverage_section .masonry{margin-top:3rem;display:flex;flex-wrap:wrap;gap:1rem}#media_coverage_section .masonry iframe{display:flex;flex:1 1 15rem;border-radius:.5rem;max-width:max(100vw - 2.5rem)}#social_links{display:flex;flex-wrap:wrap;gap:.5rem;justify-items:center;width:100%;margin-top:3rem;grid-template-columns:repeat(auto-fill, minmax(8rem, 1fr))}#social_links li{width:100%;justify-content:center;box-shadow:0 0 0 0 rgba(var(--text-color), 1);transition:box-shadow .1s ease;flex:1 1 8rem;border-radius:.5rem}#social_links li:hover{box-shadow:0 0 0 .1rem rgba(var(--text-color), 1)}#social_links a{display:flex;width:100%;gap:.5rem;text-decoration:none;color:rgba(var(--text-color), 0.9);padding:1rem;justify-content:center;border-radius:inherit;background-color:rgba(var(--text-color), 0.06);font-weight:500}#services_section ul{display:flex;flex-wrap:wrap;gap:1rem;margin-top:3rem}#services_section li{display:flex;flex:1 1 20rem;gap:1rem;align-items:center;padding:max(1rem,2vw);border:solid thin rgba(var(--text-color), 0.2);border-radius:.5rem;font-weight:500;-webkit-animation:slide-up .5s ease var(--delay) forwards;animation:slide-up .5s ease var(--delay) forwards;opacity:0}#services_section .icon{height:2.5rem;width:2.5rem}#news_list{display:grid;gap:.5rem}#news_list li{container:news-item/inline-size}.news-item{display:grid;grid-template-columns:auto 1fr;grid-template-areas:" icon ." "icon ." "icon ." "icon .";gap:.5rem 1rem;border:solid thin rgba(var(--text-color), 0.5);border-radius:.5rem;padding:max(1rem,2vw);text-decoration:none;color:rgba(var(--text-color), 0.9);-webkit-animation:slide-up .5s ease var(--delay) forwards;animation:slide-up .5s ease var(--delay) forwards;opacity:0}.news-item__icon{grid-area:icon}.news-item__icon .icon{height:2rem;width:2rem}.news-item__date{background-color:rgba(var(--text-color), 0.1);margin-right:auto;padding:.1rem .5rem;border-radius:.3rem;font-weight:500;font-size:.8rem}@-webkit-keyframes slide-up{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@keyframes slide-up{from{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}@container news-item (max-width: 400px){.news-item{grid-template-areas:none;grid-template-columns:1fr}.news-item__icon{grid-area:unset}}@media screen and (max-width: 768px){#poc_images .poc-wrapper:nth-of-type(5){grid-area:3/2/4/3}.hide-on-small{display:none !important}}@media screen and (min-width: 768px){body{--inline-padding: max(1rem, 12vw)}#bitcoin_lineart{opacity:.6;left:calc(100% - 50vw)}.project{grid-template-columns:1fr 1fr}.hide-on-large{display:none !important}}@media screen and (any-hover: none){.carousel-controls{display:none}}@media screen and (any-hover: hover){::-webkit-scrollbar{width:.5rem;height:.5rem}::-webkit-scrollbar-thumb{background:rgba(var(--text-color), 0.3);border-radius:1rem}::-webkit-scrollbar-thumb:hover{background:rgba(var(--text-color), 0.5)}#main_header ul a:hover::after{width:1rem}}.hidden{display:none} \ No newline at end of file diff --git a/css/main.scss b/css/main.scss index 0081ac8..8f4db6c 100644 --- a/css/main.scss +++ b/css/main.scss @@ -39,7 +39,7 @@ body[data-theme="dark"] { p, strong { - font-size: 0.9rem; + font-size: 1rem; max-width: 70ch; line-height: 1.6; color: rgba(var(--text-color), 0.8); @@ -67,6 +67,9 @@ img { ul { list-style: none; } +ol { + padding-left: 1rem; +} .icon { width: 1.2rem; height: 1.2rem; @@ -185,21 +188,27 @@ article { } } #above_fold { - padding-top: 0; - height: calc(100vh - 6rem); - text-align: center; - align-content: center; h2 { - margin: auto; max-width: 46rem; + justify-self: center; + text-align: center; + margin-bottom: 3rem; } - p { - max-width: none; + ol { + display: block; + columns: 2 24rem; + column-gap: 2rem; + li { + page-break-inside: avoid; + break-inside: avoid; + margin-bottom: 3rem; + } } } #hero_illustration { - width: min(100%, 26rem); margin: auto; + margin-top: 4rem; + width: min(100%, 26rem); } section { display: grid; @@ -308,6 +317,11 @@ section { .carousel:has(.project) { padding-bottom: 3rem; } +#projects_section { + h2 { + margin-bottom: 3rem; + } +} .project { display: grid; width: 100%; @@ -430,27 +444,57 @@ section { } } #methodology_wrapper { - margin-bottom: 0; + display: flex; + flex-direction: column; + margin-top: 3rem; + .milestone { + display: grid; + max-width: 42rem; + width: auto; + grid-template-areas: "label title" "label description"; + align-items: center; + &:not(:last-child) { + padding-bottom: 3rem; + } + &__label { + align-items: flex-start; + justify-content: center; + grid-area: label; + &::before { + width: 0.1rem; + height: 100%; + } + } + &__title { + grid-area: title; + margin-top: 0; + padding-left: 3rem; + } + &__description { + grid-area: description; + padding-left: 3rem; + } + } } -#economics_section { +#economic_framework { h2 { margin-bottom: 3rem; } ul { columns: 3 16rem; column-gap: 0.5rem; - } - li { - display: grid; - gap: 0.5rem; - align-items: flex-start; - align-content: flex-start; - background-color: rgba(var(--text-color), 0.06); - border-radius: 0.5rem; - padding: max(1rem, 2vw); - page-break-inside: avoid; - break-inside: avoid; - margin-bottom: 0.5rem; + li { + display: grid; + gap: 0.5rem; + align-items: flex-start; + align-content: flex-start; + background-color: rgba(var(--text-color), 0.06); + border-radius: 0.5rem; + padding: max(1rem, 2vw); + page-break-inside: avoid; + break-inside: avoid; + margin-bottom: 0.5rem; + } } } @@ -484,38 +528,46 @@ section { } #partners { - display: flex; - flex-wrap: wrap; + display: grid; + grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 1rem; - margin: auto; - justify-content: space-evenly; + margin-top: 3rem; a, li:not(li:has(a)) { display: flex; - flex-direction: column; gap: 0.8rem; - text-align: center; - align-items: center; padding: 1rem; text-decoration: none; + width: 100%; + align-items: center; + background-color: rgba(var(--text-color), 0.06); + border-radius: 0.5rem; .icon { width: 2rem; height: 2rem; } } + img { + height: 2rem; + } span { font-weight: 500; color: rgba(var(--text-color), 0.8); + width: 100%; } } #media_coverage_section { - .carousel { + .masonry { + margin-top: 3rem; + display: flex; + flex-wrap: wrap; gap: 1rem; - & > * { - flex-shrink: 0; - width: min(calc(100% - 2rem), 32rem); + iframe { + display: flex; + flex: 1 1 15rem; border-radius: 0.5rem; + max-width: max(100vw - 2.5rem); } } } @@ -555,13 +607,16 @@ section { } } -#services { +#services_section { ul { - columns: 4 16rem; - column-gap: 0.5rem; + display: flex; + flex-wrap: wrap; + gap: 1rem; + margin-top: 3rem; } li { display: flex; + flex: 1 1 20rem; gap: 1rem; align-items: center; padding: max(1rem, 2vw); @@ -570,9 +625,6 @@ section { font-weight: 500; animation: slide-up 0.5s ease var(--delay) forwards; opacity: 0; - margin-bottom: 0.5rem; - break-inside: avoid; - page-break-inside: avoid; } .icon { height: 2.5rem; diff --git a/index.html b/index.html index 40a1c77..1642d75 100644 --- a/index.html +++ b/index.html @@ -20,8 +20,8 @@
A global reference of tokenization aiming financial inclusiveness
++ Project B executes tokenization projects based on blockchain technology. +
++ Tokenization in blockchain enables the digital representation, transfer, and management of + real-world + assets or values, making transactions more efficient and expanding the possibilities for + decentralized + economic systems. +
++ A good tokenization project enables self funding of a new project through investors all over the + world. +
++ It also converts customers automatically into investors and vice-versa. +
++ Project B has evolved a disciplined framework for creation, transfer and management of the + tokens + such + that the valuation of tokens is always backed up by sustainable economics. +
++ Project B in collaboration with tools and technologies developed by RanchiMall has made process + of + tokenization extremely simple and very practical to use. +
++ In Project B implementation of tokenization, we start with definite and predictable cash flows + at + any + business process and then create the dynamics in a such way that the tokens can appreciate in a + predicatable fastion. +
+
+
+ Juu Ride
- El Salvador is the first country to fully legalize Bitcoin with constitutional protections and - no - taxes on capital gains. They have established a comprehensive regulatory system for digital - assets - and aim to become a physical base for incubating and scaling new digital ideas using blockchain - technology. + El Salvador first and only country to unconditionally legalize Bitcoin, and offer constitutional + protections.
- By being an early adopter, El Salvador is gaining a first mover advantage in the crypto space - for - itself and its entrepreneurs. + El Salvador has no taxation on capital gains on Bitcoin, as well as technology companies that + leverage the power of new technologies.
- They are also creating a global community of crypto enthusiasts - and - becoming a focal point for crypto infrastructure worldwide. + El Salvador has created Comprehensive Digital Assets regulatory system. +
++ El Salvador can form the physical base where new digital ideas an be incubated, and then scaled + up all over the world using blockchain dynamics. +
++ El Salvador is creating first mover advantage in Crypto space for itself as a country, and for + entrepreneurs who operate out of El Salvador. As we saw in case of Bitcoin, first mover + advantage is often a permanent advantage in Crypto space. +
++ El Salvador is also creating a community of global Crypto enthusiasts being focal point of + Crypto infrastructure in the world.
+
+ + Tokenizes the projects done by students of an engineering college in the following areas +
+ - Client side team (Management, Technology, and Finance) -
-- Formal approval from board Or higher management -
-- Project B team (Technology, Financial Structure Design) -
-- Regulatory Team (KYC, Financial Controls, AML) -
-- Allocation of dedicated budget (by client) -
-- Production valuation encompasses all operational expenses. Token sales must cover these - costs. -
-- Consumption valuation reflects the system's value derived from providing essential goods or - services for consumption. It represents the overall profits and earnings generated by the - system's operation. -
-- Reserve Pool is a Bitcoin Multisig address that serves as the bank account for this system. - All - system-related payments and expenses occur there. -
-- Ownership tokens entitle holders to the system's profits. -
-- Market valuation represents the anticipated future consumption valuation. -
-- The higher value between production valuation and consumption valuation. -
-- Investments help in providing for the initial production valuation and they add to the - reserve - pool. -
-+ The client-side team should contain members from following teams +
++ Before tokenization can begin the higher management or the board must commit resources required + for + the tokenization project. +
++ Higher management must also undertake to communicate details of the initiative to employees, + customers and other stake holders. +
++ A dedicated budget for the project must be approved. +
++ Project B will perform the initial economic design of the tokenization project. +
++ It will setup the technology page consisting of tokens, + Smartcontracts, multisigs, markets and + private key security infrastructure. +
++ The regulatory team will review controls related to KYC (Know Your customer), AML (Anti Money + Laundering) and + National Digital Assets Regulations if applicable. +
+