*{margin:0;padding:0;box-sizing:border-box;-moz-box-sizing:border-box;-ms-box-sizing:border-box;-o-box-sizing:border-box}html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,dd,dl,dt,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,bdi,details,dialog,figcaption,figure,footer,header,main,mark,nav,section,summary,time,wbr{margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit}table{border-collapse:collapse}ul{list-style:none}ol{padding-left:16px}article,aside,dialog,figure,footer,header,main,nav,section{display:block}input,select,textarea{outline:none}code{font-family:monospace}hr{overflow:visible}html{--page-width: 100em;--page-margin: 0.5in;--screen-scale: 1;--image-grid-gap: calc(clamp(0.8em, 1.5vw, 1.5em));--background-color: #efefe7;--background-color-2: #fff;--text-color-light: #555;--text-color-strong: #111;--text-color: #333;--accent-color-r: 76;--accent-color-g: 175;--accent-color-b: 80;--accent-color: rgb(var(--accent-color-r), var(--accent-color-g), var(--accent-color-b));--accent-color-rgb: var(--accent-color-r), var(--accent-color-g), var(--accent-color-b);--accent-color-light: #70ff77;--accent-color-lighter: #64c169;--divider-light: #ccc;--radius-medium: 0.5rem;--radius-small: calc(var(--radius-medium) * 0.6);--radius-large: calc(var(--radius-medium) * 1.5);--base-font-size: 16px;--dark-background-color: #292922;--light-background-color: var(--background-color);font-size:calc(var(--base-font-size)*var(--screen-scale))}@media screen{html{--screen-scale: 1.3;--page-margin: 0in}}@media screen and (max-width: 1800px){html{--screen-scale: 1.1}}@media screen and (max-width: 1000px){html{--screen-scale: 1}}x-app{margin:auto;display:grid;grid-template-rows:min-content min-content 1fr;grid-template-columns:1fr;grid-template-areas:"header" "nav" "main"}.hidden{display:none !important}html,body{overscroll-behavior:none}body{font-family:"K2D";color:#333;background:linear-gradient(180deg, var(--background-color), var(--background-color-2));background-size:100% 60vh;background-repeat:no-repeat}h1,h2,h3{font-family:"Bebas Neue",sans-serif}button{cursor:pointer}select,button,input,textarea{font-family:inherit;font-size:1em}select{padding:.5em .5em;border:1px solid #aaa;background:rgba(0,0,0,0);border-radius:.4em}a{color:inherit;text-decoration:underline}.button{background:var(--accent-color);border-radius:.3em;display:inline-block;box-shadow:0px -5px inset rgba(0,0,0,.3),0px 10px rgba(0,0,0,.0588235294),0px 0px 0px inset #77c37a;color:#fff;font-size:1.3em;font-weight:bold;padding:.5em 1em;padding-bottom:calc(.5em + 5px);text-decoration:none;transition:box-shadow .2s;background:linear-gradient(0deg, var(--accent-color), var(--accent-color)) padding-box,linear-gradient(90deg, var(--accent-color), var(--accent-color-light), var(--accent-color)) border-box;border-top:1px solid rgba(0,0,0,0)}.button i{margin-right:.7em}.button:hover{cursor:pointer;box-shadow:0px -5px inset rgba(0,0,0,.3),0px 10px rgba(0,0,0,.0588235294),0px 7px 0px inset #77c37a}@page{size:8.25in 11.75in;margin:10mm 10mm 10mm 10mm}x-header{padding:1em 0;padding-bottom:.5em;display:none;grid-area:header;text-align:center}x-header .logo{display:flex;align-items:center;justify-content:center}x-header .logo img{height:1.6em;display:block}x-header .logo:before,x-header .logo:after{height:6px;background:var(--accent-color);width:4em;content:" ";border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0px 3px #d3d3d3}x-header .logo:before{border-top-left-radius:1em;border-bottom-left-radius:1em}x-header .logo:after{border-top-right-radius:1em;border-bottom-right-radius:1em}x-header .logo span{border-radius:.35em;font-size:.8em;color:#fff;padding:.4em 2em;font-weight:bold;background:var(--accent-color);border-bottom:1px solid rgba(0,0,0,.1);box-shadow:0px 3px #d3d3d3}x-header h1,x-header h2{text-transform:uppercase;font-family:"Bebas Neue",sans-serif}x-header h1{font-size:5em;color:var(--text-color-strong);position:relative;-webkit-text-fill-color:rgba(0,0,0,0)}x-header h1::before{position:absolute;left:7px;top:7px;bottom:0;right:0;content:"PETER H. NGUYEN";background:linear-gradient(transparent, #ccc);-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0)}x-header h1::after{position:absolute;left:0px;top:0px;bottom:0;right:0;content:"PETER H. NGUYEN";--angle: 180deg;--offset: 0.4em;--gap: 0.05em;--col1: #666;--col2: #333;background:repeating-linear-gradient(180deg, #b5b5b5, #000);-webkit-background-clip:text;-webkit-text-fill-color:rgba(0,0,0,0)}x-header h2{font-size:1.2em;color:var(--text-color)}x-blob-button{position:relative;background:none !important;box-shadow:none !important;--size: 2.5em}x-blob-button>div{background:var(--accent-color);position:absolute;left:0;right:0;top:0;bottom:0;filter:url(#gooey);z-index:-1}x-blob-button>div:after{pointer-events:none;content:" ";position:absolute;width:var(--size);height:var(--size);margin-left:calc(var(--size)*-0.5);margin-top:calc(var(--size)*-0.5);border-radius:100%;left:var(--x);top:var(--y);background:var(--accent-color)}@property --rotation{syntax:"<angle>";inherits:false;initial-value:10deg}x-index{--gutter: calc(max(1em, (100vw - var(--page-width)) / 2));--image-padding: 0.5em;grid-area:main;background-color:#fff;--side-width: calc(clamp(20em, 20vw, 27em));--angle-top: calc(clamp(1em, 8vw, 8em));--angle-bottom: calc(clamp(1em, 8vw, 8em));--background: url(images/02_Illus_02-full-e8a339637c764815.jpg);--content-width: minmax(0, 1fr);--gap: calc(clamp(2em, 2.5vw, 3em));--hover-color: #c9c9bb}x-index .goo{display:none !important;--width: -1.3em;--lerp: 0.5;position:absolute;left:0;top:0;background:#787964;filter:url(#gooey);width:1vw;height:10em;display:block;z-index:100;left:var(--x);top:var(--y);transform:skew(-8deg, 0deg);--x: calc(50% + var(--slant) * (var(--lerp) - 0.5));--y: calc((1 - var(--lerp)) * 100% - 5em)}x-index .goo:after{position:absolute;left:var(--width);right:var(--width);border-radius:100%;background-color:#787964;content:" ";top:2em;bottom:2em}x-index .intro{--inner-color: var(--accent-color);--outer-color: #011602;--slant: 8vw;--gradient-x: 50vw;--gradient-y: 50vh;display:grid;position:relative;font-size:1.2em;border-bottom:2em solid #555550}x-index .intro+.category{--angle-top: 0px}x-index .intro:before{display:block;content:" ";grid-column:1/3;grid-row:1/2;background:radial-gradient(ellipse at var(--gradient-x) var(--gradient-y), var(--inner-color), var(--outer-color)) center/auto,linear-gradient(0deg, #000, #000) center/auto,linear-gradient(0deg, var(--accent-color), var(--accent-color)) center/auto,radial-gradient(ellipse at var(--gradient-x) var(--gradient-y), #fff 30%, #000 80%) center/auto,url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 304 304' width='304' height='304'%3E%3Crect width='304' height='304' fill='black'/%3E%3Cpath fill='%23ffffff' fill-opacity='0.6' d='M44.1 224a5 5 0 1 1 0 2H0v-2h44.1zm160 48a5 5 0 1 1 0 2H82v-2h122.1zm57.8-46a5 5 0 1 1 0-2H304v2h-42.1zm0 16a5 5 0 1 1 0-2H304v2h-42.1zm6.2-114a5 5 0 1 1 0 2h-86.2a5 5 0 1 1 0-2h86.2zm-256-48a5 5 0 1 1 0 2H0v-2h12.1zm185.8 34a5 5 0 1 1 0-2h86.2a5 5 0 1 1 0 2h-86.2zM258 12.1a5 5 0 1 1-2 0V0h2v12.1zm-64 208a5 5 0 1 1-2 0v-54.2a5 5 0 1 1 2 0v54.2zm48-198.2V80h62v2h-64V21.9a5 5 0 1 1 2 0zm16 16V64h46v2h-48V37.9a5 5 0 1 1 2 0zm-128 96V208h16v12.1a5 5 0 1 1-2 0V210h-16v-76.1a5 5 0 1 1 2 0zm-5.9-21.9a5 5 0 1 1 0 2H114v48H85.9a5 5 0 1 1 0-2H112v-48h12.1zm-6.2 130a5 5 0 1 1 0-2H176v-74.1a5 5 0 1 1 2 0V242h-60.1zm-16-64a5 5 0 1 1 0-2H114v48h10.1a5 5 0 1 1 0 2H112v-48h-10.1zM66 284.1a5 5 0 1 1-2 0V274H50v30h-2v-32h18v12.1zM236.1 176a5 5 0 1 1 0 2H226v94h48v32h-2v-30h-48v-98h12.1zm25.8-30a5 5 0 1 1 0-2H274v44.1a5 5 0 1 1-2 0V146h-10.1zm-64 96a5 5 0 1 1 0-2H208v-80h16v-14h-42.1a5 5 0 1 1 0-2H226v18h-16v80h-12.1zm86.2-210a5 5 0 1 1 0 2H272V0h2v32h10.1zM98 101.9V146H53.9a5 5 0 1 1 0-2H96v-42.1a5 5 0 1 1 2 0zM53.9 34a5 5 0 1 1 0-2H80V0h2v34H53.9zm60.1 3.9V66H82v64H69.9a5 5 0 1 1 0-2H80V64h32V37.9a5 5 0 1 1 2 0zM101.9 82a5 5 0 1 1 0-2H128V37.9a5 5 0 1 1 2 0V82h-28.1zm16-64a5 5 0 1 1 0-2H146v44.1a5 5 0 1 1-2 0V18h-26.1zm102.2 270a5 5 0 1 1 0 2H98v14h-2v-16h124.1zM242 149.9V160h16v34h-16v62h48v48h-2v-46h-48v-66h16v-30h-16v-12.1a5 5 0 1 1 2 0zM53.9 18a5 5 0 1 1 0-2H64V2H48V0h18v18H53.9zm112 32a5 5 0 1 1 0-2H192V0h50v2h-48v48h-28.1zm-48-48a5 5 0 0 1-9.8-2h2.07a3 3 0 1 0 5.66 0H178v34h-18V21.9a5 5 0 1 1 2 0V32h14V2h-58.1zm0 96a5 5 0 1 1 0-2H137l32-32h39V21.9a5 5 0 1 1 2 0V66h-40.17l-32 32H117.9zm28.1 90.1a5 5 0 1 1-2 0v-76.51L175.59 80H224V21.9a5 5 0 1 1 2 0V82h-49.59L146 112.41v75.69zm16 32a5 5 0 1 1-2 0v-99.51L184.59 96H300.1a5 5 0 0 1 3.9-3.9v2.07a3 3 0 0 0 0 5.66v2.07a5 5 0 0 1-3.9-3.9H185.41L162 121.41v98.69zm-144-64a5 5 0 1 1-2 0v-3.51l48-48V48h32V0h2v50H66v55.41l-48 48v2.69zM50 53.9v43.51l-48 48V208h26.1a5 5 0 1 1 0 2H0v-65.41l48-48V53.9a5 5 0 1 1 2 0zm-16 16V89.41l-34 34v-2.82l32-32V69.9a5 5 0 1 1 2 0zM12.1 32a5 5 0 1 1 0 2H9.41L0 43.41V40.6L8.59 32h3.51zm265.8 18a5 5 0 1 1 0-2h18.69l7.41-7.41v2.82L297.41 50H277.9zm-16 160a5 5 0 1 1 0-2H288v-71.41l16-16v2.82l-14 14V210h-28.1zm-208 32a5 5 0 1 1 0-2H64v-22.59L40.59 194H21.9a5 5 0 1 1 0-2H41.41L66 216.59V242H53.9zm150.2 14a5 5 0 1 1 0 2H96v-56.6L56.6 162H37.9a5 5 0 1 1 0-2h19.5L98 200.6V256h106.1zm-150.2 2a5 5 0 1 1 0-2H80v-46.59L48.59 178H21.9a5 5 0 1 1 0-2H49.41L82 208.59V258H53.9zM34 39.8v1.61L9.41 66H0v-2h8.59L32 40.59V0h2v39.8zM2 300.1a5 5 0 0 1 3.9 3.9H3.83A3 3 0 0 0 0 302.17V256h18v48h-2v-46H2v42.1zM34 241v63h-2v-62H0v-2h34v1zM17 18H0v-2h16V0h2v18h-1zm273-2h14v2h-16V0h2v16zm-32 273v15h-2v-14h-14v14h-2v-16h18v1zM0 92.1A5.02 5.02 0 0 1 6 97a5 5 0 0 1-6 4.9v-2.07a3 3 0 1 0 0-5.66V92.1zM80 272h2v32h-2v-32zm37.9 32h-2.07a3 3 0 0 0-5.66 0h-2.07a5 5 0 0 1 9.8 0zM5.9 0A5.02 5.02 0 0 1 0 5.9V3.83A3 3 0 0 0 3.83 0H5.9zm294.2 0h2.07A3 3 0 0 0 304 3.83V5.9a5 5 0 0 1-3.9-5.9zm3.9 300.1v2.07a3 3 0 0 0-1.83 1.83h-2.07a5 5 0 0 1 3.9-3.9zM97 100a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-48 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 96a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-144a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-96 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm96 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-32 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM49 36a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-32 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM33 68a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 240a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm80-176a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm112 176a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM17 180a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM17 84a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6z'%3E%3C/path%3E%3C/svg%3E") center/20em,url("https://i.pinimg.com/originals/3c/8c/f0/3c8cf0299480a3f239761ce15f861b9f.gif") center/18em;background-blend-mode:screen,screen,multiply,multiply,multiply,normal}x-index .intro p{line-height:1.7em;color:#ddd;font-weight:bold;max-width:30em}x-index .intro svg{width:17em;position:absolute;left:0;top:7vh;padding:2em;background:var(--accent-color);clip-path:polygon(0 0, calc(100% - 2em) 0, 100% 50%, calc(100% - 2em) 100%, 0 100%);padding-right:4em;z-index:2}x-index .intro .left{--background-color: #414132;z-index:1;grid-area:left;color:#fff;background:radial-gradient(circle at 0 var(--gradient-y), #757562, var(--background-color) 50vh),var(--background-color);position:relative;display:flex;gap:4vh;align-items:start;flex-direction:column;justify-content:center}x-index .intro .left .header{text-shadow:2px 2px rgba(0,0,0,.231372549);color:#fff;display:grid;grid-template-columns:min-content min-content;grid-template-rows:min-content min-content;grid-template-areas:"peter right" "nguyen right";gap:.7em;text-transform:uppercase;color:#fff}x-index .intro .left .header:before{content:" ";margin:-10em -4em;-webkit-mask:no-repeat url(images/paint-full-1e95db80915079cc.png) center/contain;z-index:-1;grid-column:1/3;grid-row:1/3;background:url("https://i.pinimg.com/originals/a4/ae/57/a4ae57de9652544afb9b5407da9878ce.jpg") center/cover,var(--background-color);filter:brightness(0.5);background-blend-mode:luminosity}@keyframes text-slide-in{from{opacity:0;transform:translate(var(--start-x), var(--start-y))}to{opacity:1;transform:translate(0em, 0)}}x-index .intro .left .header .peter{grid-area:peter;white-space:pre;font-size:6em;animation:.3s 1 text-slide-in both;animation-delay:0s}x-index .intro .left .header .nguyen{font-size:6.2em;grid-area:nguyen;white-space:pre;animation:.3s 1 text-slide-in both;animation-delay:.2s}x-index .intro .left .header .peter,x-index .intro .left .header .nguyen{--start-x: -4em;--start-y: 0;line-height:.8em;font-family:"Bebas Neue",sans-serif;margin-bottom:-0.1em;text-align:right;mix-blend-mode:exclusion;animation-timing-function:cubic-bezier(0.5, 1, 0.89, 1)}x-index .intro .left .header ul{grid-area:right;line-height:1em;white-space:pre}x-index .intro .left .header ul i{margin-right:.3em;font-size:.9em;color:var(--accent-color)}x-index .intro .left ul{font-size:1.8rem;letter-spacing:8px;font-family:"Bebas Neue",sans-serif;font-weight:bold;display:flex;gap:.3em;flex-direction:column;text-transform:uppercase;justify-content:space-between}x-index .intro .left ul:before{--start-x: 0;--start-y: -4em;animation-delay:.3s}x-index .intro .left ul:after{--start-x: 0;--start-y: 4em;animation-delay:.4s}x-index .intro .left ul:before,x-index .intro .left ul:after{content:" ";height:.25em;border-radius:.1em;flex-grow:1;box-shadow:2px 2px 0px rgba(0,0,0,.15);animation:.3s 1 text-slide-in both;animation-timing-function:cubic-bezier(0.5, 1, 0.89, 1);background:linear-gradient(0deg, var(--accent-color), var(--accent-color)) padding-box,linear-gradient(90deg, var(--accent-color), var(--accent-color-light), var(--accent-color)) border-box;border:1px solid rgba(0,0,0,0)}x-index .intro .background-image{position:absolute;left:0;right:0;top:0;bottom:0;background:url(images/02_Turkey_01-full-753728476d29a852.jpg) center/cover;mix-blend-mode:overlay;filter:grayscale(1);opacity:.5;z-index:-1;-webkit-mask-image:linear-gradient(270deg, black, transparent)}x-index .intro .right{grid-area:right;position:relative}@keyframes iframe-rotation{from{--rotation: 0deg}to{--rotation: 360deg}}x-index .intro .right .video-container{position:absolute;aspect-ratio:16/9;box-sizing:content-box;width:100%;height:auto;display:block;top:30vh;left:10%;width:80%;border:2px solid rgba(0,0,0,0);background:linear-gradient(var(--rotation), #21211a calc(50% - 20em), #255b27 50%, #23231b calc(50% + 20em)) padding-box,linear-gradient(var(--rotation), #9b9b88 calc(50% - 13em), #71ff76 50%, #9b9b88 calc(50% + 13em)) border-box;padding:.7em;animation:iframe-rotation 10s infinite linear;border-radius:1em;box-shadow:0px 0px 0px 2px #000}x-index .intro .right iframe{aspect-ratio:16/9;width:100%;height:auto;display:block}x-index .intro .examples{display:none;color:#aaa;font-weight:bold;position:absolute;bottom:5vh;left:10vw}@keyframes arrow-animation{0%{transform:scale(1, 1) translate(0em, 0em)}50%{transform:scale(1, 1) translate(0em, 0em)}75%{transform:scale(0.75, 1.25) translate(0em, 1em)}}x-index .intro .examples i{margin-right:1em;animation:1s linear infinite arrow-animation}@media all and (max-width: 1000px){x-index .intro{grid-template-columns:minmax(0, 1fr);grid-template-rows:min-content min-content;grid-template-areas:"left" "right"}x-index .intro p{line-height:1.3em}x-index .intro:before{grid-area:right}x-index .intro .left{box-sizing:content-box;padding:20vh 7vw;align-items:start}x-index .intro .left .header{grid-template-columns:100%;grid-template-rows:min-content min-content min-content;grid-template-areas:"peter" "nguyen" "right";margin-top:0;align-self:stretch;gap:.7em 0}x-index .intro .left .header .peter,x-index .intro .left .header .nguyen{font-size:23vw}x-index .intro .right{min-height:50vh;padding:5vh 7vw;border-top:5vh solid var(--accent-color)}x-index .intro .right svg{display:none !important}x-index .intro .right .video-container{position:static;width:auto;padding:.4em}}@media all and (min-width: 1000px){x-index .intro{grid-template-columns:minmax(0, 1fr) var(--slant) minmax(0, 1fr);grid-template-rows:1fr;grid-template-areas:"right left left";height:calc(100vh + 2em)}x-index .intro .left{padding-left:calc(var(--slant) + 2em);clip-path:polygon(var(--slant) 0, 100% 0, 100% 100%, 0 100%)}x-index .intro .left:before{content:" ";position:absolute;width:calc(var(--slant) + 1vw);left:0;top:0;bottom:0;clip-path:polygon(0 0, calc(var(--slant) + 1vw) 0, 1vw 100%, 0 100%);background:#787964}x-index .intro .left .header ul{mix-blend-mode:exclusion}}x-index .category{--divider-color-light: #c9c9bb;--divider-color-dark: #59594b;background:var(--background-color)}x-index .category:last-child{--angle-bottom: 0px}x-index .category:nth-child(even){--background-color: var(--dark-background-color)}x-index .category:nth-child(even) aside{--text-color: #ccc}x-index .category:nth-child(even) h1{--header-color: #fff}x-index .category:nth-child(odd){--background-color: var(--light-background-color)}x-index .category:nth-child(odd) aside{--text-color: #555}x-index .category:nth-child(odd) h1{--header-color: #292922}@media all and (max-width: 1000px){x-index .category{display:grid;gap:1em;border-bottom:1em solid var(--divider-color);padding:1em;grid-template-rows:min-content min-content;grid-template-areas:"description" "img";grid-template-columns:minmax(0, 1fr)}x-index .category>div{display:none}}@media all and (max-width: 2000px){x-index .category{--image-padding: 0.3em}}@media all and (max-width: 1400px){x-index .category{--image-padding: 0}}@media all and (min-width: 1000px){x-index .category{display:grid;grid-template-rows:1fr;gap:0;align-items:start;position:relative;padding:calc(var(--angle-top) + 2em) 0 calc(var(--angle-bottom) + 2em);margin:calc(var(--angle-top)*-1 - 1px) 0 calc(var(--angle-bottom)*-1 - 1px);clip-path:polygon(0 var(--angle-top), 100% 0, 100% calc(100% - var(--angle-bottom)), 0 100%)}x-index .category:nth-child(2){clip-path:polygon(0 0, 100% 0, 100% calc(100% - var(--angle-top)), 0 100%);margin-top:0;padding-top:3em}x-index .category>div{display:block;grid-column:3/5;grid-row:1/2;margin:calc((var(--angle-top) + 3em)*-1) 0 calc((var(--angle-bottom) + 3em)*-1);opacity:.7;background:var(--background) center/cover;align-self:normal;filter:grayscale(1);-webkit-mask-image:linear-gradient(90deg, transparent, black 15em);mix-blend-mode:overlay}x-index .category:before{content:" ";display:block;width:4em;height:4em;border-radius:100%;position:absolute;left:50%;top:0%;background-color:var(--divider-color-top);margin-top:calc(var(--angle-top)*.5 - 2.5em)}x-index .category:after{content:" ";display:block;grid-column:1/5;grid-row:1/1;align-self:end;clip-path:polygon(0 var(--angle-bottom), 100% 0, 100% calc(100% - var(--angle-bottom)), 0 100%);background:var(--accent-color);margin-bottom:calc((var(--angle-bottom) + 2em)*-1);height:calc(var(--angle-bottom) + 1vh);z-index:2;background:var(--divider-color-bottom)}x-index .category:nth-child(even){grid-template-columns:var(--gutter) var(--content-width) var(--side-width) var(--gutter);grid-template-areas:"l img description r";--divider-color-top: var(--divider-color-dark);--divider-color-bottom: var(--divider-color-light);--hover-color: #53534a}x-index .category:nth-child(even) ul{padding-right:var(--gap)}x-index .category:nth-child(even) ul li:before{border:1px solid rgba(255,255,255,.05)}x-index .category:nth-child(even) ul li:after{border:1px solid #ccc}x-index .category:nth-child(odd){grid-template-columns:var(--gutter) var(--side-width) var(--content-width) var(--gutter);grid-template-areas:"l description img r";--divider-color-top: var(--divider-color-light);--divider-color-bottom: var(--divider-color-dark)}x-index .category:nth-child(odd) ul{padding-left:var(--gap)}x-index .category:nth-child(odd) ul li{background:linear-gradient(45deg, #d5d5cd, #e9e9df, #d5d5cd) !important;border:min(var(--image-padding),1px) solid rgba(0,0,0,.1) !important}x-index .category:nth-child(odd) ul li:before{border:1px solid rgba(0,0,0,.05)}x-index .category:nth-child(odd) ul li:after{border:1px solid #666;box-shadow:0px 0px 0px var(--image-border-width) #bbb inset}x-index .category:nth-child(odd)>div{grid-column:1/3;-webkit-mask-image:linear-gradient(270deg, transparent, black 15em)}}x-index .category ul{grid-area:img}x-index .category>aside{grid-area:description;padding:0;color:var(--text-color)}@media all and (min-width: 1000px){x-index .category>aside{position:sticky;top:4em}}x-index .category iframe{aspect-ratio:16/9;width:100%;padding-right:3em;grid-area:img}x-index .category h1{--shadow-color: rgba(0, 0, 0, 0.2);color:var(--header-color);font-size:calc(clamp(2em,3vw,3em)*1.3);display:flex;margin:0 0;text-transform:uppercase;flex-direction:column;position:relative}x-index .category h1:after{content:" ";background:linear-gradient(0deg, var(--accent-color), var(--accent-color)) padding-box,linear-gradient(90deg, var(--accent-color), var(--accent-color-light), var(--accent-color)) border-box;height:.25em;border-radius:100em;border:1px solid rgba(0,0,0,0)}x-index .category h1:before{content:" ";position:absolute;left:0;right:0;top:0;bottom:0;margin-left:5px;margin-top:5px;-webkit-background-clip:text;color:rgba(0,0,0,0);background-image:repeating-linear-gradient(45deg, white 0, white 4px, transparent 5px, transparent 9px, white 10px);z-index:-1}x-index .category p{margin:1em 0;line-height:1.7em}x-index .category ul{--width: 10em;--min-a: 0.7;--max-a: 1.8;--scale: 1;--image-border-width: 2px;display:flex;flex-wrap:wrap;gap:var(--image-grid-gap)}@media all and (max-width: 1000px){x-index .category ul{--scale: 0.65;--image-grid-gap: 0.5em;--image-border-width: 2px}}@media all and (max-width: 1400px){x-index .category ul{--scale: 0.8;--image-grid-gap: 0.5em}}x-index .category ul::after{content:"";flex:10}x-index .category ul li{--a: calc(clamp(var(--min-a), calc(var(--w) / var(--h)), var(--max-a)));--hover-angle: 0deg;--hover-strength: 0%;--radius: var(--radius-large);border-radius:var(--radius);position:relative;aspect-ratio:var(--a);flex:calc(var(--a)*var(--width)*var(--scale));flex-grow:calc(var(--a));padding:var(--image-padding);background:linear-gradient(45deg, #2f2f2f, #414141, #2f2f2f);border:min(var(--image-padding),1px) solid rgba(255,255,255,.15)}x-index .category ul li a{display:contents}x-index .category ul li a:before{content:" ";position:absolute;left:0;right:0;top:0;bottom:0;pointer-events:none;transition:inset .2s,visibility .2s;inset:0px;visibility:hidden;background:linear-gradient(var(--hover-angle), rgba(var(--accent-color-rgb), var(--hover-strength)) 15%, rgba(var(--accent-color-rgb), 1) 50%, rgba(var(--accent-color-rgb), var(--hover-strength)) 85%);z-index:-1;border-radius:calc(var(--radius) + 6px)}x-index .category ul li:hover a:before{inset:-6px;visibility:visible}x-index .category ul li:after,x-index .category ul li:before{content:" ";position:absolute;left:var(--image-padding);right:var(--image-padding);top:var(--image-padding);bottom:var(--image-padding);border-radius:var(--radius);display:block;pointer-events:none}x-index .category ul li:after{mix-blend-mode:overlay;pointer-events:none}x-index .category ul li img{display:block;aspect-ratio:var(--aspect-ratio);border-radius:var(--radius);object-fit:cover;height:100%;width:100%;flex:1;max-height:22em;opacity:0}x-index .category ul li img.loaded{opacity:1}x-index .category ul li span{display:none}footer{margin-top:-0.1em;background:#212121;height:6em}x-jump-to-top{cursor:pointer;display:block;position:fixed;bottom:0;right:0;margin:1em;font-size:.9em;font-weight:bold;opacity:0;transition:opacity .2s;clip-path:polygon(2em 0, 100% 0, 100% 100%, 0 100%, 0% 2em);padding:1em 1em;padding-left:2em;background:#fff;border-bottom:3px solid;border-right:3px solid #000}x-jump-to-top:hover{background:#ddd}x-jump-to-top.visible{opacity:1}x-lightbox{position:fixed;left:0;top:0;right:0;bottom:0;display:flex;justify-content:center;align-items:center;z-index:100;cursor:pointer;--x: 0;--y: 0;--animation: 1;--size: 100vw;--frame-padding: 2em;--frame-size: 40%;--frame-inset-width: 5px;--frame-inset-color: var(--accent-color);--frame-border-1: #2d2d2d;--frame-border-2: var(--accent-color);--frame-background-1: #070706;--frame-background-2: rgba(0, 0, 0, 0.6);transform:translate(0, 0);background-color:rgba(0,0,0,0);transition:background-color .5s}x-lightbox.visible{background-color:rgba(0,0,0,.5)}x-lightbox a{display:flex;position:absolute;top:0;bottom:0;z-index:2;text-decoration:none;justify-content:start;align-items:center;padding:5vw}x-lightbox a.previous{left:0;width:40%}x-lightbox a.previous:before{content:""}x-lightbox a.next{right:0;width:40%;justify-content:end}x-lightbox a.next:before{content:""}x-lightbox a:before{font-family:fontawesome;font-size:7vh;color:#fff;transition:transform .2s;text-shadow:2px 2px 0px #000}x-lightbox a:hover:before{transform:scale(1.2)}x-lightbox article{position:absolute;opacity:calc(1 - var(--animation));transform:translate(calc(var(--x) * var(--animation) * 35vw), calc(var(--y) * var(--animation) * 35vh)) scale(calc(1 - 0.5 * var(--animation)));padding:var(--frame-padding);background:linear-gradient(45deg, var(--frame-background-1), var(--frame-background-2), var(--frame-background-1)) padding-box,linear-gradient(45deg, var(--frame-border-1), var(--frame-border-2), var(--frame-border-1)) border-box;border-radius:1em;border:1px solid rgba(0,0,0,0);--frame-inset-distance: calc(var(--frame-padding) / 2 - var(--frame-inset-width) / 2)}x-lightbox article:before{content:" ";display:block;position:absolute;left:var(--frame-inset-distance);top:var(--frame-inset-distance);width:var(--frame-size);height:var(--frame-size);border-top-left-radius:var(--radius-large);border-bottom-left-radius:var(--frame-inset-width);border-top-right-radius:var(--frame-inset-width);border-left:var(--frame-inset-width) solid var(--frame-inset-color);border-top:var(--frame-inset-width) solid var(--frame-inset-color);pointer-events:none}x-lightbox article:after{content:" ";display:block;position:absolute;right:var(--frame-inset-distance);bottom:var(--frame-inset-distance);width:var(--frame-size);height:var(--frame-size);border-bottom-right-radius:var(--radius-large);border-bottom-left-radius:var(--frame-inset-width);border-top-right-radius:var(--frame-inset-width);border-right:var(--frame-inset-width) solid var(--frame-inset-color);border-bottom:var(--frame-inset-width) solid var(--frame-inset-color);pointer-events:none}x-lightbox article .img-container{position:relative}x-lightbox article .img-container:after{content:" ";position:absolute;left:0;right:0;top:0;bottom:0;border:1px solid #ccc;border-radius:var(--radius-large);mix-blend-mode:overlay}x-lightbox article img{border-radius:var(--radius-large);display:block;max-width:80vw;max-height:80vh}x-nav{grid-area:nav;position:fixed;top:0;z-index:10;transform:translate(0, 0);top:1em;right:0;background:linear-gradient(180deg, #57574b, #49493f);color:#ddddd4;font-weight:bold;clip-path:polygon(1em 0, 100% 0, 100% 100%, 1em 100%, 0 50%);box-shadow:0px -3px #727263 inset,0px 1px #6a6a5c inset;display:flex;align-items:center;display:flex;justify-content:center}x-nav:before{content:" ";position:absolute;left:0;top:0;bottom:0;width:2em;clip-path:polygon(0 0, 1em 0, calc(1em + 1px) 0, 1px 50%, calc(1em + 1px) 100%, 0 100%);background:#727263}x-nav nav ul{display:flex;align-items:center;justify-content:center;flex-direction:row;text-transform:uppercase}x-nav nav ul li{display:block;line-height:1em}x-nav nav ul li:first-child a{padding-left:2em !important}x-nav nav ul a{text-decoration:none;display:block;position:relative;padding:1em;transition:background .2s,color .2s,border-color .2s,box-shadow .2s}x-nav nav ul a:hover,x-nav nav ul a.selected{color:#fff;background:var(--accent-color);border-color:rgba(0,0,0,.8);box-shadow:0px 7px 0px inset var(--accent-color-lighter)}@media all and (max-width: 1000px){x-nav{flex-wrap:wrap;clip-path:none;position:static}x-nav:before{display:none}x-nav nav{display:contents}x-nav nav ul{display:contents}}x-nav.hovering{background:#eee;border-bottom:1px solid rgba(0,0,0,.2);box-shadow:0px -1px 0px #fff inset;background-clip:padding-box}
