/* STORNVAL — css/style.css */
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@700&family=Inter:wght@400;500&display=swap');
:root{--bg:#0E0E12;--panel:#18181E;--ink:#EDEDF0;--muted:#A8B0BF;--accent:#8A96A8;--line:rgba(255,255,255,.12);--display:'Space Grotesk',sans-serif;--body:'Inter',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);line-height:1.7}a{color:var(--ink);text-decoration:none}a:hover{color:#fff}.topbar{background:#18181E;color:#EDEDF0;border-bottom:1px solid var(--line);font-size:.72rem;text-align:center;padding:.5rem}.site-header{background:var(--bg);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.nav{max-width:1200px;margin:auto;padding:1.1rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem}.brand{font:700 1.5rem var(--display);letter-spacing:-.04em}.nav-links{display:flex;gap:1rem;align-items:center;flex-wrap:wrap;justify-content:flex-end;font-size:.82rem}.button{display:inline-block;background:var(--accent);color:#fff;border-radius:999px;padding:.7rem 1.1rem;font-weight:600}.container{max-width:1200px;margin:0 auto;padding:0 1rem}.hero{padding:7rem 0 6rem;background:radial-gradient(circle at 80% 20%,#303846 0,#0E0E12 45%)}h1,h2,h3{font-family:var(--display);line-height:1.08;letter-spacing:-.04em;color:#fff}h1{font-size:clamp(3rem,8vw,6.8rem);max-width:850px;margin:.5rem 0 1.4rem}h2{font-size:clamp(2rem,4vw,3.3rem);margin:.3rem 0 1rem}h3{font-size:1.3rem;margin:.2rem 0 .7rem}p{color:var(--muted);max-width:700px}.eyebrow{text-transform:uppercase;letter-spacing:.18em;color:var(--accent);font-size:.72rem;font-weight:600}.section{padding:5rem 0}.panel{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:1.6rem}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.2rem}.split{display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}.split img,.gallery img{width:100%;height:330px;object-fit:cover;border-radius:16px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.stat strong{display:block;font:700 2.7rem var(--display);color:#fff}.dark-band{background:#202734}.dark-band h2,.dark-band h3,.dark-band p{color:#fff}.dark-band p{color:#E1E5EC}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:650px}.data-table th,.data-table td{text-align:left;padding:1rem;border-bottom:1px solid var(--line)}.data-table th{color:#fff}.data-table td{color:var(--muted)}.timeline{display:grid;gap:1rem}.step{display:grid;grid-template-columns:60px 1fr;gap:1rem;border-left:1px solid var(--accent);padding-left:1rem}.step b{color:var(--accent);font:700 1.6rem var(--display)}blockquote{margin:0;padding:1.5rem;border-left:3px solid var(--accent);font:700 1.4rem var(--display);color:#fff}.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}.faq{border-bottom:1px solid var(--line);padding:1rem 0}.faq h3{font-size:1rem}.callout{border:1px solid var(--accent);background:#202734;border-radius:16px;padding:1.5rem}.form-grid{display:grid;gap:1rem}.input{width:100%;padding:.85rem 1rem;background:var(--bg);border:1px solid var(--line);border-radius:8px;color:#fff}.label{display:block;font-size:.75rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:.35rem}.footer{background:#18181E;border-top:1px solid var(--line);padding:4rem 0 2rem}.footer-grid{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:2rem}.footer h3{font-size:1rem}.footer a,.footer p{display:block;color:var(--muted);font-size:.9rem;margin:.3rem 0}.copyright{border-top:1px solid var(--line);margin-top:2rem;padding-top:1rem;color:var(--muted);font-size:.8rem}.cookie{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%);max-width:900px;width:calc(100% - 2rem);background:#18181E;color:#fff;border:1px solid var(--line);border-radius:16px;padding:1rem;z-index:30;display:none}.cookie.show{display:flex;justify-content:space-between;gap:1rem;align-items:center}.cookie button{background:var(--accent);border:0;color:#fff;border-radius:999px;padding:.55rem 1rem}.hero-art{width:100%;height:360px;object-fit:cover;border-radius:22px;margin-top:2rem}.legal h2{font-size:1.7rem;margin-top:2.5rem}.legal p{max-width:none}.notice{font-size:.9rem;color:var(--muted);border-top:1px solid var(--line);padding-top:1rem}@media(max-width:800px){.nav{align-items:flex-start;flex-direction:column}.nav-links{justify-content:flex-start}.grid-3,.grid-2,.split,.quote-grid,.footer-grid{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}.hero{padding:5rem 0 4rem}.section{padding:3.5rem 0}.split img{height:260px}}

/* === 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; }
}