/*
  Core stylesheet for usdtoinr.net
  Designed for speed and responsiveness. No external frameworks are used.
*/
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;line-height:1.6;color:#1a2e35;background:#f9f9f9;}
header{background:#003366;color:#fff;padding:20px 0;}
nav ul{display:flex;list-style:none;justify-content:center;gap:15px;flex-wrap:wrap;}
nav a{color:#fff;text-decoration:none;font-weight:600;padding:4px 6px;}
nav a:hover{text-decoration:underline;}
.container{max-width:1200px;margin:auto;padding:20px;}
.hero{background:url('images/hero.webp') no-repeat center/cover;min-height:320px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;}
.hero h1{font-size:2.6rem;margin-bottom:10px;text-shadow:0 2px 4px rgba(0,0,0,.4);}
.hero p{font-size:1.1rem;max-width:700px;margin:auto;text-shadow:0 1px 3px rgba(0,0,0,.4);}
.section{margin:40px 0;}
.converter{display:flex;flex-wrap:wrap;gap:20px;justify-content:center;align-items:flex-end;margin-top:20px;}
.converter .field{display:flex;flex-direction:column;}
.converter label{font-weight:600;margin-bottom:5px;}
.converter input{padding:10px;border:1px solid #ccc;border-radius:4px;width:200px;font-size:1rem;}
.rate-display{font-weight:600;font-size:1.1rem;margin-top:15px;text-align:center;}
table{width:100%;border-collapse:collapse;margin-top:20px;font-size:0.9rem;}
table th,table td{border:1px solid #ddd;padding:8px;text-align:center;}
table th{background:#f2f2f2;}
.chart-container{width:100%;height:320px;margin-top:20px;position:relative;}
canvas{width:100%;height:100%;}
.footer{background:#003366;color:#fff;padding:20px;text-align:center;font-size:0.9rem;margin-top:40px;}
.footer a{color:#fff;text-decoration:underline;}
@media(max-width:768px){
  .hero h1{font-size:2rem;}
  .converter input{width:100%;}
}