/* ── PIT SARL – Shared stylesheet for all pages ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

:root {
  --teal:      #1a7f8e;
  --teal-dark: #0f5a66;
  --teal-light:#e8f4f6;
  --accent:    #e05a00;
  --grey-bg:   #f4f5f6;
  --grey-mid:  #dde2e6;
  --text:      #1c1e21;
  --text-mid:  #4a5568;
  --white:     #ffffff;
  --nav-h:     56px;
}
html { scroll-behavior: smooth; }
body {
  font-family: 'Inter', Arial, sans-serif;
  font-size: 15px;
  color: var(--text);
  background: var(--grey-bg);
  line-height: 1.6;
}

/* ── BANNER ── */
.site-banner { width:100%; max-height:80px; overflow:hidden; background:var(--teal-dark); }
.site-banner img { width:100%; height:80px; object-fit:cover; object-position:center; display:block; opacity:.9; }

/* ── NAV ── */
nav { background:var(--teal-dark); position:sticky; top:0; z-index:100; box-shadow:0 2px 8px rgba(0,0,0,.25); }
.nav-inner { max-width:1100px; margin:0 auto; display:flex; align-items:center; height:var(--nav-h); padding:0 16px; gap:4px; }
.nav-logo { font-family:'Barlow Condensed',sans-serif; font-size:1.5rem; font-weight:700; color:var(--white); letter-spacing:1px; margin-right:auto; text-decoration:none; }
.nav-logo span { color:#7ed8e8; }
.nav-links { display:flex; list-style:none; gap:2px; height:100%; align-items:stretch; }
.nav-links > li { position:relative; display:flex; align-items:stretch; }
.nav-links > li > a, .nav-links > li > button { display:flex; align-items:center; gap:4px; padding:0 14px; background:none; border:none; color:#cce8ee; font:500 13px/1 'Inter',sans-serif; cursor:pointer; white-space:nowrap; text-decoration:none; transition:background .15s,color .15s; }
.nav-links > li > a:hover, .nav-links > li > button:hover, .nav-links > li:hover > a, .nav-links > li:hover > button { background:var(--teal); color:var(--white); }
.nav-links > li > button::after { content:'▾'; font-size:10px; opacity:.7; }
.dropdown { position:absolute; top:var(--nav-h); left:0; min-width:620px; background:var(--white); border-top:3px solid var(--teal); box-shadow:0 8px 24px rgba(0,0,0,.15); border-radius:0 0 8px 8px; display:grid; grid-template-columns:repeat(3,1fr); gap:0; opacity:0; pointer-events:none; transform:translateY(-6px); transition:opacity .2s,transform .2s; }
.nav-links > li:hover .dropdown { opacity:1; pointer-events:all; transform:translateY(0); }
.dropdown-col { padding:18px 16px; border-right:1px solid var(--grey-mid); }
.dropdown-col:last-child { border-right:none; }
.dropdown-col h4 { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.8px; color:var(--teal); margin-bottom:8px; padding-bottom:6px; border-bottom:1px solid var(--grey-mid); }
.dropdown-col h4.sub { margin-top:12px; }
.dropdown-col a { display:block; padding:4px 0; font-size:12.5px; color:var(--text-mid); text-decoration:none; transition:color .15s; }
.dropdown-col a:hover { color:var(--teal); font-weight:600; }
.hamburger { display:none; background:none; border:none; cursor:pointer; padding:8px; color:var(--white); font-size:22px; }
.mobile-menu { display:none; flex-direction:column; background:var(--teal-dark); padding:12px 0; }
.mobile-menu.open { display:flex; }
.mobile-menu a { color:#cce8ee; text-decoration:none; padding:10px 24px; font-size:14px; border-bottom:1px solid rgba(255,255,255,.08); }
.mobile-menu a:hover { background:var(--teal); color:white; }
.mobile-section-title { color:#7ed8e8; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:1px; padding:14px 24px 4px; }

/* ── PAGE LAYOUT ── */
.page-wrapper { max-width:1100px; margin:0 auto; padding:32px 16px 60px; display:grid; grid-template-columns:1fr 300px; gap:32px; }
@media(max-width:768px){ .page-wrapper { grid-template-columns:1fr; } }
.page-main {}
.page-sidebar {}

/* ── BREADCRUMB ── */
.breadcrumb { font-size:12px; color:var(--text-mid); margin-bottom:20px; }
.breadcrumb a { color:var(--teal); text-decoration:none; }
.breadcrumb a:hover { text-decoration:underline; }
.breadcrumb span { margin:0 6px; }

/* ── PRODUCT HEADER ── */
.product-header { margin-bottom:24px; }
.product-tag { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:var(--teal); margin-bottom:6px; }
.product-header h1 { font-family:'Barlow Condensed',sans-serif; font-size:2.4rem; font-weight:700; color:var(--teal-dark); line-height:1.1; margin-bottom:10px; }
.product-divider { width:48px; height:3px; background:var(--accent); border-radius:2px; margin-bottom:16px; }

/* ── CONTENT CARD ── */
.card { background:var(--white); border-radius:10px; box-shadow:0 2px 12px rgba(0,0,0,.07); padding:24px; margin-bottom:24px; }
.card h2 { font-family:'Barlow Condensed',sans-serif; font-size:1.4rem; font-weight:700; color:var(--teal-dark); margin-bottom:12px; padding-bottom:8px; border-bottom:2px solid var(--teal-light); }
.card p { color:var(--text-mid); margin-bottom:10px; font-size:14px; line-height:1.7; }
.card ul { padding-left:20px; color:var(--text-mid); font-size:14px; line-height:1.8; }

/* ── HERO IMAGE ── */
.product-hero { width:100%; border-radius:10px; object-fit:cover; max-height:400px; display:block; margin-bottom:24px; background:var(--teal-light); }

/* ── PHOTO GALLERY ── */
.gallery-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:10px; }
.gallery-grid a { display:block; border-radius:6px; overflow:hidden; }
.gallery-grid img { width:100%; height:140px; object-fit:cover; display:block; transition:transform .2s; }
.gallery-grid a:hover img { transform:scale(1.04); }

/* Lightbox */
.lightbox-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.85); z-index:1000; align-items:center; justify-content:center; }
.lightbox-overlay.active { display:flex; }
.lightbox-overlay img { max-width:90vw; max-height:90vh; border-radius:6px; box-shadow:0 8px 40px rgba(0,0,0,.5); }
.lightbox-close { position:absolute; top:20px; right:28px; color:white; font-size:2rem; cursor:pointer; background:none; border:none; line-height:1; }
.lightbox-prev, .lightbox-next { position:absolute; top:50%; transform:translateY(-50%); color:white; font-size:2.5rem; cursor:pointer; background:rgba(0,0,0,.3); border:none; padding:8px 16px; border-radius:6px; }
.lightbox-prev { left:12px; }
.lightbox-next { right:12px; }

/* ── PDF DOWNLOADS ── */
.pdf-links { display:flex; flex-wrap:wrap; gap:10px; }
.pdf-link { display:inline-flex; align-items:center; gap:8px; padding:10px 16px; background:var(--teal-light); border:1px solid var(--teal); border-radius:6px; color:var(--teal-dark); text-decoration:none; font-size:13px; font-weight:600; transition:background .15s; }
.pdf-link:hover { background:var(--teal); color:white; }
.pdf-link::before { content:'📄'; }

/* ── VIDEO EMBED ── */
.video-wrap { position:relative; padding-bottom:56.25%; height:0; overflow:hidden; border-radius:8px; margin-bottom:16px; }
.video-wrap iframe { position:absolute; top:0; left:0; width:100%; height:100%; border:0; }

/* ── SIDEBAR ── */
.sidebar-card { background:var(--white); border-radius:10px; box-shadow:0 2px 12px rgba(0,0,0,.07); padding:20px; margin-bottom:20px; }
.sidebar-card h3 { font-family:'Barlow Condensed',sans-serif; font-size:1.1rem; font-weight:700; color:var(--teal-dark); margin-bottom:12px; padding-bottom:8px; border-bottom:2px solid var(--teal-light); }
.related-link { display:flex; align-items:center; gap:10px; padding:8px 0; border-bottom:1px solid var(--grey-mid); text-decoration:none; color:var(--text-mid); font-size:13px; transition:color .15s; }
.related-link:last-child { border-bottom:none; }
.related-link:hover { color:var(--teal); }
.related-link img { width:50px; height:40px; object-fit:cover; border-radius:4px; background:var(--teal-light); flex-shrink:0; }
.contact-cta { background:var(--teal-dark); color:white; border-radius:10px; padding:20px; text-align:center; margin-bottom:20px; }
.contact-cta p { font-size:13px; opacity:.85; margin-bottom:12px; }
.contact-cta a { display:block; background:var(--accent); color:white; padding:10px; border-radius:6px; text-decoration:none; font-weight:600; font-size:14px; }
.contact-cta a:hover { background:#c44e00; }

/* ── FOOTER ── */
footer { background:var(--teal-dark); color:#cce8ee; padding:40px 16px 20px; }
.footer-inner { max-width:1100px; margin:0 auto; display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:32px; padding-bottom:24px; border-bottom:1px solid rgba(255,255,255,.15); margin-bottom:20px; }
.footer-col h4 { color:white; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.8px; margin-bottom:12px; }
.footer-col a { display:block; color:#9ecdd6; text-decoration:none; font-size:13px; padding:3px 0; }
.footer-col a:hover { color:white; }
.footer-col p { font-size:13px; line-height:1.7; }
.footer-bottom { max-width:1100px; margin:0 auto; font-size:12px; opacity:.6; text-align:center; }

@media(max-width:768px){
  .nav-links { display:none; }
  .hamburger { display:block; }
}
