/*
Theme Name: JS Communication — Studio
Theme URI: https://jscommunication-agence.fr/
Author: JS Communication
Description: Thème blocs WordPress personnalisable pour JS Communication. Édition visuelle des textes, images, couleurs et pages. Animations accessibles.
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: js-communication
*/
:root{--js-green:#203D38;--js-olive:#879987;--js-ochre:#C48A42;--js-ivory:#F7F5F0;--js-ink:#252B2A}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0}a{text-underline-offset:4px}::selection{background:#d7b889;color:#203D38}
.js-header{position:sticky;top:0;z-index:100;background:rgba(247,245,240,.97);backdrop-filter:blur(12px);border-bottom:1px solid #e9e5dc}.admin-bar .js-header{top:32px}
.js-shell{max-width:1200px;margin-inline:auto;padding-left:24px;padding-right:24px}.js-header-inner{min-height:84px}.js-brand{letter-spacing:.12em}.js-brand a{text-decoration:none}.js-menu a{text-decoration:none!important;font-size:.83rem;letter-spacing:.07em}.js-menu a:hover{color:var(--js-ochre)}
.js-pill a,.js-primary a{border-radius:50px!important;text-decoration:none!important;transition:transform .25s,background-color .25s,box-shadow .25s}.js-pill a:hover,.js-primary a:hover{transform:translateY(-3px);box-shadow:0 8px 24px #203d3830}
.js-hero{overflow:hidden}.js-eyebrow{font-size:11px!important;font-weight:600;letter-spacing:.24em;text-transform:uppercase}.js-h1{font-size:clamp(3.5rem,7.7vw,7.1rem)!important;line-height:.97!important;letter-spacing:-.055em}.js-h1 em{color:var(--js-ochre);font-weight:400}.js-lead{font-size:1.1rem!important;line-height:1.75}.js-hero-photo img{min-height:560px;width:100%;object-fit:cover;object-position:center 28%;border-radius:180px 12px 12px 12px}.js-photoframe{position:relative}.js-photoframe:after{content:'CRÉER  •  COMMUNIQUER  •  GRANDIR';position:absolute;bottom:24px;right:-8px;background:var(--js-green);color:#fff;padding:18px 22px;letter-spacing:.16em;font-size:.62rem;transform:rotate(-2deg)}
.js-section{padding-top:94px!important;padding-bottom:94px!important}.js-section-title{font-size:clamp(2.4rem,4.5vw,4rem)!important;line-height:1.07!important;letter-spacing:-.035em}.js-service{background:white;border:1px solid #ebe6dc;padding:30px!important;border-radius:5px;transition:transform .3s,box-shadow .3s}.js-service:hover{transform:translateY(-8px);box-shadow:0 18px 45px #203d3816}.js-index{font-size:.8rem!important;color:var(--js-ochre);letter-spacing:.2em}.js-service h3{font-size:1.6rem!important}.js-service p{line-height:1.7}
.js-portfolio{background:var(--js-green);color:white}.js-project{min-height:310px;border:1px solid #ffffff30;overflow:hidden;position:relative}.js-project img{min-height:310px;object-fit:cover}.js-project .wp-block-cover__inner-container{z-index:2}.js-project .wp-block-cover__background{transition:opacity .3s}.js-project:hover .wp-block-cover__background{opacity:.35!important}.js-project .wp-block-cover__inner-container{align-self:end}.js-project-label{letter-spacing:.14em;font-size:.7rem!important;text-transform:uppercase}
.js-about-photo img{width:100%;max-height:560px;object-fit:cover;object-position:center 23%;border-radius:8px 130px 8px 8px}.js-method-number{border:1px solid #d9d3c8;border-radius:100%;width:60px;height:60px;display:flex;justify-content:center;align-items:center;color:var(--js-green);font-family:Georgia,serif;font-size:1.5rem;margin-bottom:22px}.js-contact{background:var(--js-green);color:white}.js-footer{background:#152C28;color:#f7f5f0}.js-footer a{color:#f7f5f0}
.js-word{display:inline-block;opacity:1}.js-ready .js-word{animation:jsWord .7s both;animation-delay:var(--delay,0s)}@keyframes jsWord{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}.js-reveal{opacity:1}.js-motion .js-reveal{opacity:0;transform:translateY(28px);transition:opacity .75s ease,transform .75s ease}.js-motion .js-reveal.js-visible{opacity:1;transform:none}
@media(max-width:782px){.admin-bar .js-header{top:46px}.js-shell{padding-left:20px;padding-right:20px}.js-hero-photo img{min-height:360px;max-height:490px}.js-h1{font-size:clamp(3.2rem,12vw,5rem)!important}.js-section{padding-top:62px!important;padding-bottom:62px!important}.js-photoframe:after{right:0;font-size:.5rem}.js-header-inner{min-height:72px}.js-service{padding:22px!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js-ready .js-word{animation:none!important}.js-motion .js-reveal{opacity:1;transform:none;transition:none}.js-service,.js-primary a,.js-pill a{transition:none}}
