:root{color:#1b1b1b;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5}*,:before,:after{box-sizing:border-box}body{background:#e9f0ed;min-height:100vh;margin:0}p{margin:0}#root{width:100%}.page{background:radial-gradient(circle at top,#f5fbf6 0%,#dbe9e3 45%,#eef3f7 100%);flex-direction:column;gap:28px;min-height:100vh;padding:20px 16px 64px;display:flex}.brand-card{background:#fff;border:1px solid #0000000a;border-radius:20px;width:100%;margin:0 auto;padding:15px 20px;box-shadow:0 20px 45px #0f42201f}.result-card{background:#fff;border:1px solid #0000000a;border-radius:20px;width:100%;margin:0 auto;padding:28px 32px;box-shadow:0 20px 45px #0f42201f}.form-card{background:#fff;border:1px solid #0000000a;border-radius:20px;width:min(1220px,50vw);margin:0 auto;padding:28px 32px;box-shadow:0 20px 45px #0f42201f}.form-card h1{justify-self:center}.error{color:red}.brand-card{justify-content:space-between;align-items:center;gap:18px;display:flex}.brand-logo{justify-content:center;align-items:center;width:180px;display:flex}.brand-logo img{max-width:100%;height:auto;display:block}.brand-details{color:#2a2a2a;text-align:left;flex:1;justify-items:right;font-size:14px;line-height:1.6}.brand-details p{margin:0}.form-card h1{color:#222;margin:0 0 12px;font-size:30px}.form-card .eyebrow{text-transform:uppercase;letter-spacing:1px;color:#3f7f34;margin:0 0 6px;font-size:14px}.form-card label{color:#202020;margin-bottom:6px;font-weight:600;display:block}.input-row{gap:12px;margin-bottom:18px;display:flex}.input-row input{background:#fafafa;border:2px solid #d1d1d1;border-radius:8px;flex:1;padding:14px 16px;font-size:16px;transition:border-color .2s}.input-row input:focus-visible{background:#fff;border-color:#1e9c37;outline:none}.input-row button{color:#fff;cursor:pointer;background:#0e7d2e;border:none;border-radius:8px;min-width:140px;padding:14px 20px;font-weight:600;transition:transform .2s,box-shadow .2s}.input-row button:hover{transform:translateY(-1px);box-shadow:0 8px 16px #0e7d2e66}.form-card small{color:#555;font-size:13px;display:block}.hint{color:#7a7a7a;justify-self:right}.result-card{flex-direction:column;gap:16px;display:flex}.result-note{color:#495650;margin:0;font-size:13px}.result-total{color:#0e7d2e;margin:4px 0 0;font-size:22px;font-weight:600}.result-grid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;display:grid}.result-grid article{background:#f5faf4;border:1px solid #def1dd;border-radius:14px;padding:18px}.result-grid h3{text-transform:uppercase;letter-spacing:.4px;color:#2b652c;margin:0 0 6px;font-size:16px}.name{margin:0 0 6px;font-size:18px;font-weight:700}.result-grid ul{flex-direction:column;gap:10px;margin:0;padding:0;list-style:none;display:flex}.result-grid li{justify-content:space-between;align-items:center;font-size:14px;display:flex}.result-grid strong{font-size:14px;font-weight:700}.download{color:#0e7d2e;cursor:pointer;background:#fff;border:1px solid #0e7d2e;border-radius:10px;align-self:flex-start;padding:12px 20px;font-size:15px;font-weight:600;transition:background .2s,color .2s}.download:hover{color:#fff;background:#0e7d2e}@media (width<=1080px){.input-row{flex-direction:column}.input-row button{width:100%}.brand-card{align-items:stretch}.brand-details{font-size:12px}.brand-logo img{width:70%}}@media (width<=760px){.page{padding:32px 12px 48px}.brand-card{align-items:left;flex-direction:row;padding:20px}.brand-logo{width:120px}.form-card{width:min(90vw,360px);padding:22px}.form-card h1{font-size:26px}.input-row input{padding:12px 14px;font-size:15px}.input-row button{padding:12px}.result-card{width:min(95vw,360px);padding:20px}.result-grid article{padding:16px}.result-grid h3{font-size:14px}.name{font-size:16px}.download{text-align:center;width:100%}.brand-details{color:#2a2a2a;text-align:left;justify-items:right;font-size:10px;line-height:1.6}}@media (width<=400px){.brand-details{text-align:right;color:#2a2a2a;text-align:left;flex:1;justify-items:right;font-size:10px;line-height:1.6}.input-row{flex-direction:column}.input-row button{width:100%}}