/*
Theme Name: Tremplin Jeunes Talents
Theme URI: https://tremplinjeunestalents.fr
Author: Custom
Description: Theme WordPress avec header image adaptive, 4 atouts cliquables, footer.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: theme-wp
*/
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; scroll-behavior: smooth; }
body { font-family: 'Ubuntu', Georgia, serif; font-size: 1rem; line-height: 1.6; color: #222; background-color: #fff; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
.container { width: 100%; max-width: 1280px; margin: 0 auto; padding: 0 2rem; }
.site-header { width: 100%; position: relative; overflow: hidden; }
.site-header__inner { width: 100%; position: relative; }
.site-header__bg { width: 100%; height: auto; display: block; object-fit: cover; }
.site-header__content { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.site-nav { position: absolute; top: 0; left: 0; width: 100%; padding: 1.5rem 2rem; display: flex; align-items: center; justify-content: space-between; z-index: 10; }
.site-nav .nav-logo { font-size: 1.25rem; font-weight: 700; letter-spacing: 0.05em; color: #fff; }
.site-nav ul { display: flex; gap: 2rem; }
.site-nav ul li a { color: #fff; font-size: 0.95rem; letter-spacing: 0.03em; transition: opacity 0.2s ease; }
.site-nav ul li a:hover { opacity: 0.7; }
.site-header--no-image { min-height: 300px; background-color: #111; }
.site-main { width: 100%; }
.section-atouts { width: 100%; padding: 4rem 2rem; }
.atouts-grid { display: flex; flex-direction: row; gap: 2rem; width: 100%; max-width: 1280px; margin: 0 auto; align-items: stretch; }
.atout-item { flex: 1 1 0; display: block; position: relative; overflow: hidden; cursor: pointer; transition: opacity 0.25s ease; }
.atout-item:hover { opacity: 0.85; }
.atout-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
.atout-item__placeholder { width: 100%; padding-bottom: 133%; background-color: #e8e8e8; position: relative; }
.atout-item__placeholder span { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 0.85rem; color: #999; letter-spacing: 0.05em; text-transform: uppercase; }
.section { padding: 4rem 2rem; }
.section--full { padding: 4rem 0; }
.site-footer { width: 100%; padding: 2.5rem 2rem; background-color: #111; color: #ccc; }
.site-footer__inner { max-width: 1280px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.site-footer__copy { font-size: 0.85rem; letter-spacing: 0.03em; }
.site-footer__nav ul { display: flex; gap: 1.5rem; }
.site-footer__nav ul li a { font-size: 0.85rem; color: #aaa; transition: color 0.2s ease; }
.site-footer__nav ul li a:hover { color: #fff; }
@media (max-width: 900px) { .atouts-grid { gap: 1.25rem; } }
@media (max-width: 600px) { .atouts-grid { flex-direction: column; gap: 1rem; } .atout-item { width: 100%; } .site-footer__inner { flex-direction: column; align-items: flex-start; } .site-nav ul { display: none; } }