:root { --ink:#14374e; --yellow:#f6d85d; --coral:#eb6e52; --aqua:#d9f0ed; --green:#4e9475; --cream:#fbf7ed; --line:rgba(20,55,78,.25); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--cream); color:var(--ink); font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; margin:0; }
a { color:inherit; text-decoration:none; }
.site-header { align-items:center; background:var(--yellow); border-bottom:1px solid var(--line); display:flex; height:76px; justify-content:space-between; padding:0 max(1.4rem,calc((100vw - 1280px)/2)); position:absolute; top:0; width:100%; z-index:4; }.brand { align-items:center; display:flex; font-size:.84rem; font-weight:900; gap:.7rem; line-height:.88; }.brand span { align-items:center; background:var(--ink); border-radius:50%; color:var(--yellow); display:inline-flex; font-size:.9rem; height:2.35rem; justify-content:center; width:2.35rem; }.site-header nav { display:flex; gap:2rem; }.site-header nav a { font-size:.8rem; font-weight:800; }.site-header nav a:hover { text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:.35rem; }.round-link { align-items:center; background:var(--ink); border-radius:50%; color:white; display:flex; font-size:1.35rem; height:2.8rem; justify-content:center; width:2.8rem; }
.hero { background:var(--yellow); min-height:760px; overflow:hidden; padding:176px max(1.4rem,calc((100vw - 1280px)/2)) 5rem; position:relative; }.hero::after { background:var(--coral); content:""; height:76px; position:absolute; right:0; top:0; width:32%; }.hero-copy { max-width:760px; position:relative; z-index:2; }.eyebrow { color:#a54431; font-size:.76rem; font-weight:900; letter-spacing:.09em; margin:0 0 1rem; text-transform:uppercase; }.hero h1 { font-size:clamp(4rem,7vw,7.5rem); letter-spacing:-.055em; line-height:.8; margin:0; }.hero h1 em,.service h3 em { color:#147777; font-family:Georgia,serif; font-weight:500; }.hero-bottom { align-items:end; display:flex; gap:2.2rem; margin-top:2.2rem; }.hero-bottom p { font-size:1.05rem; line-height:1.45; margin:0; max-width:370px; }.button { align-items:center; border-radius:999px; display:inline-flex; font-size:.92rem; font-weight:900; gap:1rem; padding:.9rem 1.1rem; }.coral { background:var(--coral); box-shadow:5px 5px 0 var(--ink); color:white; }.button span { align-items:center; background:rgba(255,255,255,.18); border-radius:50%; display:flex; font-size:1.15rem; height:1.65rem; justify-content:center; width:1.65rem; }.hero-art { bottom:-6rem; clip-path:polygon(12% 0,100% 0,100% 86%,76% 100%,0 100%,0 16%); height:42rem; position:absolute; right:-1rem; transform:rotate(-4deg); width:min(48vw,720px); z-index:1; }.hero-art::before { border:2px solid var(--ink); content:""; inset:.8rem; position:absolute; transform:translate(-1.4rem,-1.4rem); z-index:1; }.hero-art img { height:100%; object-fit:cover; width:100%; }.hero-index { bottom:2.4rem; font-family:Georgia,serif; font-size:2.7rem; font-style:italic; line-height:.78; position:absolute; right:45%; z-index:2; }.hero-stamp { background:var(--aqua); border:2px solid var(--ink); bottom:2.8rem; font-size:.75rem; font-weight:900; line-height:1.1; padding:.75rem; position:absolute; right:3.2rem; transform:rotate(8deg); z-index:2; }.scroll-cue { align-items:center; bottom:2.7rem; display:flex; font-size:.72rem; font-weight:900; gap:.55rem; left:max(1.4rem,calc((100vw - 1280px)/2)); position:absolute; text-transform:uppercase; z-index:2; }.scroll-cue span { font-size:1.1rem; }
.services { background:var(--cream); padding:9rem max(1.4rem,calc((100vw - 1280px)/2)); }.services-intro { display:grid; grid-template-columns:1fr 1.2fr; margin-bottom:5rem; }.services-intro .eyebrow { grid-column:1; }.services-intro h2 { font-size:clamp(2.8rem,5.3vw,6rem); grid-column:1/3; letter-spacing:-.045em; line-height:.9; margin:1.5rem 0 2.3rem; }.services-intro > p:last-child { color:#4e6d7c; font-size:1.08rem; grid-column:2; line-height:1.55; max-width:470px; }.services-list { border-top:1px solid var(--line); }.service { align-items:center; border-bottom:1px solid var(--line); display:grid; gap:2rem; grid-template-columns:72px 1.15fr .8fr .7fr; min-height:225px; padding:2rem 0; position:relative; transition:padding .25s ease; }.service:hover { padding-left:1rem; }.service-number { font-family:Georgia,serif; font-size:1.3rem; font-style:italic; }.service-title p { color:#5a7480; font-size:.73rem; font-weight:800; margin:0 0 .55rem; text-transform:uppercase; }.service h3 { font-size:clamp(2rem,3.4vw,4rem); letter-spacing:-.045em; line-height:.83; margin:0; }.service-detail { color:#4e6d7c; line-height:1.5; margin:0; max-width:310px; }.service-tag { align-self:end; border:1px solid var(--ink); border-radius:999px; font-size:.7rem; font-weight:850; justify-self:end; padding:.55rem .7rem; text-align:center; text-transform:uppercase; }.service-web:hover { background:#f1e1b7; }.service-google:hover { background:#d9f0ed; }.service-ai:hover { background:#dceff5; }.service-qr:hover { background:#fee6db; }.next-section { align-items:center; background:var(--ink); color:var(--yellow); display:flex; height:190px; justify-content:space-between; padding:0 max(1.4rem,calc((100vw - 1280px)/2)); }.next-section + .next-section { background:var(--coral); color:var(--ink); }.next-section p { font-size:.75rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }.next-section span { font-family:Georgia,serif; font-size:1.4rem; font-style:italic; }
@media (max-width:800px) { .site-header { padding-inline:1rem; }.site-header nav { display:none; }.hero { min-height:690px; padding:142px 1.25rem 5rem; }.hero::after { height:76px; width:44%; }.hero h1 { font-size:clamp(3.6rem,15.2vw,5.8rem); }.hero-bottom { align-items:start; flex-direction:column; gap:1.3rem; margin-top:1.7rem; max-width:260px; }.hero-art { bottom:-3rem; height:26rem; opacity:.83; right:-5rem; width:72%; }.hero-index { bottom:1.8rem; font-size:2.3rem; left:1.25rem; right:auto; }.hero-stamp { bottom:1.7rem; right:1.25rem; }.scroll-cue { display:none; }.services { padding:5.5rem 1.25rem; }.services-intro { display:block; }.services-intro h2 { font-size:clamp(2.7rem,12vw,4.3rem); margin:1.7rem 0; }.services-intro > p:last-child { font-size:1rem; }.service { align-items:start; gap:1rem; grid-template-columns:42px 1fr; min-height:0; padding:2rem 0; }.service-detail { grid-column:2; max-width:430px; }.service-tag { grid-column:2; justify-self:start; }.next-section { height:140px; padding-inline:1.25rem; } }

/* Bloc savoir-faire : affiches, pas curriculum vitae. */
.services-collage { display:grid; gap:0; grid-template-columns:1.12fr .88fr; margin-top:1rem; }
.service-poster { min-height:380px; overflow:hidden; padding:2.35rem; position:relative; }.service-poster h3 { font-size:clamp(2.35rem,4.2vw,5rem); letter-spacing:-.055em; line-height:.83; margin:2.4rem 0 1.3rem; max-width:540px; position:relative; z-index:1; }.service-poster h3 em { font-family:Georgia,serif; font-weight:500; }.poster-label { font-size:.72rem; font-weight:900; letter-spacing:.08em; margin:0; position:relative; text-transform:uppercase; z-index:1; }.poster-copy { font-size:.98rem; line-height:1.45; margin:0; max-width:320px; position:relative; z-index:1; }
.poster-web { background:var(--yellow); color:var(--ink); }.poster-web h3 em { color:#0f7575; }.poster-web::after { border:2px solid var(--ink); content:""; height:15rem; position:absolute; right:-3rem; top:-4.5rem; transform:rotate(23deg); width:15rem; }.poster-mark { bottom:1.6rem; font-family:Georgia,serif; font-size:2.1rem; font-style:italic; line-height:.8; position:absolute; right:2rem; }
.poster-google { background:var(--aqua); color:var(--ink); }.poster-google h3 em { color:#1b7887; }.poster-google::after { border:2px solid var(--ink); border-radius:50%; bottom:-8rem; content:""; height:22rem; position:absolute; right:-6rem; width:22rem; }.map-pin { align-items:center; background:var(--coral); border-radius:50% 50% 50% 0; color:white; display:flex; font-size:1.3rem; height:4.6rem; justify-content:center; position:absolute; right:3rem; top:4.5rem; transform:rotate(-45deg); width:4.6rem; }.map-pin::first-letter { transform:rotate(45deg); }
.poster-ai { background:var(--ink); color:#f9f4e9; }.poster-ai h3 em { color:#a7e0c6; }.poster-ai .poster-label,.poster-ai .poster-copy { color:#d3e5e4; }.poster-ai::after { border:1px solid #a7e0c6; content:""; height:17rem; position:absolute; right:4%; top:5%; transform:rotate(38deg); width:17rem; }.loop { bottom:-2.2rem; color:#a7e0c6; font-family:Georgia,serif; font-size:13rem; line-height:1; position:absolute; right:-.8rem; }
.poster-qr { background:var(--coral); color:var(--ink); }.poster-qr h3 em { color:#fff4db; }.poster-qr::after { background:#f8d85c; content:""; height:11rem; position:absolute; right:-2rem; top:-3rem; transform:rotate(25deg); width:11rem; }.qr-tile { align-items:center; background:#fff5df; bottom:2rem; display:flex; font-size:5rem; height:8rem; justify-content:center; position:absolute; right:2rem; transform:rotate(-6deg); width:8rem; }
@media (max-width:800px) { .services-collage { grid-template-columns:1fr; }.service-poster { min-height:340px; padding:1.7rem 1.4rem; }.service-poster h3 { font-size:clamp(2.5rem,12.5vw,4rem); margin-top:2rem; }.poster-web::after { height:11rem; right:-4rem; top:-4rem; width:11rem; }.poster-mark { bottom:1.5rem; right:1.5rem; }.map-pin { right:1.7rem; top:3.5rem; }.poster-google::after { bottom:-9rem; }.poster-ai::after { height:13rem; right:-4rem; width:13rem; }.qr-tile { bottom:1.5rem; height:6.4rem; right:1.5rem; width:6.4rem; } }

/* Mouvement : les affiches arrivent en vague, puis leurs repères respirent. */
.motion-ready .service-poster { opacity:0; transform:translateY(36px) rotate(-1deg); }
.motion-ready .service-poster.is-visible { animation:poster-arrival 760ms cubic-bezier(.16,1,.3,1) var(--poster-delay) both; }
.motion-ready .service-poster h3,.motion-ready .service-poster .poster-copy,.motion-ready .service-poster .poster-label { transform:translate(var(--shift-x,0),var(--shift-y,0)); transition:transform 280ms ease; }
.motion-ready .poster-web.is-visible::after { animation:frame-wobble 3.6s ease-in-out 900ms 3 both; }
.motion-ready .poster-web.is-visible .poster-mark { animation:mark-float 2.6s ease-in-out 860ms 4 both; }
.motion-ready .poster-google.is-visible .map-pin { animation:pin-hop 1.45s cubic-bezier(.16,1,.3,1) 920ms 4 both; }
.motion-ready .poster-ai.is-visible .loop { animation:loop-turn 4.8s cubic-bezier(.3,.8,.25,1) 840ms 3 both; }
.motion-ready .poster-qr.is-visible .qr-tile { animation:tile-rock 2.4s ease-in-out 850ms 4 both; }
.service-poster:hover .poster-copy { transform:translate(0,-4px); }.service-poster:hover .poster-label { letter-spacing:.12em; }.service-poster:hover .qr-tile { transform:rotate(2deg) scale(1.05); }.service-poster:hover .map-pin { transform:rotate(-45deg) translateY(-7px) scale(1.05); }
@keyframes poster-arrival { 0% { opacity:0; transform:translateY(36px) rotate(-1deg); } 65% { opacity:1; transform:translateY(-3px) rotate(.35deg); } 100% { opacity:1; transform:translateY(0) rotate(0); } }
@keyframes frame-wobble { 0%,100% { transform:rotate(23deg); } 50% { transform:rotate(28deg) translateY(6px); } }
@keyframes mark-float { 0%,100% { transform:translateY(0) rotate(0); } 50% { transform:translateY(-8px) rotate(-4deg); } }
@keyframes pin-hop { 0%,100% { transform:rotate(-45deg) translateY(0); } 45% { transform:rotate(-45deg) translateY(-12px) scale(1.06); } 70% { transform:rotate(-45deg) translateY(2px) scale(.98); } }
@keyframes loop-turn { 0% { transform:rotate(0deg) scale(1); } 55% { transform:rotate(-270deg) scale(1.04); } 100% { transform:rotate(-360deg) scale(1); } }
@keyframes tile-rock { 0%,100% { transform:rotate(-6deg) translateY(0); } 50% { transform:rotate(2deg) translateY(-9px); } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:1ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:1ms !important; } }

.services-extension { background:#d9f0ed; margin-top:0; min-height:350px; overflow:hidden; padding:3rem 3.2rem; position:relative; }.services-extension::before { border:2px solid var(--ink); content:""; height:29rem; position:absolute; right:-11rem; top:-15rem; transform:rotate(28deg); width:29rem; }.services-extension::after { background:var(--coral); content:""; height:8rem; position:absolute; right:20%; top:-3rem; transform:rotate(31deg); width:8rem; }.services-extension h3 { font-size:clamp(2.3rem,4.2vw,5rem); letter-spacing:-.055em; line-height:.85; margin:1.3rem 0 1.4rem; max-width:850px; position:relative; z-index:1; }.services-extension h3 em { color:#147777; font-family:Georgia,serif; font-weight:500; }.services-extension > p:not(.eyebrow) { color:#355d6c; font-size:1.02rem; line-height:1.48; margin:0; max-width:480px; position:relative; z-index:1; }.services-extension > div { bottom:2rem; display:flex; gap:.55rem; position:absolute; right:2.6rem; z-index:2; }.services-extension span { border:1px solid var(--ink); border-radius:999px; font-size:.68rem; font-weight:900; padding:.55rem .65rem; }.motion-ready .services-extension { opacity:0; transform:translateY(28px); }.motion-ready .services-extension.is-visible { animation:poster-arrival 760ms cubic-bezier(.16,1,.3,1) both; }
@media (max-width:800px) { .services-extension { min-height:390px; padding:2rem 1.4rem; }.services-extension h3 { font-size:clamp(2.5rem,12.3vw,4.1rem); margin-top:1.5rem; }.services-extension::before { right:-15rem; top:-12rem; }.services-extension::after { right:8%; }.services-extension > div { bottom:1.5rem; flex-wrap:wrap; left:1.4rem; right:auto; } }

.projects { background:var(--ink); color:#f8f4e8; padding:8.5rem max(1.4rem,calc((100vw - 1280px)/2)); }.projects-heading { margin-bottom:4.5rem; max-width:930px; }.projects .eyebrow { color:var(--yellow); }.projects-heading h2 { font-size:clamp(3rem,5.8vw,6.8rem); letter-spacing:-.055em; line-height:.86; margin:0 0 1.6rem; }.projects-heading h2 em { color:#a7e0c6; font-family:Georgia,serif; font-weight:500; }.projects-heading > p:last-child { color:#c6dcdc; font-size:1.05rem; line-height:1.5; max-width:480px; }.projects-grid { display:grid; gap:1rem; grid-template-columns:1.15fr .85fr; }.project { color:inherit; min-height:390px; overflow:hidden; padding:2.1rem; position:relative; transition:transform 300ms cubic-bezier(.16,1,.3,1); }.project:hover { transform:translateY(-8px); }.project-type { font-size:.7rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }.project h3 { font-size:clamp(3.5rem,6.2vw,7.5rem); letter-spacing:-.075em; line-height:.72; margin:2rem 0 1.6rem; position:relative; z-index:1; }.project h3 em { font-family:Georgia,serif; font-weight:500; }.project > p { font-size:.96rem; line-height:1.5; margin:0; max-width:330px; position:relative; z-index:1; }.project-foot { align-items:center; bottom:1.8rem; display:flex; font-size:.76rem; font-weight:900; gap:.7rem; justify-content:space-between; left:2.1rem; position:absolute; right:2.1rem; text-transform:uppercase; z-index:2; }.project-foot b { align-items:center; border:1px solid currentColor; border-radius:50%; display:inline-flex; font-size:1rem; height:2rem; justify-content:center; width:2rem; }
.project-dayclic { background:#dff0e5; color:#163a4e; grid-row:span 2; min-height:795px; }.project-dayclic h3 span { color:#e96a51; }.project-dayclic::before { border:2px solid #163a4e; border-radius:50%; content:""; height:28rem; position:absolute; right:-11rem; top:-9rem; width:28rem; }.project-dayclic::after { background:#1e8885; border-radius:50%; content:""; height:8rem; position:absolute; right:17%; top:18%; width:8rem; }.dayclic-search { align-items:center; background:#fffdf6; bottom:7rem; display:flex; justify-content:space-between; left:2.1rem; padding:1rem 1.1rem; position:absolute; right:2.1rem; z-index:1; }.dayclic-search span { color:#527781; font-size:.85rem; }.dayclic-search b { align-items:center; background:#e96a51; border-radius:50%; color:white; display:flex; font-size:1.3rem; height:2.4rem; justify-content:center; width:2.4rem; }
.project-sweet { background:#e96a51; color:#153b50; }.project-sweet h3 em { color:#fff2c9; }.project-sweet::after { border:2px solid #153b50; content:""; height:11rem; position:absolute; right:-4rem; top:-4rem; transform:rotate(35deg); width:11rem; }.sound-bars { align-items:end; bottom:5.8rem; display:flex; gap:.45rem; height:7.5rem; position:absolute; right:2.1rem; z-index:1; }.sound-bars i { background:#fff2c9; display:block; width:1rem; }.sound-bars i:nth-child(1) { height:22%; }.sound-bars i:nth-child(2) { height:64%; }.sound-bars i:nth-child(3) { height:44%; }.sound-bars i:nth-child(4) { height:91%; }.sound-bars i:nth-child(5) { height:57%; }.sound-bars i:nth-child(6) { height:35%; }.sound-bars i:nth-child(7) { height:72%; }
.project-visa { background:#f6d85d; color:#153b50; }.project-visa h3 em { color:#1c7d75; }.project-visa::after { background:#d4ece7; clip-path:polygon(30% 0,100% 0,100% 100%,0 100%,0 28%); content:""; height:15rem; position:absolute; right:0; top:0; width:43%; }.visa-path { bottom:5.8rem; display:flex; gap:.65rem; left:2.1rem; position:absolute; z-index:1; }.visa-path span { background:#1c7d75; border-radius:50%; display:block; height:2.1rem; position:relative; width:2.1rem; }.visa-path span::after { background:#1c7d75; content:""; height:2px; left:100%; position:absolute; top:50%; width:.65rem; }.visa-path span:last-child::after { display:none; }
.motion-ready .project { opacity:0; transform:translateY(38px) rotate(-1deg); }.motion-ready .project.is-visible { animation:poster-arrival 800ms cubic-bezier(.16,1,.3,1) var(--poster-delay) both; }.motion-ready .project-dayclic.is-visible .dayclic-search { animation:search-slide 850ms cubic-bezier(.16,1,.3,1) 500ms both; }.motion-ready .project-sweet.is-visible .sound-bars i { animation:sound-pulse 900ms ease-in-out 550ms 4 both; }.motion-ready .project-sweet.is-visible .sound-bars i:nth-child(2) { animation-delay:640ms; }.motion-ready .project-sweet.is-visible .sound-bars i:nth-child(3) { animation-delay:730ms; }.motion-ready .project-sweet.is-visible .sound-bars i:nth-child(4) { animation-delay:820ms; }.motion-ready .project-visa.is-visible .visa-path { animation:path-walk 1.8s ease-in-out 600ms 3 both; }
@keyframes search-slide { from { opacity:0; transform:translateX(-40px); } to { opacity:1; transform:translateX(0); } }@keyframes sound-pulse { 0%,100% { transform:scaleY(1); transform-origin:bottom; } 50% { transform:scaleY(.45); transform-origin:bottom; } }@keyframes path-walk { 0%,100% { transform:translateX(0); } 50% { transform:translateX(12px); } }
@media (max-width:800px) { .projects { padding:5.5rem 1.25rem; }.projects-heading { margin-bottom:3rem; }.projects-heading h2 { font-size:clamp(2.8rem,12.5vw,4.5rem); }.projects-grid { grid-template-columns:1fr; }.project,.project-dayclic { min-height:420px; }.project-dayclic { grid-row:auto; }.project h3 { font-size:clamp(3.5rem,17vw,5.3rem); }.project-foot { left:1.5rem; right:1.5rem; }.dayclic-search { left:1.5rem; right:1.5rem; }.sound-bars { right:1.5rem; }.visa-path { left:1.5rem; } }

/* Galerie extensible : six projets forment deux rangées de trois sur grand écran. */
.projects-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.project { min-height:470px; }.project h3 { font-size:clamp(3.2rem,4.5vw,5.4rem); }.project-dayclic { grid-row:auto; min-height:470px; }.project-dayclic::before { height:22rem; right:-12rem; top:-8rem; width:22rem; }.project-dayclic::after { height:6rem; width:6rem; }.dayclic-search { bottom:6.5rem; }
@media (max-width:980px) { .projects-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:800px) { .projects-grid { grid-template-columns:1fr; }.project,.project-dayclic { min-height:420px; }.project h3 { font-size:clamp(3.5rem,17vw,5.3rem); } }

.contact-section { background:var(--coral); color:var(--ink); display:grid; gap:5rem; grid-template-columns:.9fr 1.1fr; overflow:hidden; padding:8.5rem max(1.4rem,calc((100vw - 1280px)/2)); position:relative; }.contact-section::before { border:2px solid var(--ink); border-radius:50%; content:""; height:48rem; left:-27rem; position:absolute; top:-25rem; width:48rem; }.contact-section::after { background:var(--yellow); content:""; height:13rem; position:absolute; right:-4rem; top:-4rem; transform:rotate(25deg); width:13rem; }.contact-intro { position:relative; z-index:1; }.contact-intro .eyebrow { color:#803a32; }.contact-intro h2 { font-size:clamp(3rem,5vw,6.3rem); letter-spacing:-.065em; line-height:.84; margin:0 0 1.7rem; }.contact-intro h2 em { color:#fff4da; font-family:Georgia,serif; font-weight:500; }.contact-intro > p:not(.eyebrow) { font-size:1.05rem; line-height:1.5; max-width:410px; }.contact-stamp { border:2px solid var(--ink); bottom:-5.7rem; font-size:.75rem; font-weight:900; line-height:1.08; padding:.7rem; position:absolute; right:1.3rem; transform:rotate(-9deg); }
.contact-form { display:grid; gap:1.2rem; position:relative; z-index:1; }.contact-form > label,.contact-form fieldset { border:0; display:grid; font-size:.76rem; font-weight:900; gap:.45rem; margin:0; padding:0; text-transform:uppercase; }.contact-form input,.contact-form textarea { background:transparent; border:0; border-bottom:1px solid rgba(20,55,78,.65); border-radius:0; color:var(--ink); font-size:1rem; outline:0; padding:.75rem 0; resize:vertical; width:100%; }.contact-form input::placeholder,.contact-form textarea::placeholder { color:rgba(20,55,78,.58); }.contact-form input:focus,.contact-form textarea:focus { border-color:#fff4da; }.contact-form legend { font-size:.76rem; font-weight:900; margin-bottom:.65rem; padding:0; text-transform:uppercase; }.contact-options { display:flex; flex-wrap:wrap; gap:.55rem; }.contact-options label { cursor:pointer; }.contact-options input { position:absolute; opacity:0; }.contact-options span { border:1px solid rgba(20,55,78,.65); border-radius:999px; display:block; font-size:.74rem; font-weight:850; padding:.57rem .72rem; text-transform:none; transition:background 180ms ease,color 180ms ease,transform 180ms ease; }.contact-options input:checked + span { background:var(--ink); color:#fff4da; }.contact-options label:hover span { transform:translateY(-2px); }.message-label { margin-top:.5rem; }.contact-submit { align-items:center; background:var(--ink); border:0; border-radius:999px; color:#fff4da; cursor:pointer; display:flex; font-size:.92rem; font-weight:900; gap:.9rem; justify-content:center; margin-top:.4rem; min-height:3.4rem; padding:.7rem 1rem; width:max-content; }.contact-submit b { align-items:center; background:rgba(255,255,255,.16); border-radius:50%; display:flex; font-size:1.15rem; height:1.7rem; justify-content:center; width:1.7rem; }.contact-submit:hover { box-shadow:5px 5px 0 #fff4da; transform:translate(-2px,-2px); }.contact-note { font-size:.82rem; margin:0; }.site-footer { background:var(--ink); color:#d7e9e4; display:flex; font-size:.8rem; font-weight:800; justify-content:space-between; padding:1.35rem max(1.4rem,calc((100vw - 1280px)/2)); }.motion-ready .contact-intro,.motion-ready .contact-form { opacity:0; transform:translateY(35px); }.motion-ready .contact-intro.is-visible,.motion-ready .contact-form.is-visible { animation:poster-arrival 800ms cubic-bezier(.16,1,.3,1) var(--poster-delay,0ms) both; }
@media (max-width:800px) { .contact-section { gap:3.2rem; grid-template-columns:1fr; padding:5.5rem 1.25rem; }.contact-intro h2 { font-size:clamp(3rem,13.5vw,4.8rem); }.contact-stamp { bottom:-1rem; right:0; }.contact-section::before { height:28rem; left:-18rem; top:-16rem; width:28rem; }.contact-section::after { height:8rem; width:8rem; }.contact-submit { width:100%; }.site-footer { align-items:start; flex-direction:column; gap:.35rem; padding:1.25rem; } }

.contact-details { display:flex; font-size:.9rem; font-style:normal; font-weight:800; gap:1.4rem; line-height:1.45; margin-top:2.2rem; }.contact-details a { border-bottom:1px solid var(--ink); height:max-content; padding-bottom:.1rem; }
.contact-card { background:#fff4da; border:1px solid var(--ink); margin-top:2.4rem; max-width:510px; position:relative; }.contact-map { border-bottom:1px solid var(--ink); height:190px; overflow:hidden; width:100%; }.contact-map iframe { border:0; display:block; filter:saturate(.75) contrast(.98); height:100%; width:100%; }.map-details { display:grid; font-size:.86rem; font-style:normal; font-weight:800; gap:1.1rem 1.5rem; grid-template-columns:1fr 1fr; line-height:1.38; padding:1rem; }.map-details div:first-child { grid-row:span 2; }.map-details small { color:#803a32; display:block; font-size:.65rem; font-style:normal; font-weight:900; margin-bottom:.25rem; text-transform:uppercase; }.map-details span,.map-details a { display:block; }.map-details a { border-bottom:1px solid var(--ink); padding-bottom:.08rem; width:max-content; }
@media (max-width:800px) { .contact-details { flex-direction:column; gap:.6rem; } .contact-card { max-width:none; }.contact-map { height:210px; }.map-details { grid-template-columns:1fr; gap:.85rem; }.map-details div:first-child { grid-row:auto; } }
.hero-art::before { display:none; }
.hero-bottom { align-items:flex-start; flex-direction:column; gap:1rem; max-width:430px; }.hero-bottom p { color:#147777; font-family:Georgia,serif; font-size:1.28rem; font-style:italic; line-height:1.27; max-width:430px; }

@media (max-width:800px) { .services-extension { padding-bottom:6rem; } }
@media (max-width:800px) { .project,.project-dayclic { min-height:470px; } }

/* Projet AZZUR : fond crème, vinyle bleu pétrol à étiquette corail. */
.project-azzur { background:var(--cream); color:var(--ink); }.project-azzur h3 em { color:#1b7887; }
.project-azzur::after { background:var(--aqua); clip-path:polygon(0 0,100% 0,100% 72%,38% 100%); content:""; height:14rem; position:absolute; right:0; top:0; width:48%; }
.vinyl { background:repeating-radial-gradient(circle,#14374e 0 3px,#1d4a66 3px 5px); border-radius:50%; bottom:4.6rem; height:7rem; position:absolute; right:2.1rem; width:7rem; z-index:1; }
.vinyl span { background:var(--coral); border:3px solid #14374e; border-radius:50%; height:2.4rem; left:50%; position:absolute; top:50%; transform:translate(-50%,-50%); width:2.4rem; }
.vinyl span::after { background:var(--cream); border-radius:50%; content:""; height:.5rem; left:50%; position:absolute; top:50%; transform:translate(-50%,-50%); width:.5rem; }
.motion-ready .project-azzur.is-visible .vinyl { animation:vinyl-spin 2.4s cubic-bezier(.3,.8,.25,1) 600ms 2 both; }
@keyframes vinyl-spin { from { transform:rotate(0); } to { transform:rotate(360deg); } }
@media (max-width:800px) { .vinyl { bottom:4.6rem; height:6.5rem; right:1.5rem; width:6.5rem; } }

/* Séparations en vague : chaque section se termine par la forme de la suivante. */
:root { --wave-h:clamp(56px,8vw,130px); }
.services,.projects { position:relative; }
.wave { bottom:-1px; display:block; height:var(--wave-h); left:0; pointer-events:none; position:absolute; width:100%; z-index:3; }
.wave path { fill:currentColor; }
.wave-flip { transform:scaleX(-1); }
.wave-cream { color:var(--cream); }.wave-ink { color:var(--ink); }.wave-coral { color:var(--coral); }
.services,.projects,.contact-section { padding-bottom:calc(8.5rem + var(--wave-h) * .5); }
.hero-stamp,.scroll-cue { bottom:calc(var(--wave-h) + .8rem); }
@media (max-width:800px) { .services,.projects,.contact-section { padding-bottom:calc(5.5rem + var(--wave-h) * .5); }.hero-stamp { bottom:calc(var(--wave-h) + .6rem); } }

/* ========== Site multipage : ajouts à la base prototype-studio.css ========== */

.skip-link { background:var(--ink); color:#fff4da; font-weight:900; left:1rem; padding:.7rem 1rem; position:absolute; top:-4rem; z-index:20; }
.skip-link:focus { top:1rem; }
:focus-visible { outline:3px solid var(--coral); outline-offset:3px; }

/* Navigation : menu Services déroulant, bouton Menu sur mobile. */
.site-header nav { align-items:center; }
.nav-group { position:relative; }
.nav-parent::after { content:" ▾"; font-size:.72em; }
.nav-menu { background:var(--cream); border:1px solid var(--ink); box-shadow:5px 5px 0 var(--ink); display:none; left:-1rem; min-width:15rem; padding:.45rem; position:absolute; top:calc(100% + .7rem); z-index:6; }
.nav-menu::before { content:""; height:.9rem; left:0; position:absolute; right:0; top:-.9rem; }
.nav-group:hover .nav-menu,.nav-group:focus-within .nav-menu { display:grid; }
.nav-menu a { font-size:.84rem; padding:.62rem .7rem; }
.site-header .nav-menu a:hover { background:var(--yellow); text-decoration:none; }
.site-header nav a[aria-current="page"] { text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:.35rem; }
.nav-toggle { display:none; }
@media (max-width:800px) {
  .nav-toggle { background:var(--ink); border:0; border-radius:999px; color:var(--yellow); cursor:pointer; display:block; font:inherit; font-size:.8rem; font-weight:900; min-height:2.6rem; padding:.55rem 1rem; }
  .site-header nav { align-items:stretch; background:var(--yellow); border-bottom:2px solid var(--ink); flex-direction:column; gap:0; left:0; max-height:calc(100vh - 76px); overflow-y:auto; padding:.3rem 1.25rem 1.3rem; position:absolute; right:0; top:76px; }
  .site-header.is-open nav { display:flex; }
  .site-header nav > a,.nav-parent { border-bottom:1px solid var(--line); display:block; font-size:1.05rem !important; padding:.95rem 0; }
  .nav-parent::after { content:""; }
  .nav-menu { background:transparent; border:0; box-shadow:none; display:grid; padding:.2rem 0 .6rem .9rem; position:static; }
  .nav-menu::before { display:none; }
  .nav-menu a { font-size:.95rem; padding:.5rem 0; }
}

/* Boutons */
.btn { align-items:center; border:2px solid var(--ink); border-radius:999px; display:inline-flex; font-size:.92rem; font-weight:900; gap:.6rem; justify-content:center; min-height:3rem; padding:.7rem 1.25rem; transition:transform 180ms ease,box-shadow 180ms ease,background 180ms ease,color 180ms ease; }
.btn-primary { background:var(--ink); color:#fff4da; }
.btn-primary:hover { box-shadow:4px 4px 0 var(--coral); transform:translate(-2px,-2px); }
.btn-ghost { background:transparent; color:var(--ink); }
.btn-ghost:hover { background:var(--ink); color:#fff4da; }
.btn-yellow { background:var(--yellow); border-color:var(--yellow); color:var(--ink); }
.btn-yellow:hover { box-shadow:4px 4px 0 var(--coral); transform:translate(-2px,-2px); }
.hero-actions { display:flex; flex-wrap:wrap; gap:.7rem; position:relative; z-index:2; }
.hero .hero-actions { margin-top:.4rem; }

/* Accueil : image allégée, lien vers chaque service, affiche vidéo. */
.hero-art picture { display:block; height:100%; }
.poster-link { align-items:center; border:1px solid currentColor; border-radius:999px; display:inline-flex; font-size:.74rem; font-weight:900; gap:.45rem; letter-spacing:.04em; margin-top:1.3rem; padding:.5rem .8rem; position:relative; text-transform:uppercase; transition:background 180ms ease,color 180ms ease; z-index:1; }
.poster-link:hover { background:var(--ink); border-color:var(--ink); color:#fff4da; }
.poster-ai .poster-link { color:#f9f4e9; }
.poster-ai .poster-link:hover { background:#f9f4e9; border-color:#f9f4e9; color:var(--ink); }
.services-extension .poster-link { color:var(--ink); }
.poster-video { background:var(--coral); color:var(--ink); }
.poster-video h3 em { color:#fff4da; }
.poster-video::after { background:#f8d85c; content:""; height:11rem; position:absolute; right:-2rem; top:-3rem; transform:rotate(25deg); width:11rem; }
.play-tile { align-items:center; background:#fff5df; border:2px solid var(--ink); border-radius:.9rem; bottom:2rem; color:var(--coral); display:flex; font-size:2.2rem; height:9.6rem; justify-content:center; position:absolute; right:2.4rem; transform:rotate(-6deg); width:5.6rem; z-index:1; }
.play-tile::before,.play-tile::after { background:var(--ink); border-radius:999px; content:""; height:.3rem; left:50%; position:absolute; transform:translateX(-50%); width:1.4rem; }
.play-tile::before { top:.5rem; }
.play-tile::after { bottom:.5rem; width:2.2rem; }
.motion-ready .poster-video.is-visible .play-tile { animation:tile-rock 2.4s ease-in-out 850ms 4 both; }
.service-poster:hover .play-tile { transform:rotate(2deg) scale(1.05); }
/* Le grand cercle du contact passe derrière la carte, plus sur le titre. */
.contact-section::before { bottom:-30rem; left:-30rem; top:auto; }

/* Mobile : les éléments décoratifs ne passent jamais sur le texte. */
@media (max-width:800px) {
  .poster-video { padding-bottom:9.5rem; }
  .play-tile { bottom:1.5rem; height:7rem; right:1.5rem; width:4rem; }
  .poster-ai { padding-bottom:8rem; }
  .loop { font-size:9rem; }
  .poster-google::after { display:none; }
  .poster-web::after { height:8rem; right:-5rem; top:-5rem; width:8rem; }
  .poster-ai::after { height:9rem; right:-6rem; top:-6rem; width:9rem; }
  .project-dayclic::before { height:14rem; right:-10rem; top:-9rem; width:14rem; }
  .project-dayclic::after { height:3.5rem; right:1.5rem; top:1.4rem; width:3.5rem; }
  .project-sweet { min-height:500px; }
  .sound-bars { bottom:4.8rem; height:4.5rem; }
  .map-pin { height:3.6rem; right:1.4rem; top:1.2rem; width:3.6rem; }
  .services-extension::before,.contact-section::before { display:none; }
  .services-extension::after { height:5rem; right:-2rem; top:-2.5rem; width:5rem; }
}

/* Formulaire */
.form-row { display:grid; gap:1.2rem; grid-template-columns:1fr 1fr; }
.form-row > label { display:grid; font-size:.76rem; font-weight:900; gap:.45rem; text-transform:uppercase; }
.hp { height:1px; left:-10000px; overflow:hidden; position:absolute; width:1px; }
.contact-submit[disabled] { cursor:wait; opacity:.7; }
.contact-note a { text-decoration:underline; text-underline-offset:.2em; }
.contact-note.is-success,.contact-note.is-error { background:var(--ink); color:#fff4da; font-weight:800; padding:.7rem .9rem; }
.contact-note.is-error { background:#fff4da; color:#7a2416; }
@media (max-width:800px) { .form-row { grid-template-columns:1fr; } }

/* Zone d'intervention (pas d'accueil du public) */
.contact-zone { background:var(--aqua); border-bottom:1px solid var(--ink); overflow:hidden; padding:1.3rem 1.2rem 1.4rem; position:relative; }
.contact-zone::after { border:2px solid var(--ink); border-radius:50%; content:""; height:11rem; position:absolute; right:-6.5rem; top:-5.5rem; width:11rem; }
.contact-zone small { color:#803a32; display:block; font-size:.65rem; font-weight:900; margin-bottom:.55rem; text-transform:uppercase; }
.contact-zone strong { display:block; font-size:clamp(1.9rem,3vw,2.5rem); letter-spacing:-.05em; line-height:.9; position:relative; z-index:1; }
.contact-zone strong em { color:#147777; font-family:Georgia,serif; font-weight:500; }
.contact-zone p { color:#355d6c; font-size:.84rem; line-height:1.45; margin:.85rem 0 0; max-width:330px; position:relative; z-index:1; }
.zone-pin { align-items:center; background:var(--coral); border-radius:50% 50% 50% 0; color:#fff; display:flex; font-size:.9rem; height:3.2rem; justify-content:center; position:absolute; right:1.4rem; top:1.3rem; transform:rotate(-45deg); width:3.2rem; }
.contact-card .map-details div:first-child { grid-row:auto; }

/* Carte chargée à la demande */
.contact-map { position:relative; }
.map-load { align-items:center; background:repeating-linear-gradient(45deg,#d9f0ed 0 14px,#cde8e3 14px 28px); border:0; color:var(--ink); cursor:pointer; display:flex; flex-direction:column; font:inherit; gap:.5rem; height:100%; justify-content:center; width:100%; }
.map-load span { background:var(--ink); border-radius:999px; color:#fff4da; font-weight:900; padding:.6rem 1rem; }
.map-load small { font-size:.72rem; font-weight:700; }
.map-load:hover span { background:var(--coral); color:var(--ink); }

/* Pied de page */
.site-footer { align-items:start; display:grid; font-size:.9rem; font-weight:600; gap:2.5rem; grid-template-columns:1.3fr 1fr 1fr; justify-content:initial; padding:4.5rem max(1.4rem,calc((100vw - 1280px)/2)) 1.6rem; }
.site-footer b { color:var(--yellow); font-size:1.6rem; letter-spacing:-.04em; }
.site-footer p { line-height:1.5; margin:.7rem 0 1.4rem; max-width:340px; }
.site-footer small { color:var(--yellow); display:block; font-size:.7rem; font-weight:900; letter-spacing:.08em; margin-bottom:.9rem; text-transform:uppercase; }
.site-footer ul { display:grid; gap:.65rem; list-style:none; line-height:1.4; margin:0; padding:0; }
.site-footer ul a:hover,.footer-bottom a:hover { text-decoration:underline; text-underline-offset:.25em; }
.footer-bottom { border-top:1px solid rgba(215,233,228,.25); display:flex; flex-wrap:wrap; font-size:.8rem; gap:1rem; grid-column:1/-1; justify-content:space-between; padding-top:1.4rem; }
@media (max-width:800px) { .site-footer { gap:2rem; grid-template-columns:1fr; padding:3.5rem 1.25rem 1.4rem; } }

.wave-aqua { color:var(--aqua); }

/* Pages intérieures */
.page-hero { background:var(--yellow); color:var(--ink); overflow:hidden; padding:150px max(1.4rem,calc((100vw - 1280px)/2)) calc(5.5rem + var(--wave-h)); position:relative; }
.page-hero h1 { font-size:clamp(2.7rem,6vw,6.2rem); letter-spacing:-.055em; line-height:.86; margin:1.2rem 0 1.6rem; max-width:1000px; position:relative; z-index:1; }
.page-hero h1 em { color:#147777; font-family:Georgia,serif; font-weight:500; }
.page-hero .lead { color:#147777; font-family:Georgia,serif; font-size:clamp(1.15rem,1.8vw,1.4rem); font-style:italic; line-height:1.32; margin:0 0 1.8rem; max-width:600px; position:relative; z-index:1; }
.page-hero .eyebrow { position:relative; z-index:1; }
.page-hero .eyebrow a { text-decoration:underline; text-underline-offset:.2em; }
.page-hero-mark { border:2px solid currentColor; height:24rem; opacity:.9; position:absolute; right:-6rem; top:5.5rem; transform:rotate(23deg); width:24rem; }
.page-hero-mark::after { background:var(--coral); content:""; height:6rem; left:-3rem; position:absolute; top:40%; width:6rem; }
.page-hero--aqua { background:var(--aqua); }
.page-hero--coral { background:var(--coral); }
.page-hero--coral h1 em { color:#fff4da; }
.page-hero--coral .lead,.page-hero--coral .eyebrow { color:var(--ink); }
.page-hero--coral .page-hero-mark::after { background:var(--yellow); }
.page-hero--ink { background:var(--ink); color:#f9f4e9; }
.page-hero--ink h1 em,.page-hero--ink .lead { color:#a7e0c6; }
.page-hero--ink .eyebrow { color:var(--yellow); }
.page-hero--ink .btn-primary { background:var(--yellow); border-color:var(--yellow); color:var(--ink); }
.page-hero--ink .btn-ghost { border-color:#f9f4e9; color:#f9f4e9; }
.page-hero--ink .btn-ghost:hover { background:#f9f4e9; color:var(--ink); }
.page-hero--article h1 { font-size:clamp(2.4rem,5vw,4.8rem); max-width:900px; }
@media (max-width:800px) { .page-hero { padding:120px 1.25rem calc(3.5rem + var(--wave-h)); }.page-hero-mark { height:12rem; right:-6rem; top:4.5rem; width:12rem; }.page-hero-mark::after { height:3.5rem; left:-1.5rem; width:3.5rem; } }

.page-section { background:var(--cream); padding:6rem max(1.4rem,calc((100vw - 1280px)/2)) calc(6rem + var(--wave-h) * .5); position:relative; }
.page-section--aqua { background:var(--aqua); }
.section-head { margin-bottom:3rem; max-width:900px; }
.section-head h2,.split h2,.prices h2 { font-size:clamp(2.3rem,4.6vw,4.8rem); letter-spacing:-.05em; line-height:.9; margin:0; }
.section-head h2 em,.split h2 em,.prices h2 em,.cta-band h2 em { font-family:Georgia,serif; font-weight:500; }
.section-head h2 em,.split h2 em,.prices h2 em { color:#147777; }
.section-head > p:not(.eyebrow),.split-head > p:not(.eyebrow) { color:#4e6d7c; font-size:1.05rem; line-height:1.55; margin:1.4rem 0 0; max-width:520px; }
.split { display:grid; gap:4rem; grid-template-columns:.85fr 1.15fr; }
.split + .split { border-top:1px solid var(--line); margin-top:5rem; padding-top:5rem; }
.check-list { border-top:1px solid var(--line); list-style:none; margin:0; padding:0; }
.check-list li { border-bottom:1px solid var(--line); column-gap:.4rem; display:grid; grid-template-columns:2rem 1fr; padding:1.15rem 0; }
.check-list li::before { color:var(--coral); content:"→"; font-weight:900; grid-row:span 2; }
.check-list strong { font-size:1.12rem; letter-spacing:-.01em; }
.check-list span { color:#4e6d7c; line-height:1.5; margin-top:.25rem; }
.idea { border-left:6px solid var(--coral); margin:5rem 0 0; max-width:880px; padding:.3rem 0 .3rem 1.6rem; }
.idea p { font-family:Georgia,serif; font-size:clamp(1.35rem,2.4vw,2rem); font-style:italic; line-height:1.3; margin:0; }
.idea small { color:#a54431; display:block; font-size:.72rem; font-weight:900; letter-spacing:.08em; margin-bottom:.8rem; text-transform:uppercase; }
@media (max-width:800px) { .page-section { padding:4rem 1.25rem calc(4rem + var(--wave-h) * .5); }.split { gap:2rem; grid-template-columns:1fr; }.split + .split { margin-top:3rem; padding-top:3rem; }.idea { margin-top:3rem; } }

.steps { display:grid; gap:1rem; grid-template-columns:repeat(4,minmax(0,1fr)); list-style:none; margin:0; padding:0; }
.steps li { background:var(--cream); border:1px solid var(--ink); padding:1.6rem; }
.steps b { color:#147777; font-family:Georgia,serif; font-size:2.2rem; font-style:italic; font-weight:500; }
.steps h3 { font-size:1.35rem; letter-spacing:-.03em; margin:.7rem 0 .5rem; }
.steps p { color:#4e6d7c; line-height:1.5; margin:0; }
@media (max-width:980px) { .steps { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .steps { grid-template-columns:1fr; } }

.cta-band { align-items:end; background:var(--coral); display:flex; flex-wrap:wrap; gap:2rem; justify-content:space-between; padding:6rem max(1.4rem,calc((100vw - 1280px)/2)) calc(6rem + var(--wave-h) * .5); position:relative; }
.cta-band .eyebrow { color:var(--ink); }
.cta-band h2 { font-size:clamp(2.8rem,5.5vw,6rem); letter-spacing:-.06em; line-height:.86; margin:0; }
.cta-band h2 em { color:#fff4da; }
.cta-actions { display:flex; flex-wrap:wrap; gap:.7rem; position:relative; z-index:4; }
@media (max-width:800px) { .cta-band { padding:4rem 1.25rem calc(4rem + var(--wave-h) * .5); } }

/* À propos : texte à gauche, portrait façon collage à droite */
.about-hero { align-items:center; display:grid; gap:3rem; grid-template-columns:1.25fr .75fr; position:relative; z-index:1; }
.about-photo { aspect-ratio:4/5; background:var(--aqua); border:2px solid var(--ink); box-shadow:12px 12px 0 var(--coral); justify-self:end; margin:0; max-width:400px; overflow:hidden; transform:rotate(3deg); width:100%; }
.about-photo img { display:block; height:100%; object-fit:cover; width:100%; }
.about-photo--empty { display:grid; place-items:center; }
.about-photo--empty span { color:#147777; font-family:Georgia,serif; font-size:7rem; font-style:italic; }
@media (max-width:800px) { .about-hero { gap:2.5rem; grid-template-columns:1fr; }.about-photo { justify-self:start; max-width:250px; transform:rotate(-2deg); } }

/* Équipe : une affiche par métier */
.team-grid { display:grid; gap:1rem; grid-template-columns:repeat(3,minmax(0,1fr)); list-style:none; margin:0; padding:0; }
.team-card { border:1px solid var(--ink); color:var(--ink); min-height:240px; overflow:hidden; padding:1.7rem; position:relative; }
.team-card::after { border:2px solid currentColor; border-radius:50%; content:""; height:9rem; opacity:.3; position:absolute; right:-3rem; top:-3rem; width:9rem; }
.team-card b { color:#147777; display:block; font-family:Georgia,serif; font-size:2.2rem; font-style:italic; font-weight:500; line-height:1; position:relative; z-index:1; }
.team-card h3 { font-size:clamp(1.5rem,2.2vw,1.9rem); letter-spacing:-.045em; line-height:.95; margin:1.3rem 0 .6rem; position:relative; z-index:1; }
.team-card p { color:#244a5e; line-height:1.5; margin:0; position:relative; z-index:1; }
.team-card--yellow { background:var(--yellow); }
.team-card--coral { background:var(--coral); }
.team-card--coral b { color:#fff4da; }
.team-card--coral p { color:var(--ink); }
.team-card--cream { background:#fffdf6; }
.team-card--ink { background:var(--ink); color:#f9f4e9; }
.team-card--ink b { color:#a7e0c6; }
.team-card--ink p { color:#d3e5e4; }
@media (max-width:980px) { .team-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .team-grid { grid-template-columns:1fr; }.team-card { min-height:0; } }

/* News */
.news-grid { display:grid; gap:1rem; grid-template-columns:repeat(3,minmax(0,1fr)); }
.news-card { background:#fffdf6; border:1px solid var(--ink); display:flex; flex-direction:column; gap:.9rem; min-height:280px; padding:1.8rem; transition:transform 250ms cubic-bezier(.16,1,.3,1),box-shadow 250ms ease; }
.news-card:hover { box-shadow:6px 6px 0 var(--ink); transform:translate(-3px,-3px); }
.news-card h2 { font-size:clamp(1.6rem,2.3vw,2.2rem); letter-spacing:-.045em; line-height:.95; margin:0; }
.news-card p { color:#4e6d7c; line-height:1.5; margin:0; }
.news-meta { color:#a54431; font-size:.72rem; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
.news-card .more { font-size:.76rem; font-weight:900; margin-top:auto; text-transform:uppercase; }
.news-empty { color:#4e6d7c; font-size:1.1rem; }
@media (max-width:980px) { .news-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:600px) { .news-grid { grid-template-columns:1fr; } }

/* Texte long : articles et mentions légales */
.prose { font-size:1.08rem; line-height:1.68; margin:0 auto; max-width:700px; }
.prose > :first-child { margin-top:0; }
.prose h2 { font-size:clamp(1.7rem,3vw,2.4rem); letter-spacing:-.04em; line-height:1; margin:2.8rem 0 1rem; }
.prose h3 { font-size:1.25rem; letter-spacing:-.02em; margin:2rem 0 .6rem; }
.prose p,.prose li { color:#244a5e; }
.prose ul,.prose ol { padding-left:1.2rem; }
.prose li { margin:.45rem 0; }
.prose a { text-decoration:underline; text-underline-offset:.2em; }
.prose strong { color:var(--ink); }
.prose .lead { color:#147777; font-family:Georgia,serif; font-size:1.3rem; font-style:italic; line-height:1.4; }
.callout { background:var(--yellow); border:1px solid var(--ink); margin:2.2rem 0; padding:1.4rem 1.6rem; }
.callout p { color:var(--ink); margin:0; }
.callout p + p { margin-top:.6rem; }
.todo { background:#fff4da; border:2px dashed #a54431; color:#7a2416; font-weight:900; padding:0 .3rem; }

/* Bandeau de chiffres en haut des services (accueil) */
.proof-band { align-items:start; border-bottom:1px solid var(--line); border-top:1px solid var(--line); display:grid; grid-template-columns:repeat(3,minmax(0,1fr)) auto; margin:-3rem 0 6.5rem; }
.proof-band > div { border-right:1px solid var(--line); padding:2rem 2rem 2rem 0; }
.proof-band > div + div { padding-left:2rem; }
.proof-band b { display:block; font-size:clamp(3.2rem,5.5vw,5.6rem); letter-spacing:-.06em; line-height:.85; }
.proof-band b em { color:#0e5c5c; font-family:Georgia,serif; font-size:.42em; font-weight:500; letter-spacing:-.02em; }
.proof-band > div > span { color:#4e6d7c; display:block; font-size:.95rem; line-height:1.4; margin-top:.8rem; max-width:260px; }
.proof-band .poster-link { align-self:center; margin:0 0 0 2rem; white-space:nowrap; }
@media (max-width:980px) { .proof-band { grid-template-columns:repeat(3,minmax(0,1fr)); }.proof-band .poster-link { grid-column:1/-1; justify-self:start; margin:1.4rem 0 1.6rem; } }
@media (max-width:800px) { .proof-band { grid-template-columns:1fr; margin:-1.5rem 0 4rem; }.proof-band > div { border-bottom:1px solid var(--line); border-right:0; padding:1.4rem 0; }.proof-band > div + div { padding-left:0; } }

/* Contrastes WCAG AA (mesurés le 11/09/2026) : vert foncé sur jaune/aqua, bleu nuit sur corail, blanc pour les grands italiques sur corail. */
.hero-bottom p,.page-hero .lead { color:#0e5c5c; }
.page-hero--yellow .eyebrow { color:#803a32; }
.page-hero--ink .lead { color:#a7e0c6; }
.contact-section,.poster-video,.cta-band,.team-card--coral,.project-sweet,.page-hero--coral { color:#0b2233; }
.contact-intro .eyebrow,.cta-band .eyebrow,.page-hero--coral .eyebrow,.page-hero--coral .lead,.team-card--coral p,.project-sweet > p { color:#0b2233; }
.contact-form input,.contact-form textarea { border-bottom-color:rgba(11,34,51,.7); color:#0b2233; }
.contact-form input::placeholder,.contact-form textarea::placeholder { color:rgba(11,34,51,.72); }
.contact-options span { border-color:rgba(11,34,51,.7); }
.contact-intro h2 em,.cta-band h2 em,.poster-video h3 em,.page-hero--coral h1 em,.team-card--coral b,.project-sweet h3 em { color:#fff; }
/* Repères de prix sur les pages service */
.prices { border-top:1px solid var(--line); display:grid; gap:4rem; grid-template-columns:.85fr 1.15fr; margin-top:5rem; padding-top:5rem; }
.price-list { display:grid; gap:.8rem; list-style:none; margin:0; padding:0; }
.price-card { align-items:start; background:#fffdf6; border:1px solid var(--ink); display:grid; gap:.35rem 1.5rem; grid-template-columns:1fr auto; padding:1.3rem 1.4rem; }
.price-card > span { font-size:1.12rem; font-weight:800; letter-spacing:-.01em; line-height:1.25; }
.price-card > b { color:#4e6d7c; font-size:.8rem; font-weight:700; justify-self:end; text-align:right; white-space:nowrap; }
.price-card > b strong { color:var(--ink); display:block; font-size:1.7rem; letter-spacing:-.04em; line-height:1.05; }
.price-card > p { color:#4e6d7c; grid-column:1/-1; line-height:1.5; margin:.35rem 0 0; }
.price-card--devis > b strong { color:#0e5c5c; font-family:Georgia,serif; font-style:italic; font-weight:500; letter-spacing:-.02em; }
@media (max-width:800px) { .prices { gap:2rem; grid-template-columns:1fr; margin-top:3rem; padding-top:3rem; }.price-card { grid-template-columns:1fr; }.price-card > b { justify-self:start; text-align:left; } }

/* Accueil : H1 porteur des mots-clés, slogan en grand juste dessous */
.hero h1.hero-kicker { color:#803a32; font-size:.82rem; font-weight:900; letter-spacing:.09em; line-height:1.3; margin:0 0 1.3rem; text-transform:uppercase; }
.hero .hero-title { font-size:clamp(4rem,7vw,7.5rem); font-weight:700; letter-spacing:-.055em; line-height:.8; margin:0; }
.hero .hero-title em { color:#147777; font-family:Georgia,serif; font-weight:500; }
@media (max-width:800px) { .hero .hero-title { font-size:clamp(3.6rem,15.2vw,5.8rem); } }

/* FAQ des pages service (reprise en données structurées par build.py) */
.faq { border-top:1px solid var(--line); margin-top:5rem; padding-top:5rem; }
.faq .section-head { margin-bottom:1.5rem; }
.faq details { border-bottom:1px solid var(--line); max-width:900px; }
.faq summary { cursor:pointer; font-size:1.15rem; font-weight:800; line-height:1.35; list-style:none; padding:1.3rem 3rem 1.3rem 0; position:relative; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { color:#a54431; content:"+"; font-size:1.7rem; font-weight:900; line-height:1; position:absolute; right:.3rem; top:1.15rem; transition:transform 200ms ease; }
.faq details[open] summary::after { transform:rotate(45deg); }
.faq details p { color:#4e6d7c; line-height:1.6; margin:0 0 1.4rem; max-width:760px; }
@media (max-width:800px) { .faq { margin-top:3rem; padding-top:3rem; } }
.check-list a,.split-head a { text-decoration:underline; text-underline-offset:.2em; }
.projects-heading .poster-link:hover { background:#f8f4e8; border-color:#f8f4e8; color:var(--ink); }

.poster-link + .poster-link { margin-left:.45rem; }

/* Animations au défilement (désactivées si l'utilisateur réduit les animations) */
.proof-band [data-count] { font-variant-numeric:tabular-nums; }
.motion-ready .reveal { opacity:0; transform:translateY(28px); }
.motion-ready .reveal.is-visible { animation:poster-arrival 760ms cubic-bezier(.16,1,.3,1) var(--reveal-delay,0ms) both; }
.motion-ready .hero-stamp { animation:stamp-in 900ms cubic-bezier(.16,1,.3,1) 500ms both; }
@keyframes stamp-in { 0% { opacity:0; transform:rotate(-10deg) scale(1.6); } 60% { opacity:1; transform:rotate(11deg) scale(.94); } 100% { opacity:1; transform:rotate(8deg) scale(1); } }