/* General Styles */
body {
    font-family: 'Inter', sans-serif;
    background-color: #f0f2f5;
    color: #333;
    margin: 0;
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
}

/* Header */
.header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 0;
    border-bottom: 1px solid #ddd;
    margin-bottom: 30px;
}

.header h1 {
    font-size: 2em;
    font-weight: 600;
    margin: 0;
    text-align: center;
    flex-grow: 1;
}

.back-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    text-decoration: none;
    color: #555;
    font-size: 1.1em;
    font-weight: 500;
    transition: color 0.3s;
}

.back-btn:hover {
    color: #007bff;
}

/* Provider Section */
.provider-section {
    margin-bottom: 40px;
}

.provider-section h2 {
    font-size: 1.8em;
    font-weight: 600;
    margin-bottom: 20px;
    border-bottom: 2px solid #007bff;
    padding-bottom: 10px;
    color: #007bff;
}

/* Provider Grid */
.provider-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 25px;
}

/* Provider Card */
.provider-card {
    background-color: #fff;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    padding: 20px;
    text-align: center;
    transition: transform 0.3s, box-shadow 0.3s;
    overflow: hidden; /* clips images that go outside card bounds */
}

.provider-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
}

.provider-card img {
    max-width: 140px;
    height: 60px;
    object-fit: contain;
    margin-bottom: 15px;
    /* transform-origin ensures scale/rotate happen from center of image */
    transform-origin: center center;
}

.provider-card p {
    font-size: 1em;
    font-weight: 500;
    margin: 0;
    color: #333;
}

/* ─────────────────────────────────────────────────────────────────
   IMAGE ADJUSTMENTS
   Use data-id to target each card individually. Format:
   .provider-card[data-id="CARD-ID"] img { transform: ...; }
   
   Available data-ids:
   General & Health: aditya-birla-capital, bajaj-allianz, care-health-insurance,
   chola-ms, digit, ecgc, future-generali, galaxy, hdfc-ergo, icici-lombard,
   iffco-tokio, indusind-general, liberty-general, magma-hdi, manipal-cigna,
   national-insurance, niva-bupa, oriental-insurance, raheja-qbe, royal-sundaram,
   sbi-general, shriram-general, star-health, tata-aig-general, new-india-assurance,
   united-india, universal-sompo, zuno, zurich-kotak

   Life: aditya-birla-sun-life, ageas-federal, aviva-life, axis-max,
   bajaj-allianz-life, bandhan-life, bharti-axa-life, canara-hsbc-life,
   digit-life, edelweiss-life, future-generali-life, hdfc-life,
   icici-prudential-life, indiafirst-life, kotak-life, lic, max-life,
   pnb-metlife, pramerica-life, sbi-life, shriram-life, star-union-dai-ichi,
   tata-aia-life
   ──────────────────────────────────────────────────────────────── */

/* Example — Tata AIA Life zoomed to 2.4x: */
.provider-card[data-id="tata-aia-life"] img {
    transform: translate(0px, 0px) scale(2.4) rotate(0deg);
    opacity: 1;
}

/* Add your own adjustments below — copy this pattern:
.provider-card[data-id="YOUR-ID-HERE"] img {
    transform: translate(Xpx, Ypx) scale(S) rotate(Rdeg);
    opacity: 1;
}
*/


.provider-card[data-id="tata-aia-life"] img {
    transform: translate(0px, 8px) scale(2.2) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="star-union-dai-ichi"] img {
    transform: translate(0px, 16px) scale(1.8) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="shriram-life"] img {
    transform: translate(0px, 4px) scale(1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="sbi-life"] img {
    transform: translate(0px, 6px) scale(2.2) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="pramerica-life"] img {
    transform: translate(0px, 10px) scale(1.35) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="pnb-metlife"] img {
    transform: translate(0px, 8px) scale(2.25) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="max-life"] img {
    transform: translate(0px, 0px) scale(1.8) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="lic"] img {
    transform: translate(0px, 0px) scale(2.2) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="kotak-life"] img {
    transform: translate(0px, 8px) scale(2.05) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="indiafirst-life"] img {
    transform: translate(0px, 4px) scale(2.05) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="icici-prudential-life"] img {
    transform: translate(0px, 6px) scale(1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="hdfc-life"] img {
    transform: translate(0px, 0px) scale(1.1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="future-generali-life"] img {
    transform: translate(0px, 6px) scale(1.25) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="edelweiss-life"] img {
    transform: translate(0px, 8px) scale(1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="digit-life"] img {
    transform: translate(0px, 0px) scale(1.35) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="canara-hsbc-life"] img {
    transform: translate(0px, 8px) scale(1.1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="bharti-axa-life"] img {
    transform: translate(0px, 6px) scale(2) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="bandhan-life"] img {
    transform: translate(0px, 10px) scale(0.95) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="bajaj-allianz-life"] img {
    transform: translate(0px, 4px) scale(2.25) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="axis-max"] img {
    transform: translate(0px, 8px) scale(1.05) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="aviva-life"] img {
    transform: translate(0px, 0px) scale(1.1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="ageas-federal"] img {
    transform: translate(0px, 12px) scale(1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="aditya-birla-sun-life"] img {
    transform: translate(0px, 0px) scale(1.1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="zurich-kotak"] img {
    transform: translate(0px, 10px) scale(1.25) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="zuno"] img {
    transform: translate(0px, 6px) scale(1.2) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="universal-sompo"] img {
    transform: translate(0px, 8px) scale(1.1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="united-india"] img {
    transform: translate(0px, 0px) scale(1.3) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="new-india-assurance"] img {
    transform: translate(0px, 6px) scale(1.05) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="tata-aig-general"] img {
    transform: translate(0px, 0px) scale(1.15) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="star-health"] img {
    transform: translate(0px, 2px) scale(2.15) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="shriram-general"] img {
    transform: translate(0px, 8px) scale(2.05) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="sbi-general"] img {
    transform: translate(0px, 12px) scale(2.1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="royal-sundaram"] img {
    transform: translate(0px, 8px) scale(1.05) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="raheja-qbe"] img {
    transform: translate(0px, 8px) scale(1.1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="oriental-insurance"] img {
    transform: translate(0px, 6px) scale(1.1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="niva-bupa"] img {
    transform: translate(0px, -2px) scale(2.3) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="national-insurance"] img {
    transform: translate(0px, 6px) scale(2.2) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="manipal-cigna"] img {
    transform: translate(0px, 6px) scale(1.25) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="magma-hdi"] img {
    transform: translate(0px, 10px) scale(1.1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="liberty-general"] img {
    transform: translate(0px, 8px) scale(1.15) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="indusind-general"] img {
    transform: translate(0px, 8px) scale(1.4) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="iffco-tokio"] img {
    transform: translate(0px, 0px) scale(1.25) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="icici-lombard"] img {
    transform: translate(0px, 0px) scale(1.45) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="hdfc-ergo"] img {
    transform: translate(0px, 0px) scale(1.35) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="galaxy"] img {
    transform: translate(0px, 0px) scale(1.25) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="future-generali"] img {
    transform: translate(0px, 6px) scale(1.25) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="ecgc"] img {
    transform: translate(0px, 0px) scale(1.15) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="digit"] img {
    transform: translate(0px, 0px) scale(1.35) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="chola-ms"] img {
    transform: translate(0px, 8px) scale(1.05) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="care-health-insurance"] img {
    transform: translate(0px, 0px) scale(1) rotate(0deg);
    opacity: 1;
}

.provider-card[data-id="bajaj-allianz"] img {
    transform: translate(0px, 4px) scale(2.4) rotate(0deg);
    opacity: 1;
}