@import "https://fonts.googleapis.com/css2?family=Kaushan+Script&family=Red+Hat+Display:wght@400;700;900&display=swap";
@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/8a480f0b521d4e75-s.8e0177b5.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/7178b3e590c64307-s.b97b3418.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/caa3a2e1cccd8315-s.p.853070df.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Geist Fallback;src:local(Arial);ascent-override:95.94%;descent-override:28.16%;line-gap-override:0.0%;size-adjust:104.76%}.geist_fc8c4bc0-module__MPP-3a__className{font-family:Geist,Geist Fallback;font-style:normal}.geist_fc8c4bc0-module__MPP-3a__variable{--font-geist-sans:"Geist","Geist Fallback"}
@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/4fa387ec64143e14-s.c1fdd6c2.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/bbc41e54d2fcbd21-s.799d8ef8.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/797e433ab948586e-s.p.dbea232f.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Geist Mono Fallback;src:local(Arial);ascent-override:74.67%;descent-override:21.92%;line-gap-override:0.0%;size-adjust:134.59%}.geist_mono_55d3acf3-module__UNk6MG__className{font-family:Geist Mono,Geist Mono Fallback;font-style:normal}.geist_mono_55d3acf3-module__UNk6MG__variable{--font-geist-mono:"Geist Mono","Geist Mono Fallback"}
:root{--primary-colour-light:#e63946;--primary-colour-dark:#eee;--secondary-colour-light:#333;--secondary-color-bg-change:#292929;--secondary-color-bg:#292929;--glow-colour:rgba(255,255,255,.1);--primary-focus:#ff6b6b;--primary-red-light:#ff4d4d;--primary-red-medium:#e63946;--primary-red-dark:#8b0000;--bg-card:#444;--bg-hover:rgba(255,255,255,.1);--accent-red:#e63946;--accent-green:#4caf50;--accent-orange:#ffb74d;--light-color:#eee;--dark-color:#333;--text-primary:#fff;--text-secondary:#a1a1aa;--border-color:#555;--body-font:"Red Hat Display",sans-serif;--second-font:"Kaushan Script",cursive;--biggest-font-size:2rem;--bigger-font-size:1.5rem;--biggest-font-size1:2rem;--bigger-font-size1:1.5rem;--normal-font-size1:.938rem;--big-font-size:1.25rem;--h1-font-size:1.5rem;--h2-font-size:1.25rem;--h3-font-size:1rem;--normal-font-size:.938rem;--small-font-size:.813rem;--smaller-font-size:.75rem;--img-width:40%;--sb-track-bg:rgba(0,0,0,.04);--sb-thumb-bg:linear-gradient(180deg,#b91010,#810808);--sb-thumb-hover:linear-gradient(180deg,#a30e0e,#6b0606);--sb-thumb-radius:999px;--sb-width:8px;--sb-width-active:12px;--sb-glow:0 0 8px rgba(8,129,120,.18);--font-bold:700;--font-black:900;--z-tooltip:10;--z-fixed:100}@media screen and (min-width:1200px){:root{--biggest-font-size:7rem;--bigger-font-size:4rem;--big-font-size:3rem;--h1-font-size:2.5rem;--h2-font-size:1.75rem;--h3-font-size:1.5rem;--normal-font-size:1.125rem;--small-font-size:1rem;--smaller-font-size:.875rem}}@media screen and (min-width:769px) and (max-width:1023px){:root{--biggest-font-size:5rem;--bigger-font-size:3rem;--big-font-size:2.25rem;--h1-font-size:1.75rem;--h2-font-size:1.375rem;--h3-font-size:1.125rem;--normal-font-size:.938rem;--small-font-size:.875rem;--smaller-font-size:.813rem}}@media screen and (min-width:577px) and (max-width:768px){:root{--biggest-font-size:4rem;--bigger-font-size:2.5rem;--big-font-size:2rem;--h1-font-size:1.5rem;--h2-font-size:1.25rem;--h3-font-size:1rem;--normal-font-size:.875rem;--small-font-size:.813rem;--smaller-font-size:.75rem}}@media screen and (max-width:576px){:root{--biggest-font-size:3rem;--bigger-font-size:2rem;--big-font-size:1.5rem;--h1-font-size:1.25rem;--h2-font-size:1rem;--h3-font-size:.875rem;--normal-font-size:.813rem;--small-font-size:.75rem;--smaller-font-size:.688rem}}@media screen and (min-width:1000px){:root{--biggest-font-size:10rem;--bigger-font-size:5rem;--biggest-font-size1:6rem;--bigger-font-size1:3.5rem;--normal-font-size1:1rem;--big-font-size:2.75rem;--h1-font-size:2.25rem;--h2-font-size:1.5rem;--h3-font-size:1.25rem;--normal-font-size:1rem;--small-font-size:.875rem;--smaller-font-size:.813rem;--img-width:43%}}@media screen and (max-width:1000px){:root{--biggest-font-size1:4rem;--bigger-font-size1:2.25rem;--normal-font-size1:1rem;--img-width:55%}}@media screen and (max-width:630px){:root{--img-width:90%}}@media screen and (min-width:530px){:root{--biggest-font-size1:4rem;--bigger-font-size1:2.25rem;--normal-font-size1:1rem}}@media screen and (max-width:530px){:root{--biggest-font-size1:2rem;--bigger-font-size1:1.5rem;--normal-font-size1:.938rem;--img-width:85%}}@media screen and (max-width:350px){:root{--img-width:100%}}@media screen and (max-width:840px){:root{--h3-font-size:.8rem}}#transition{background:var(--primary-colour-dark);z-index:1000;justify-content:center;align-items:center;transition:transform 1s ease-in-out;display:flex;position:fixed;top:0;bottom:0;left:0;right:0;transform:translateY(-150%)}#transition.enter-bottom{transform:translateY(150%)}#transition.enter-bottom.transition-in{transform:translateY(0)}#transition.enter-bottom.transition-out,#transition.enter-top{transform:translateY(-150%)}#transition.enter-top.transition-in{transform:translateY(0)}#transition.enter-top.transition-out{transform:translateY(150%)}#transition-text{color:var(--secondary-colour-light);letter-spacing:2px;font-size:2rem;font-weight:700}input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}body{overflow-x:hidden}li{list-style:none}*{box-sizing:border-box;margin:0;padding:0;transition:all .5s}a{text-decoration:none}@keyframes righttoleft{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translateY(0)}}.sizeDiv{background:var(--secondary-colour-light);justify-content:center;align-items:center;display:flex}
.demo-container{text-align:center;max-width:800px;margin:0 auto}.demo-container h1{color:var(--primary-colour-dark);margin-bottom:2rem;font-size:2.5rem}.trigger-buttons{flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:2rem;display:flex}.btn{cursor:pointer;text-transform:uppercase;letter-spacing:.5px;border:none;border-radius:8px;padding:12px 24px;font-size:1rem;font-weight:600;transition:all .3s}.btn-success{color:#fff;background:linear-gradient(135deg,#28a745,#20c997)}.btn-warning{color:var(--secondary-colour-light);background:linear-gradient(135deg,#ffc107,#fd7e14)}.btn-error{background:linear-gradient(135deg,var(--primary-red-medium),var(--primary-red-dark));color:#fff}.btn-info{color:#fff;background:linear-gradient(135deg,#17a2b8,#007bff)}.btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px rgba(0,0,0,.3)}.alert-overlay{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:1000;opacity:0;visibility:hidden;background:rgba(0,0,0,.7);width:100%;height:100%;transition:all .3s;position:fixed;top:0;left:0}.alert-overlay.show{opacity:1;visibility:visible}.alert-box{background:var(--secondary-color-bg-change);border:1px solid var(--glow-colour);z-index:1001;border-radius:16px;min-width:400px;max-width:90vw;padding:2rem;transition:all .3s cubic-bezier(.34,1.56,.64,1);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)scale(.7);box-shadow:0 20px 60px rgba(0,0,0,.5)}.alert-overlay.show .alert-box{transform:translate(-50%,-50%)scale(1)}.alert-header{align-items:center;gap:1rem;margin-bottom:1.5rem;display:flex}.alert-icon{border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.5rem;font-weight:700;display:flex}.alert-icon.success{color:#fff;background:linear-gradient(135deg,#28a745,#20c997)}.alert-icon.warning{color:var(--secondary-colour-light);background:linear-gradient(135deg,#ffc107,#fd7e14)}.alert-icon.error{background:linear-gradient(135deg,var(--primary-red-medium),var(--primary-red-dark));color:#fff}.alert-icon.info{color:#fff;background:linear-gradient(135deg,#17a2b8,#007bff)}.alert-title{color:var(--primary-colour-dark);margin:0;font-size:1.5rem;font-weight:700}.alert-message{color:var(--primary-colour-dark);opacity:.9;margin-bottom:2rem;font-size:1rem;line-height:1.6}.alert-actions{justify-content:flex-end;gap:1rem;display:flex}.alert-btn{cursor:pointer;text-transform:uppercase;letter-spacing:.5px;border:none;border-radius:8px;padding:10px 20px;font-size:.9rem;font-weight:600;transition:all .3s}.alert-btn-primary{background:linear-gradient(135deg,var(--primary-red-medium),var(--primary-red-dark));color:#fff}.alert-btn-secondary{color:var(--primary-colour-dark);border:2px solid var(--glow-colour);background:0 0}.alert-btn:hover{transform:translateY(-1px);box-shadow:0 4px 15px rgba(0,0,0,.3)}.alert-btn-secondary:hover{background:var(--glow-colour)}.close-btn{color:var(--primary-colour-dark);cursor:pointer;opacity:.7;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:32px;height:32px;font-size:1.5rem;transition:opacity .3s;display:flex;position:absolute;top:1rem;right:1rem}.close-btn:hover{opacity:1;background:var(--glow-colour)}@media (max-width:480px){.alert-box{min-width:320px;padding:1.5rem}.alert-actions{flex-direction:column}.trigger-buttons{flex-direction:column;align-items:center}}
