/*
Theme Name: FILTRE MAROC One Page
Theme URI: https://filtre-maroc.example
Author: FILTRE MAROC
Author URI: https://filtre-maroc.example
Description: One-page WordPress theme for FILTRE MAROC inspired by Aquabo.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: filtre-maroc
Tags: one-column, custom-colors, custom-logo, responsive-layout, one-page
*/

/* Base styles */
:root {
  --primary-color: #1f6fff; /* Can be customized in Customizer */
  --secondary-color: #1ec9a3;
  --accent-color: #ff8a1f;
  --bg: #ffffff;
  --fg: #14202b;
  --muted: #f2f5f8;
}

html { scroll-behavior: smooth; }

body {
  margin: 0;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  color: var(--fg);
  background: var(--bg);
  line-height: 1.6;
}

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

/* Header */
#site-header {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: #ffffffcc;
  backdrop-filter: blur(8px);
  border-bottom: 1px solid #e6ebf1;
}
#site-header .inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 0;
}
.branding { display: inline-flex; align-items: center; gap: 12px; }
.branding .site-title { text-decoration: none; color: var(--fg); font-weight: 700; font-size: 1.1rem; }
.primary-menu { list-style: none; display: flex; gap: 16px; margin: 0; padding: 0; }
.primary-menu a { text-decoration: none; color: var(--fg); font-weight: 600; }
.primary-menu a:hover { color: var(--primary-color); }

/* Hero */
#hero {
  background: linear-gradient(135deg, var(--primary-color) 0%, #4da1ff 50%, #7fc1ff 100%);
  color: white;
  padding: 96px 0 72px;
}
#hero .sub { opacity: 0.9; max-width: 760px; }
.btn-primary {
  display: inline-block;
  background: var(--accent-color);
  color: #fff;
  padding: 12px 20px;
  border-radius: 10px;
  text-decoration: none;
  font-weight: 700;
}

/* Sections */
.section {
  padding: 64px 0;
}
.section.alt { background: var(--muted); }
.section h2 { margin-top: 0; font-size: 2rem; }
.grid {
  display: grid;
  gap: 16px;
}
.grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 900px) { .grid.cols-3, .grid.cols-4 { grid-template-columns: repeat(2, 1fr);} }
@media (max-width: 600px) { .grid.cols-3, .grid.cols-4 { grid-template-columns: 1fr;} }
.card {
  background: #fff;
  border: 1px solid #e6ebf1;
  border-radius: 14px;
  padding: 18px;
}
.card .title { font-weight: 700; }
.card .desc { color: #566370; font-size: 0.95rem; }

/* Footer */
#site-footer {
  padding: 32px 0; border-top: 1px solid #e6ebf1;
}
#site-footer p { margin: 0; color: #566370; }