.section {
    padding: 20px;
}

.img-box {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-bottom: 15px;
}

.img-box img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}

#about {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 20px;
}


.about-text {
    font-size: 18px;
    line-height: 1.8;
    color: #333;
    max-width: 800px;
}

.about-text strong {
    color: #0a3d62;
    font-weight: bold;
}

.about-text span {
    color: #07466d;
}


.service-list {
    list-style-type: none; /* default bullets remove karanne */
    padding: 0;
    margin: 0;
}

.service-list li {
    padding: 10px 0;       /* list item spacing */
    border-bottom: 1px solid #ccc; /* horizontal line under each item */
}

/* Last item ekata line eka remove karanna */
.service-list li:last-child {
    border-bottom: none;
}


/* pricing  */
.pricing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-top: 20px;
}

.price-card {
    background: #f0f8ff;
    padding: 20px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    text-align: left;
}

.price-card h3 {
    margin-bottom: 15px;
    color: #0a3d62;
}

.price-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.price-list li {
    padding: 8px 0;
    border-bottom: 1px solid #ccc;
}

.price-list li:last-child {
    border-bottom: none;
}
/* pricing end */


footer {
    position: relative;
    color: white;
    text-align: center;
    padding: 40px 20px;
    margin-top: 40px;
    overflow: hidden;
    background-color: #0a3d62; /* fallback color */
    height: 150px;
}

.footer-bg img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.2; /* subtle image behind text */
    z-index: 1;
}

.footer-content {
    position: relative;
    z-index: 2; /* text above the image */
    font-size: 16px;
    font-weight: bold;
}


body {
    margin: 0;
    font-family: Arial, sans-serif;
    background: linear-gradient(to bottom, #e0f7fa, #ffffff); /* soft gradient */
    color: #222;
}

/* Optional: subtle background pattern image */
body::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url('images/bg-pattern.jpg') repeat;
    opacity: 0.05; /* very light pattern */
    z-index: -1;
}

/* Cards and sections remain with subtle white / blue background */
.section, .card, .price-card {
    background: rgba(255, 255, 255, 0.95); /* slightly transparent for soft effect */
    box-shadow: 0 0 12px rgba(0,0,0,0.08);
}


.card {
    background: #f0f8ff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 0 8px rgba(0,0,0,0.1);
    position: relative;
    text-align: center;

    /* Full card horizontal gradient line at the bottom */
    border-bottom: 4px solid; /* thickness */
    border-image: linear-gradient(to right, #0a3d62, #00bcd4) 1;
}

body {
    background-image: url('images/logo3.jpg');
    background-size: cover;      /* screen ekata fit wenna */
    background-repeat: no-repeat; /* repeat wenne ne */
    background-position: center;  /* center ekata align karanna */
    background-attachment: fixed; /* scroll karana kota background eka fixed wenna */
}


.imagebg {
    background-image: url('images/refrigeratorservices.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 50px;
    border-radius: 12px;
}

.pricingimagebg{
    background-image: url('images/accervices.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    padding: 50px;
    border-radius: 12px;
}

/* Header layout */
.site-header {
    display: flex;
    align-items: center;
    background: #0a3d62;
    padding: 10px 20px;
    flex-wrap: wrap; /* small screens වල wrap වෙන්න */
}

.site-header .logo {
    height: 60px;
    margin-right: 15px;
}

.site-header .header-text {
    display: flex;
    flex-direction: column;
}

.site-header .company-name {
    font-size: 24px;
    font-weight: bold;
    color: white;
}

.site-header .tagline {
    font-size: 12px;
    color: white;
    margin: 2px 0 0 0;
}

/* Hero section */
.hero {
    background: #c8dfea;
    padding: 40px 20px;
    text-align: center;
}

.hero h1 {
    font-size: 32px;
    margin-bottom: 10px;
}

.hero p {
    font-size: 16px;
    margin: 0;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .site-header {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    .site-header .logo {
        margin-right: 0;
        margin-bottom: 8px;
    }

    .site-header .company-name {
        font-size: 20px;
    }

    .site-header .tagline {
        font-size: 12px;
    }

    .hero h1 {
        font-size: 24px;
    }

    .hero p {
        font-size: 14px;
    }
}


:root{
--accent:#0ea5a4;
--bg:#f6f9fb;
--card:#ffffff;
--text:#0f172a;
--muted:#6b7280;
--max-width:1100px;
font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

.post-wrap{width:100%;max-width:var(--max-width)}


.post-card{background:linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(250,250,250,1) 100%);border-radius:12px;box-shadow:0 6px 22px rgba(11,15,30,0.08);overflow:hidden;display:grid;grid-template-columns:1fr 420px;gap:0;align-items:stretch}


/* Image column */
.post-media{position:relative;background:#e6eef0;min-height:360px;display:flex;align-items:center;justify-content:center}
.post-media img{width:100%;height:100%;object-fit:cover;display:block}
.image-overlay{position:absolute;left:12px;bottom:12px;background:rgba(0,0,0,0.5);color:#fff;padding:8px 10px;border-radius:8px;font-size:13px}


/* Content column */
.post-content{padding:28px 30px}
.kicker{display:inline-block;background:var(--accent);color:#fff;padding:6px 10px;border-radius:8px;font-weight:600;font-size:13px}
h1{margin:14px 0 8px;font-size:22px;line-height:1.15}
p.lead{margin:0 0 14px;color:var(--muted);font-size:15px}


.benefits{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:14px}
.benefit{background:#fbfdfe;padding:12px;border-radius:8px;border:1px solid rgba(16,24,40,0.03)}
.benefit strong{display:block;margin-bottom:6px}


.cta{display:flex;gap:12px;align-items:center;margin-top:18px}
.btn{background:var(--accent);color:#fff;padding:10px 14px;border-radius:10px;border:none;font-weight:600;cursor:pointer}
.btn.secondary{background:transparent;color:var(--text);border:1px solid rgba(15,23,42,0.06)}


.meta{margin-top:12px;color:var(--muted);font-size:14px}


/* file input small helper */
.upload-wrap{position:absolute;top:12px;right:12px;z-index:10}
.file-input{display:inline-block}


/* Responsive */
@media (max-width:900px){
.post-card{grid-template-columns:1fr;}
.post-media{min-height:220px}
.benefits{grid-template-columns:1fr}
.post-content{padding:18px}
}


/* small tweaks */
ul{margin:10px 0 0;padding-left:18px;color:var(--muted)}
a{color:var(--accent);text-decoration:none}










/*grid*/




.img-grid{
width:100%;
max-width:1200px;
display:grid;
grid-template-columns:repeat(4,1fr);
gap:14px;
}





/* Mobile responsive: 1 image per row */
@media (max-width:768px){
.img-grid{
grid-template-columns:1fr;
}
}