/* ============================================================
   main.css — Project styles
   Structure: import tokens → import base → project sections
   Breakpoints: sm 600px  md 900px  lg 1200px  xl 1600px
   ============================================================ */

@import 'root.css';
@import 'base.css';
@import 'menu.css';


/* ── Hero ────────────────────────────────────────────────── */



/* ── Hero ────────────────────────────────────────────────── */
/* Tip: add padding-top matching #mainNav height (64px) to body or first section */



/* ── Sections (shared section patterns) ─────────────────── */



/* ── Homepage ────────────────────────────────────────────── */



/* ── News list ───────────────────────────────────────────── */



/* ── News detail ─────────────────────────────────────────── */



/* ── Contact form ────────────────────────────────────────── */



/* ── Newsletter ──────────────────────────────────────────── */



/* ── Footer ──────────────────────────────────────────────── */



/* ── Responsive ──────────────────────────────────────────── */
/*
   Rule: use only the 4 breakpoints defined in root.css.
   Write mobile-first (min-width). Add max-width only when
   genuinely needed to constrain something on desktop.
*/

@media (min-width: 600px) {

}

@media (min-width: 900px) {

}

@media (min-width: 1200px) {

}

@media (min-width: 1600px) {

}