@property --bg-color-1{syntax: "<color>"; inherits: false; initial-value: #334155;}@property --bg-color-2{syntax: "<color>"; inherits: false; initial-value: #1e293b;}@property --bg-color-3{syntax: "<color>"; inherits: false; initial-value: #0f172a;}@property --bg-color-4{syntax: "<color>"; inherits: false; initial-value: #030712;}@property --text-color{syntax: "<color>"; inherits: true; initial-value: #f8fafc;}@property --accent-color{syntax: "<color>"; inherits: true; initial-value: #8C2BBB;}@property --icon-filter{syntax: "*"; inherits: true; initial-value: invert(100%) sepia(0%) saturate(2115%) hue-rotate(328deg) brightness(100%) contrast(100%);}@property --accent-icon-filter{syntax: "*"; inherits: true; initial-value: invert(23%) sepia(57%) saturate(3622%) hue-rotate(270deg) brightness(85%) contrast(94%);}@font-face{font-family:Syne Variable;src:url("./media/Syne-VariableFont_wght-ZD7U2QQ7.ttf") format("truetype");font-weight:100 900;font-style:normal;font-display:swap}p{font-size:clamp(16px,1.5dvw,24px)}h1{font-size:clamp(33px,10vmin,140px);font-family:Syne Variable,sans-serif;font-weight:800}h2{font-size:clamp(30px,8dvw,100px);font-family:Syne Variable,sans-serif}h2:hover{color:var(--accent-color)}h3{font-size:clamp(24px,5dvw,48px)}@keyframes switchToLightMode{to{--bg-color-1: #f1f5f9;--bg-color-2: #e2e8f0;--bg-color-3: #cbd5e1;--bg-color-4: #94a3b8;--text-color: #0f172a;--accent-color: #00bc8f;--icon-filter: none;--accent-icon-filter: invert(64%) sepia(78%) saturate(3700%) hue-rotate(127deg) brightness(92%) contrast(101%)}}@keyframes moveToLeft{0%{transform:translate(0)}to{transform:translate(-25px,25px)}}.moveToLeft{animation-name:moveToLeft;animation-duration:3s;animation-iteration-count:infinite}@keyframes slideUnderline{0%{transform:translate(-40px);opacity:0}to{transform:translate(0);opacity:1}}.slide-underline{position:relative;display:inline-block;text-decoration:none;font-weight:lighter}.slide-underline:after{content:"";position:absolute;left:65%;bottom:-2px;width:35%;height:2px;background-color:var(--accent-color);opacity:0}.slide-underline:hover:after{animation:slideUnderline .2s ease-out forwards}.padding{padding-bottom:0;padding-top:0;padding-left:clamp(12px,5%,48px);padding-right:clamp(12px,5%,48px)}.max-width{max-width:1440px;width:100%}.structure{width:100%;display:flex;justify-content:center}.button-one{width:250px;border:4px solid white;filter:brightness(.5);background-color:transparent;padding:10px 24px;font-size:24px;transition:width .3s ease}.button-one.is-valid:hover{cursor:pointer;width:300px;font-weight:700;filter:brightness(1)}.button-two{width:clamp(140px,35vw,200px);border:4px solid var(--text-color);background-color:transparent;padding:10px 24px;font-size:clamp(16px,4dvw,24px);transition:width .3s ease;text-align:center}.button-two:hover{cursor:pointer;width:clamp(160px,45dvw,250px);font-weight:700}.icon-color-theme{filter:var(--accent-icon-filter);transition:filter 1s ease-in-out}.arrow-back{width:clamp(24px,3dvw,32px);position:absolute;top:24px;right:clamp(12px,5%,48px);filter:var(--accent-icon-filter)}.arrow-back:hover{cursor:pointer}*{position:relative;padding:0;margin:0;text-decoration:none;list-style:none;box-sizing:border-box;scroll-behavior:smooth;font-size:inherit;color:var(--text-color);font-family:inherit;background-color:inherit}#body{display:grid;grid-template-rows:250px 1fr 250px;width:100%;min-height:100dvh;--icon-filter: invert(100%) sepia(0%) saturate(2115%) hue-rotate(328deg) brightness(100%) contrast(100%);--accent-icon-filter: invert(23%) sepia(57%) saturate(3622%) hue-rotate(270deg) brightness(85%) contrast(94%);background:radial-gradient(circle at center,var(--bg-color-1) 0%,var(--bg-color-2) 25%,var(--bg-color-3) 60%,var(--bg-color-4) 100%);background-size:400% 400%;background-attachment:fixed;animation:liquidGlow 15s ease-in-out infinite alternate;transition:--bg-color-1 3s ease-in-out,--bg-color-2 3s ease-in-out,--bg-color-3 3s ease-in-out,--bg-color-4 3s ease-in-out,--text-color .5s ease-in-out,--accent-color .5s ease-in-out}#body.light-theme-active{--bg-color-1: #f1f5f9;--bg-color-2: #e2e8f0;--bg-color-3: #cbd5e1;--bg-color-4: #94a3b8;--text-color: #0f172a;--accent-color: #00bc8f;--icon-filter: none;--accent-icon-filter: invert(64%) sepia(78%) saturate(3700%) hue-rotate(127deg) brightness(92%) contrast(101%)}@keyframes liquidGlow{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:50% 100%}}
