.container{display:flex;flex-wrap:wrap;gap:20px;padding:20px;font-family:sans-serif;max-width:1200px;margin:0 auto;justify-content:center}.card{border:1px solid #ccc;border-radius:8px;min-width:280px;max-width:380px;transition:transform .2s ease-in-out;display:flex;flex-direction:column;overflow:hidden}.card:hover{transform:translateY(-5px);box-shadow:0 4px 12px #0000001a}.card img{width:100%;border-top-left-radius:8px;border-top-right-radius:8px}.content{padding:15px;flex:1;display:flex;flex-direction:column}.title{font-weight:700;font-size:clamp(18px,2vw,24px);margin-bottom:8px}.price{font-weight:700;font-size:clamp(16px,1.5vw,20px);margin-top:10px;color:#2c5282}button{width:calc(100% - 30px);background:#000;color:#fff;padding:12px;text-align:center;border:none;border-radius:5px;margin:15px;cursor:pointer;font-size:16px;transition:background-color .2s ease;align-self:center}button:hover{background:#333}.donut-image{object-fit:cover;height:200px;width:100%}@media (max-width: 768px){.container{padding:10px}.card{min-width:100%}.donut-image{height:180px}}@media (max-width: 480px){.container{padding:5px}.content{padding:10px}.donut-image{height:160px}button{padding:10px;font-size:14px}}section{width:100%;margin-top:20px;padding:15px;border-radius:8px;background-color:#f8f9fa}section h2{font-size:clamp(18px,2vw,24px);margin-bottom:10px}section p{font-size:clamp(14px,1.5vw,16px);margin:5px 0}input[type=text]{width:100%;padding:12px;border:1px solid #ccc;border-radius:5px;font-size:16px;margin-top:10px;transition:border-color .2s ease}input[type=text]:focus{outline:none;border-color:#2c5282;box-shadow:0 0 0 2px #2c52821a}@media (max-width: 480px){input[type=text]{padding:10px;font-size:14px}}.circle{width:30px;height:30px;background-color:#fff;border-radius:50%;display:flex;justify-content:center;align-items:center;box-shadow:0 4px 8px #0000001a;margin-top:20px}.circle img{width:70%;height:70%;justify-content:center;align-items:center}.circle a{display:flex;justify-content:center;align-items:center;width:100%;height:100%;border-radius:50%}:root{--background: #ffffff;--foreground: #171717}html,body{max-width:100vw;overflow-x:hidden}body{color:var(--foreground);background:var(--background);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box;padding:0;margin:0}a{color:inherit;text-decoration:none}@media (prefers-color-scheme: dark){html{color-scheme:dark}}section{border:1px solid #e0e0e0;border-radius:8px;background-color:#f9f9f9;padding:13px;margin:10px;width:90%;text-align:left}.pages{align-items:center;justify-items:center;text-align:center}button{padding:10px 15px;background-color:#fff;color:#000;border:2px solid black;border-radius:6px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease;margin:15px}button:hover{background-color:#000;color:#fff}button:active{background-color:#333;color:#fff}h1{margin:20px}h2{padding-bottom:6px}pre{white-space:pre-wrap;word-wrap:break-word;word-break:break-all}.link-button{background-color:#000;color:#fff;padding:5px 10px;text-decoration:none;border-radius:5px}.link-button:hover{background-color:#333}.link-button:hover{background-color:#fff;color:#000}.advice{text-align:"center";margin-bottom:10px;line-height:25px}
