@font-face { font-family: 'Harry-Gilson-Title'; src: url('font/Harry-Gilson-Title.ttf') format('truetype');}
@font-face { font-family: 'Harry-Gilson-Body'; src: url('font/Harry-Gilson-Body.ttf') format('truetype');}
html{margin:0 auto;background:#ffffff;max-width:1200px}
body{font-family:'Harry-Gilson-Body','Courier New','Courier','Monaco','Menlo','Consolas',monospace;margin:0 1rem;line-height:1.5;display:flex;flex-direction:column;letter-spacing:0.08em}
a{text-decoration:none;color:#000000}
a:hover{color:#666666}
p{font-size:1rem;color:#000000}
h1,h2,h4{color:#000000}
h1{font-family:'Harry-Gilson-Title','Courier New','Courier','Monaco','Menlo','Consolas',monospace;font-size:2rem;margin:1rem 0;text-align:center;letter-spacing:0.1rem}
h2{font-family:'Harry-Gilson-Title','Courier New','Courier','Monaco','Menlo','Consolas',monospace;font-size:1.25rem;color:#000000;letter-spacing:0.1rem}
h4{font-size:1rem}
h5{padding:0;margin:0;font-size:0.875rem;color:#000000}
ul,li{color:#000000}
button{font-family:'Harry-Gilson-Body','Courier New','Courier','Monaco','Menlo','Consolas',monospace;font-size:1rem;border:none;border-radius:16px;background-color:#0d0d0d;color:#ffffff;cursor:pointer;text-align:center;display:flex;align-items:center;justify-content:center;padding:0.5rem;width:100%;margin:1rem 0;letter-spacing:0.08em}
button:hover{background-color:#333333;color:#ffffff}
.purchase-btn{font-family:'Harry-Gilson-Body','Courier New','Courier','Monaco','Menlo','Consolas',monospace;font-size:1rem;border:none;border-radius:16px;background-color:#0d0d0d;color:#ffffff;cursor:pointer;text-align:center;display:flex;align-items:center;justify-content:center;padding:0.5rem 0.5rem;width:100%;margin:0.5rem 0;text-decoration:none;box-sizing:border-box;letter-spacing:0.08em}
.purchase-btn:hover{background-color:#333333;color:#ffffff}
.purchase-btn.unavailable{pointer-events:none;background-color:#ffffff;color:#000000;border:1px solid #000000;opacity:1}
hr{border:none;height:1px;background-color:#cccccc;margin-top:0}
footer{text-align:center;padding:1rem;margin-top:0}
footer a{text-decoration:none}
footer a:hover{text-decoration:underline}
.social-links{margin-bottom:1rem;color:#000000}
.asterisk{color:#000000}
#email{margin-bottom:1rem}
#form{display:flex;flex-direction:column;gap:0.5rem;align-items:flex-start;width:100%}
#form label{font-weight:bold;text-align:left;color:#000000}
#form input{width:100%;padding:0.5rem;border:1px solid #cccccc;border-radius:4px;font-family:'Harry-Gilson-Body','Courier New','Courier','Monaco','Menlo','Consolas',monospace;font-size:1rem;text-align:left;background-color:#ffffff;color:#000000;box-sizing:border-box}
#form input:focus::placeholder{opacity:0}
#form button{width:100%}
#image-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.8);z-index:1000;justify-content:center;align-items:center}
#image-modal:focus{outline:2px solid black;outline-offset:-4px}
#image-modal.active{display:flex}
#modal-image{max-width:100%;max-height:100%}
.close{position:absolute;top:15px;right:35px;color:#ffffff;font-size:40px;font-weight:bold;cursor:pointer}
.close:hover{color:#cccccc}
.close:focus{outline:2px solid black;outline-offset:2px;border-radius:2px}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:0}
.product{display:flex;flex-direction:column;gap:0.25rem;align-items:center;position:relative}
.product h2,.product p,.product .price{text-align:left;width:100%;margin:0;padding:0}
.product h2{margin:0.5rem 0 0.25rem 0;padding:0}
.product p{margin:0 0 0.5rem 0;padding:0}
.product img{width:100%;aspect-ratio:1;object-fit:cover}
.purchase-btn { width: 100%; margin-top: auto; text-decoration: none; }
@media(max-width:768px){.product-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.product-grid{grid-template-columns:repeat(1,1fr)}}
@media(max-width:950px){html{margin:0 auto}body{margin:0 1rem}.product{display:block}.product img{aspect-ratio:auto;object-fit:contain}button{font-size:1rem;padding:0.5rem}hr{display:none}footer{margin-top:1rem}}
@media(min-width:950px){}