/* layout.css — Container, header sticky, footer, hero, grids */
/* Mobile-first — breakpoints : 640 / 768 / 1024 / 1280 */

/* --- Container --- */
.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-pad)}
@media (max-width:480px){.container{padding-left:16px;padding-right:16px}}

/* --- Sections --- */
.section{padding-block:var(--spacing-xl)}
.section--lg{padding-block:var(--spacing-2xl)}
.section--alt{background-color:var(--color-bg-alt)}
.section--energy{background-color:var(--color-bg-energy)}
.section__header{text-align:center;max-width:700px;margin-inline:auto;margin-bottom:var(--spacing-xl)}
.section__title{margin-bottom:var(--spacing-md)}
.section__subtitle{font-size:1.125rem;color:var(--color-text-muted);line-height:1.6}

/* --- Header sticky (transparent → solide) --- */
.site-header{position:sticky;top:0;z-index:100;background-color:var(--color-primary-deeper);transition:background-color var(--dur-fast) ease,box-shadow var(--dur-fast) ease}
.site-header.scrolled,.site-header.site-header--scrolled{background-color:var(--color-primary-deeper);box-shadow:var(--shadow-lg)}
.header__inner{display:flex;align-items:center;gap:var(--spacing-md);height:68px}
.header__logo{display:flex;align-items:center;gap:var(--spacing-sm);text-decoration:none;color:#fff;font-weight:700;font-size:1rem;flex-shrink:0}
.header__logo img{height:44px;width:auto}
.header__logo-text{font-size:1.375rem;font-weight:800;letter-spacing:-.02em}

/* Navigation */
.site-nav{display:flex;align-items:center;margin-left:auto}
.nav__toggle{display:flex;flex-direction:column;gap:5px;padding:var(--spacing-sm);border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;position:relative;z-index:200}
.nav__toggle-bar{display:block;width:22px;height:2px;background-color:#fff;border-radius:1px;transition:transform var(--dur-fast) ease,opacity var(--dur-fast) ease}

/* Dropdown secteurs */
.nav__item--has-dropdown{position:relative}
.nav__dropdown{display:none;position:absolute;top:100%;left:50%;transform:translateX(-50%);min-width:360px;background:var(--color-primary-deeper);border-radius:var(--radius-md);padding:var(--spacing-md);box-shadow:var(--shadow-lg);z-index:200;list-style:none;columns:2;column-gap:8px}
.nav__dropdown a{display:block;padding:var(--spacing-sm) var(--spacing-lg);color:rgba(255,255,255,.85);text-decoration:none;font-size:.875rem;white-space:nowrap;transition:background var(--transition),color var(--transition)}
.nav__dropdown a:hover{background:rgba(255,255,255,.1);color:#fff}
.nav__dropdown--open{display:block}
.nav__chevron{transition:transform var(--dur-fast) ease;margin-left:4px}
.nav__dropdown-trigger[aria-expanded="true"] .nav__chevron{transform:rotate(180deg)}

/* Hamburger → croix */
.nav__toggle[aria-expanded="true"] .nav__toggle-bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav__toggle[aria-expanded="true"] .nav__toggle-bar:nth-child(2){opacity:0}
.nav__toggle[aria-expanded="true"] .nav__toggle-bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Menu mobile overlay plein ecran */
.nav__menu{display:none;position:fixed;inset:0;background:var(--color-primary-deeper);z-index:150;flex-direction:column;align-items:center;justify-content:center;gap:var(--spacing-lg);padding:var(--spacing-xl)}
.nav__menu--open{display:flex}
.nav__link{display:block;padding:var(--spacing-sm) var(--spacing-lg);color:#fff;text-decoration:none;font-weight:500;font-size:1.125rem;position:relative;transition:color var(--transition)}
.nav__link::after{content:'';position:absolute;bottom:0;left:var(--spacing-lg);right:var(--spacing-lg);height:2px;background:var(--color-primary);transform:scaleX(0);transition:transform var(--dur-fast) var(--ease-out-expo)}
.nav__link:hover,.nav__link[aria-current=page]{color:var(--color-primary-light)}
.nav__link:hover::after,.nav__link[aria-current=page]::after{transform:scaleX(1)}
.header__cta{display:none}

@media (min-width:1024px){
.nav__toggle{display:none}
.nav__menu{display:flex;position:static;background:0 0;flex-direction:row;padding:0;gap:var(--spacing-xs);inset:auto}
.nav__link{padding:var(--spacing-xs) var(--spacing-sm);font-size:.9375rem;border-radius:var(--radius-sm)}
.nav__link::after{left:var(--spacing-sm);right:var(--spacing-sm)}
.header__cta{display:inline-flex;flex-shrink:0}
.nav__item--has-dropdown:hover .nav__dropdown{display:block}
.nav__dropdown-trigger{display:inline-flex;align-items:center;color:#fff;background:none;border:none;cursor:pointer;font-weight:500;font-size:.9375rem;padding:var(--spacing-xs) var(--spacing-sm);font-family:inherit}
}

/* --- Footer --- */
.site-footer{background-color:var(--color-primary-deeper);color:#9ca3af;padding-top:var(--spacing-xl)}
.footer__inner{display:grid;grid-template-columns:1fr;gap:var(--spacing-xl)}
@media (min-width:640px){.footer__inner{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.footer__inner{grid-template-columns:2fr 1fr 1fr 1.5fr;gap:var(--spacing-2xl)}}
.footer__brand{display:flex;flex-direction:column;gap:var(--spacing-md)}
.footer__logo{display:flex;align-items:center;gap:var(--spacing-sm);color:#fff;text-decoration:none;font-weight:700;font-size:1rem}
.footer__logo img{height:40px;width:auto}
.footer__text,.footer__tagline{font-size:.875rem;line-height:1.6;margin:0}
.footer__heading{color:#fff;font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--spacing-md)}
.footer__links{display:flex;flex-direction:column;gap:var(--spacing-sm)}
.footer__links a{color:#9ca3af;text-decoration:none;font-size:.875rem;transition:color var(--transition)}
.footer__links a:hover{color:var(--color-primary-light)}
.footer__bottom{margin-top:var(--spacing-xl);border-top:1px solid rgba(255,255,255,.1);padding-block:var(--spacing-lg)}
.footer__bottom .container{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:var(--spacing-md)}
.footer__legal{font-size:.8125rem;margin:0}
.footer__legal-nav{display:flex;flex-wrap:wrap;gap:var(--spacing-md)}
.footer__legal-nav a{color:#9ca3af;font-size:.8125rem;text-decoration:none}
.footer__legal-nav a:hover{color:var(--color-primary-light)}

/* --- Hero --- */
.hero{min-height:100vh;display:flex;align-items:center;background:var(--gradient-hero);color:#fff;position:relative;overflow:hidden;padding-block:80px}
.hero .container{position:relative;z-index:1}
.hero__inner{display:grid;grid-template-columns:1fr;gap:var(--spacing-xl);align-items:center;min-width:0}
.hero__inner>*{min-width:0}
@media (min-width:1024px){.hero__inner{grid-template-columns:1fr 1fr}}
.hero__eyebrow{display:inline-block;background-color:var(--color-primary-light);color:var(--color-primary-dark);font-size:.8125rem;font-weight:600;padding:var(--spacing-xs) var(--spacing-sm);border-radius:var(--radius-sm);text-transform:uppercase;letter-spacing:.05em;margin-bottom:var(--spacing-md)}
.hero__title{margin-bottom:var(--spacing-lg)}
.hero__subtitle{font-size:1.125rem;color:rgba(255,255,255,.85);margin-bottom:var(--spacing-xl);line-height:1.6}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--spacing-md);align-items:center}

/* Hero pages internes (gradient + orbes) */
.hero--page{background:var(--gradient-hero);color:#fff;padding-block:var(--spacing-2xl);display:flex;align-items:center;position:relative;overflow:hidden;min-height:auto}
.hero--page::before{content:'';position:absolute;top:-30%;right:-15%;width:600px;height:600px;background:radial-gradient(circle,rgba(37,99,235,.12) 0%,transparent 70%);border-radius:50%;pointer-events:none;animation:heroPageOrb 18s ease-in-out infinite alternate}
.hero--page::after{content:'';position:absolute;bottom:-25%;left:-10%;width:400px;height:400px;background:radial-gradient(circle,rgba(219,234,254,.08) 0%,transparent 70%);border-radius:50%;pointer-events:none;animation:heroPageOrb 14s ease-in-out infinite alternate-reverse}
@keyframes heroPageOrb{from{transform:translate(0,0) scale(1)}to{transform:translate(30px,-20px) scale(1.08)}}
.hero--page .container{position:relative;z-index:1}
.hero--page .hero__title{font-size:clamp(1.75rem,4vw,3rem);font-weight:800;line-height:1.12;color:#fff;margin-bottom:var(--spacing-md)}
.hero--page .hero__subtitle{font-size:clamp(1rem,2vw,1.25rem);color:rgba(255,255,255,.85);line-height:1.6;margin-bottom:var(--spacing-lg)}

/* --- Grilles utilitaires --- */
.grid-2{display:grid;grid-template-columns:1fr;gap:var(--spacing-lg)}
.grid-3{display:grid;grid-template-columns:1fr;gap:var(--spacing-lg)}
.grid-4{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--spacing-lg)}
@media (min-width:768px){.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}

/* --- Responsive general --- */
@media (max-width:640px){.hero{padding-block:60px;min-height:auto}.hero__actions{flex-direction:column}.hero--page{padding-block:60px 40px}}