/* GRELVAK — css/style.css */
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@700&family=Nunito+Sans:wght@400;500&display=swap');
:root{--bg:#0B1510;--panel:#132018;--ink:#E2F0E8;--muted:#A9C5B2;--accent:#4A8A62;--line:rgba(226,240,232,.14)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:'Nunito Sans',Arial,sans-serif;line-height:1.6}a{color:var(--ink);text-decoration:none}a:hover{color:#8BC59B}.container{width:min(1120px,calc(100% - 2rem));margin:0 auto}.legal{background:#132018;color:#E2F0E8;border-bottom:1px solid var(--line);font-size:.72rem;text-align:center;padding:.45rem}.top{border-bottom:1px solid var(--line);padding:1rem 0}.topin,.nav,.footergrid{display:flex;align-items:center;justify-content:space-between;gap:1rem}.brand{font:700 1.7rem Outfit,sans-serif;letter-spacing:.04em}.nav{padding:1rem 0;flex-wrap:wrap}.navlinks{display:flex;gap:1rem;flex-wrap:wrap;font-size:.9rem}.btn{display:inline-block;background:var(--accent);color:#fff;padding:.75rem 1.25rem;border-radius:999px;font-weight:700;border:0;cursor:pointer}.hero{padding:5rem 0;background:linear-gradient(110deg,var(--bg),var(--panel))}.hero h1{font:700 clamp(2.7rem,7vw,5.8rem)/1.02 Outfit,sans-serif;max-width:760px;margin:.5rem 0}.eyebrow{color:#8BC59B;text-transform:uppercase;letter-spacing:.16em;font-size:.75rem}.hero p{max-width:620px;color:var(--muted);font-size:1.1rem}.section{padding:4rem 0}.section.alt{background:var(--panel)}h2,h3{font-family:Outfit,sans-serif;line-height:1.15}h2{font-size:2.2rem;margin-top:0}.grid3,.grid2,.stats,.gallery,.reviews{display:grid;gap:1.25rem}.grid3{grid-template-columns:repeat(3,1fr)}.grid2{grid-template-columns:repeat(2,1fr)}.stats{grid-template-columns:repeat(4,1fr);text-align:center}.stat strong{display:block;color:#8BC59B;font:700 2.5rem Outfit,sans-serif}.card{background:rgba(11,21,16,.72);border:1px solid var(--line);border-radius:16px;padding:1.5rem}.card p,.muted{color:var(--muted)}img{display:block;width:100%;max-height:420px;object-fit:cover;border-radius:16px}.split{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}.gallery{grid-template-columns:repeat(3,1fr)}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:.9rem;border-bottom:1px solid var(--line)}th{color:#8BC59B}.quote{border-left:4px solid var(--accent);padding:1rem 1.5rem;background:rgba(74,138,98,.12);font-size:1.2rem}.form{display:grid;gap:1rem}.form input,.form select,.form textarea{width:100%;padding:.85rem;border:1px solid var(--line);border-radius:8px;background:var(--bg);color:var(--ink)}footer{background:#08100B;padding:3rem 0;border-top:1px solid var(--line)}.footergrid{align-items:flex-start}.footergrid>div{flex:1}.footergrid h3{font-size:1rem}.footergrid a,.footergrid p{display:block;color:var(--muted);font-size:.9rem;margin:.35rem 0}.copyright{border-top:1px solid var(--line);margin-top:2rem;padding-top:1rem;color:var(--muted);font-size:.85rem}.cookie{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%);width:min(900px,calc(100% - 2rem));padding:1rem;background:#132018;border:1px solid var(--line);border-radius:14px;z-index:4;display:none}.cookie.show{display:block}.cookie button{margin:.25rem}.notice{padding:1rem;border:1px solid #8BC59B;background:rgba(74,138,98,.12);border-radius:12px}@media(max-width:800px){.grid3,.grid2,.split,.gallery{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}.topin,.footergrid{align-items:flex-start;flex-direction:column}.navlinks{gap:.6rem}.hero{padding:3.5rem 0}}

/* === CSS FIXES — layout, images, contrast === */

/* 1. Images always contained */
img { max-width: 100% !important; height: auto !important; display: block; }
.hero-img, .product-img, .content-img, .split img, .feature-img {
  width: 100% !important;
  max-height: 520px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}

/* 2. Prevent horizontal overflow */
html, body { overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }

/* 3. Container always centered with padding */
.wrap, .inner, .container, .section-inner {
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

/* 4. Hero — always block, full width */
.hero {
  display: block !important;
  overflow: hidden !important;
}
.hero > .wrap, .hero > .inner, .hero > div {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
}

/* 5. Stats grid horizontal */
.stats, .stat-row {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 2rem !important;
  text-align: center !important;
}

/* 6. Grids */
.grid-3, .grid3 { display: grid !important; grid-template-columns: repeat(3,1fr) !important; gap: 28px !important; }
.grid-4, .grid4 { display: grid !important; grid-template-columns: repeat(4,1fr) !important; gap: 24px !important; }
.split { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 3rem !important; align-items: center !important; }

/* 7. Responsive */
@media (max-width: 1023px) {
  .stats, .stat-row { grid-template-columns: repeat(2,1fr) !important; }
  .split { grid-template-columns: 1fr !important; }
}
@media (max-width: 767px) {
  .grid-3, .grid3, .grid-4, .grid4, .split, .stats, .stat-row {
    grid-template-columns: 1fr !important;
  }
  h1 { font-size: clamp(1.8rem, 8vw, 2.8rem) !important; }
  .section { padding: 3rem 0 !important; }
  .hero { padding: 3rem 0 !important; }
}
