/* Shared visual language for every inner page in the Web by Chris preview. */
:root{--wbc-navy:#0b1d49;--wbc-blue:#2165db;--wbc-blue-bright:#2d79ff;--wbc-ink:#10234f;--wbc-muted:#63718b;--wbc-line:#e1e8f3;--wbc-paper:#f6f8fc}
body:not(.wbc-home){background:var(--wbc-paper);color:var(--wbc-ink);font-family:'DM Sans',sans-serif}
body:not(.wbc-home) header.sticky{z-index:60;background:#ffffffed!important;border-color:var(--wbc-line)!important;box-shadow:0 5px 22px #0b1b4d08;backdrop-filter:blur(18px)}
body:not(.wbc-home) header.sticky nav a{transition:color .2s,transform .2s}
body:not(.wbc-home) header.sticky nav a:hover{color:var(--wbc-blue)!important;transform:translateY(-1px)}
body:not(.wbc-home) header.sticky .bg-accent,body:not(.wbc-home) .bg-accent{border-color:transparent!important;background:linear-gradient(125deg,#2874f3,#104bc9)!important;color:#fff!important;box-shadow:0 8px 20px -8px #1d6bff99;transition:transform .22s,box-shadow .22s,filter .22s}
body:not(.wbc-home) header.sticky .bg-accent:hover,body:not(.wbc-home) .bg-accent:hover{transform:translateY(-2px);filter:brightness(1.04);box-shadow:0 13px 25px -8px #1d6bffb5}
body:not(.wbc-home) main>section:first-child:not(.contact-hero){position:relative;overflow:hidden;background:radial-gradient(ellipse at 84% 9%,#235bc255,transparent 36%),linear-gradient(122deg,#0a1d49,#102f70 72%,#0b1d49)!important;color:#fff!important}
body:not(.wbc-home) main>section:first-child:not(.contact-hero):before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,transparent 65%,#ffffff08 65.1%,#ffffff08 66%,transparent 66.1%)}
body:not(.wbc-home) main>section:first-child:not(.contact-hero)>.mx-auto{position:relative;z-index:1}
body:not(.wbc-home) main>section:first-child:not(.contact-hero) h1{max-width:980px;color:#fff!important;font-family:'Space Grotesk',sans-serif;font-weight:600;letter-spacing:-.055em;line-height:1.04}
body:not(.wbc-home) main>section:first-child:not(.contact-hero) p{color:#d6e0f4}
body:not(.wbc-home) .eyebrow,body:not(.wbc-home) .text-accent{color:#76a8ff!important}
body:not(.wbc-home) main>section:not(:first-child):not(.bg-primary){background:#f7f9fd}
body:not(.wbc-home) .section-pad{padding-block:clamp(58px,8vw,104px)}
body:not(.wbc-home) main h2,body:not(.wbc-home) main h3{font-family:'Space Grotesk','DM Sans',sans-serif;letter-spacing:-.035em}
body:not(.wbc-home) main>section:nth-child(2n+1):not(:first-child):not(.bg-primary){background:#fff}
body:not(.wbc-home) main .rounded-lg,body:not(.wbc-home) main .rounded-xl{border-radius:12px}
body:not(.wbc-home) main .border-border,body:not(.wbc-home) main .border-input{border-color:var(--wbc-line)}
body:not(.wbc-home) main .shadow,body:not(.wbc-home) main .shadow-lg{box-shadow:0 12px 34px #1229530d}
body:not(.wbc-home) main a[class*="bg-background"],body:not(.wbc-home) main button[class*="bg-background"]{transition:transform .22s,border-color .22s,color .22s,background .22s,box-shadow .22s}
body:not(.wbc-home) main a[class*="bg-background"]:hover,body:not(.wbc-home) main button[class*="bg-background"]:hover{transform:translateY(-2px);border-color:#9db8eb;background:#edf4ff;color:#174fbd;box-shadow:0 9px 22px #164c9817}
body:not(.wbc-home) main input:focus,body:not(.wbc-home) main select:focus,body:not(.wbc-home) main textarea:focus{border-color:#6a9df1;outline:3px solid #2d79ff22}
body:not(.wbc-home) footer{background:#0a1c47!important;color:#e6edfb!important}
body:not(.wbc-home) footer a{transition:color .2s}
body:not(.wbc-home) footer a:hover{color:#84b1ff!important}
@media(max-width:700px){body:not(.wbc-home) main>section:first-child:not(.contact-hero){padding-block:58px!important}body:not(.wbc-home) main>section:first-child:not(.contact-hero) h1{font-size:clamp(36px,10vw,52px)!important;line-height:1.06}body:not(.wbc-home) .section-pad{padding-block:54px}body:not(.wbc-home) header.sticky .bg-accent:hover,body:not(.wbc-home) .bg-accent:hover{transform:none}}
@media(prefers-reduced-motion:reduce){body:not(.wbc-home) *,body:not(.wbc-home) *:before,body:not(.wbc-home) *:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
/* Contact: a quiet browser vignette uses the open half of the split hero. */
body.contact-page main>section:first-child:not(.contact-hero) h1{max-width:760px!important}
body.contact-page main>section:first-child:not(.contact-hero) p{max-width:590px}
body.contact-page main>section:first-child:not(.contact-hero):after{content:"•••       WEBBYCHRIS.FR\A\A UN STUDIO, UN SITE\A\A Votre activité,\A bien présentée.\A\A Création · SEO local · Suivi";white-space:pre;position:absolute;z-index:1;right:max(6%,calc((100% - 1250px)/2));top:50%;width:min(34vw,420px);min-height:260px;padding:47px 30px 28px;box-sizing:border-box;border:1px solid #ffffff42;border-radius:12px;background:radial-gradient(ellipse at 80% 18%,#2b69cf90,transparent 40%),linear-gradient(145deg,#153873,#0a1c47 82%);box-shadow:0 28px 66px #020c2b52,0 1px 0 #ffffff20 inset;color:#edf4ff;font:500 12px/1.7 'DM Sans',sans-serif;letter-spacing:.08em;transform:translateY(-50%) perspective(900px) rotateY(-9deg) rotateX(2deg);transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .4s}
body.contact-page main>section:first-child:not(.contact-hero):hover:after{transform:translateY(calc(-50% - 5px)) perspective(900px) rotateY(-4deg) rotateX(1deg);box-shadow:0 34px 72px #020c2b68,0 1px 0 #ffffff20 inset}
@media(max-width:900px){body.contact-page main>section:first-child:not(.contact-hero):after{display:none}body.contact-page main>section:first-child:not(.contact-hero) h1{max-width:760px!important}}
body:not(.wbc-home) header nav.is-open{display:flex!important;position:absolute;top:calc(100% + 8px);left:14px;right:14px;z-index:90;flex-direction:column;align-items:stretch;gap:0!important;padding:10px 16px;border:1px solid #e0e7f2;border-radius:12px;background:#fff;box-shadow:0 22px 48px #0b1b4d20}
body:not(.wbc-home) header nav.is-open a{padding:12px 2px;border-bottom:1px solid #edf0f6;color:#263958!important}
body:not(.wbc-home) header nav.is-open a:last-child{margin-top:8px;padding:12px;text-align:center;color:#fff!important}
/* Keep interior-page navigation in step with the handcrafted home header. */
body:not(.wbc-home) header.sticky{height:78px;display:flex;align-items:center;padding:0 clamp(25px,6vw,92px);background:#ffffffed!important}
body:not(.wbc-home) header.sticky>div{width:100%;max-width:none!important;height:100%!important;margin:0!important;display:flex!important;align-items:center;justify-content:space-between;gap:28px;padding:0!important}
body:not(.wbc-home) header.sticky>div>a img{width:157px;height:auto!important;max-height:none!important}
body:not(.wbc-home) header.sticky nav{display:flex;align-items:center;justify-content:flex-end;gap:clamp(16px,2.1vw,30px);padding:0!important}
body:not(.wbc-home) header.sticky nav a:not(.bg-accent){padding:0!important;border:0!important;color:#465578!important;font-size:12px!important;font-weight:500!important;white-space:nowrap}
body:not(.wbc-home) header.sticky nav a:not(.bg-accent):hover{color:#1657e0!important}
body:not(.wbc-home) header.sticky nav a.bg-accent{height:42px!important;padding:0 17px!important;border-radius:6px!important;white-space:nowrap;font-size:11px!important}
body:not(.wbc-home) header.sticky>div>div{display:none!important}
body:not(.wbc-home) header.sticky nav a[href="/"],body:not(.wbc-home) header.sticky nav a[href="/faq"]{display:none!important}
body:not(.wbc-home) header.sticky nav a[href="/creation-sites"]{font-size:0!important}
body:not(.wbc-home) header.sticky nav a[href="/creation-sites"]:after{content:"Services";font-size:12px}



body:not(.wbc-home) .wbc-story-section .wbc-about-band h2{color:#10234f!important}
body:not(.wbc-home) .wbc-story-section .wbc-about-band h2 em{color:#2868d7!important}
body:not(.wbc-home) .wbc-story-section .wbc-about-band>div:last-child>p{color:#63718b!important}
.wbc-story-section{padding:clamp(64px,8vw,112px) 0;background:#fff;color:#10234f;opacity:0;transform:translateY(28px);filter:blur(5px);transition:opacity .75s ease,transform .8s cubic-bezier(.2,.75,.2,1),filter .8s ease}
.wbc-story-section.is-visible{opacity:1;transform:none;filter:none}
.wbc-page-wrap{width:min(1180px,calc(100% - 48px));margin:0 auto}
.wbc-kicker{display:block;margin:0 0 13px;color:#2c69d5;font-size:10px;font-weight:700;letter-spacing:.15em}
.wbc-section-heading{max-width:720px;margin-bottom:35px}
.wbc-section-heading h2,.wbc-feature-row h2,.wbc-about-band h2,.wbc-question-layout h2{margin:0;color:#10234f;font:500 clamp(34px,4.5vw,58px)/1.06 'Space Grotesk',sans-serif;letter-spacing:-.055em}
.wbc-section-heading h2 em,.wbc-feature-row h2 em,.wbc-about-band h2 em,.wbc-question-layout h2 em{color:#2868d7;font-style:normal}
.wbc-section-heading>p,.wbc-feature-row>div:first-child>p,.wbc-about-band>div:last-child>p,.wbc-question-layout>div>p{max-width:610px;color:#63718b;font-size:15px;line-height:1.85}
.wbc-step-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}
.wbc-step-grid article{min-height:200px;padding:23px 20px;border:1px solid #e1e8f3;border-radius:12px;background:linear-gradient(145deg,#fff,#f8faff);box-shadow:0 10px 25px #12295308;transition:transform .25s,border-color .25s,box-shadow .25s}
.wbc-step-grid article:hover{transform:translateY(-4px);border-color:#b9cbee;box-shadow:0 17px 34px #12295312}
.wbc-step-grid article>span,.wbc-feature-list article>b{display:grid;place-items:center;width:33px;height:30px;margin-bottom:24px;border-radius:7px;background:#eaf1ff;color:#2165db;font-size:10px;font-weight:700}
.wbc-step-grid h3,.wbc-feature-list h3{margin:0 0 8px;color:#14264c;font-size:17px;font-weight:600;letter-spacing:-.025em}
.wbc-step-grid p,.wbc-feature-list p{margin:0;color:#687590;font-size:12px;line-height:1.75}
.wbc-feature-row{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:clamp(35px,7vw,100px)}
.wbc-feature-list{display:grid;gap:16px}
.wbc-feature-list article{display:flex;gap:15px;padding:17px;border:1px solid #e3eaf4;border-radius:10px;background:#fff}
.wbc-feature-list article>b{flex:0 0 32px;margin:0}
.wbc-inline-cta{display:inline-flex;align-items:center;gap:16px;margin-top:8px;color:#1957c1;font-size:13px;font-weight:700;text-decoration:none}
.wbc-inline-cta span{transition:transform .2s}.wbc-inline-cta:hover span{transform:translate(3px,-3px)}
.wbc-about-band{display:grid;grid-template-columns:.75fr 1.25fr;align-items:center;gap:clamp(38px,8vw,110px)}
.wbc-about-note{display:flex;min-height:310px;flex-direction:column;justify-content:space-between;padding:28px;border-radius:13px;background:radial-gradient(ellipse at 90% 10%,#3372dd70,transparent 44%),linear-gradient(145deg,#153873,#0a1c47);box-shadow:0 25px 55px #102b6126;color:#fff}
.wbc-about-note .wbc-kicker{color:#a9c8ff}.wbc-about-note strong{font:500 clamp(28px,3.2vw,40px)/1.12 'Space Grotesk',sans-serif;letter-spacing:-.05em}.wbc-about-note>span:last-child{color:#cfdbf2;font-size:11px}
.wbc-step-grid-three{grid-template-columns:repeat(3,minmax(0,1fr))}
.wbc-question-layout{display:grid;grid-template-columns:.85fr 1.15fr;align-items:start;gap:clamp(35px,7vw,90px)}
.wbc-question-form{display:grid;grid-template-columns:1fr 1fr;gap:15px;padding:27px;border:1px solid #e1e8f3;border-radius:14px;background:#fff;box-shadow:0 18px 44px #10234f0e}
.wbc-question-form label{display:grid;gap:7px;color:#293a5c;font-size:11px;font-weight:600}
.wbc-question-form input,.wbc-question-form textarea{width:100%;padding:12px;border:1px solid #dce4f1;border-radius:7px;background:#f9fbfe;color:#10234f;font:400 13px 'DM Sans',sans-serif;outline:none;transition:border-color .2s,box-shadow .2s}
.wbc-question-form input:focus,.wbc-question-form textarea:focus{border-color:#76a2ea;box-shadow:0 0 0 3px #2d79ff1c}
.wbc-question-form textarea{resize:vertical;min-height:110px}
.wbc-question-wide,.wbc-question-form .wbc-submit,.wbc-form-status{grid-column:1/-1}
.wbc-submit{display:flex;align-items:center;justify-content:space-between;min-height:47px;padding:0 17px;border:0;border-radius:8px;background:linear-gradient(125deg,#2874f3,#104bc9);box-shadow:0 8px 20px -8px #1d6bff99;color:white;font:600 12px 'DM Sans',sans-serif;cursor:pointer;transition:transform .2s,box-shadow .2s}
.wbc-submit:hover{transform:translateY(-2px);box-shadow:0 13px 24px -8px #1d6bffbf}.wbc-submit:disabled{opacity:.65;cursor:wait;transform:none}
.wbc-form-status{min-height:18px;margin:0;color:#5b6883;font-size:11px}.wbc-form-status.is-success{color:#16734d}.wbc-form-status.is-error{color:#bb413b}
.wbc-privacy-note{font-size:11px!important;color:#7b879c!important}
@media(max-width:850px){.wbc-step-grid{grid-template-columns:1fr 1fr}.wbc-feature-row,.wbc-about-band,.wbc-question-layout{grid-template-columns:1fr;gap:30px}.wbc-about-note{min-height:230px}}
@media(max-width:1023px){body:not(.wbc-home) header.sticky{padding-inline:24px}body:not(.wbc-home) header.sticky nav{display:none!important}body:not(.wbc-home) header.sticky>div>div{display:flex!important}body:not(.wbc-home) header.sticky>div>div>button[aria-label]{width:40px;height:40px;display:grid;place-items:center;border:1px solid #dce4f3;border-radius:6px;background:#fff;color:#173d90}body:not(.wbc-home) header.sticky nav.is-open{display:flex!important;position:absolute;top:calc(100% + 8px);left:14px;right:14px;z-index:90;flex-direction:column;align-items:stretch;gap:0!important;padding:10px 16px!important;border:1px solid #e0e7f2;border-radius:12px;background:#fff;box-shadow:0 22px 48px #0b1b4d20}body:not(.wbc-home) header.sticky nav.is-open a:not(.bg-accent){padding:12px 2px!important;border-bottom:1px solid #edf0f6!important}body:not(.wbc-home) header.sticky nav.is-open a.bg-accent{margin-top:8px;padding:12px!important;text-align:center}}
@media(max-width:560px){.wbc-page-wrap{width:calc(100% - 36px)}.wbc-story-section{padding:55px 0}.wbc-step-grid,.wbc-step-grid-three{grid-template-columns:1fr}.wbc-step-grid article{min-height:0;padding:19px}.wbc-step-grid article>span{margin-bottom:15px}.wbc-question-form{grid-template-columns:1fr;padding:19px}.wbc-question-form label{grid-column:1/-1}}
@media(prefers-reduced-motion:reduce){.wbc-story-section,.wbc-story-section.is-visible{opacity:1;transform:none;filter:none;transition:none}.wbc-step-grid article:hover,.wbc-submit:hover{transform:none}}

.wbc-story-section{background:#fff!important;color:#10234f!important}
.wbc-story-section .wbc-section-heading h2,.wbc-story-section .wbc-feature-row h2,.wbc-story-section .wbc-about-band h2,.wbc-story-section .wbc-question-layout h2{color:#10234f!important}
.wbc-story-section .wbc-section-heading h2 em,.wbc-story-section .wbc-feature-row h2 em,.wbc-story-section .wbc-about-band h2 em,.wbc-story-section .wbc-question-layout h2 em{color:#2868d7!important}
.wbc-story-section .wbc-section-heading>p,.wbc-story-section .wbc-feature-row>div:first-child>p,.wbc-story-section .wbc-about-band>div:last-child>p,.wbc-story-section .wbc-question-layout>div>p{color:#596984!important}

.wbc-step-grid p,.wbc-feature-list p{font-size:14px!important;line-height:1.7}
.wbc-inline-cta{font-size:14px!important}
.wbc-kicker{font-size:11px!important}
@media(max-width:560px){.wbc-step-grid p,.wbc-feature-list p{font-size:14px!important}}

body:not(.wbc-home) main p,body:not(.wbc-home) main li{font-size:15px!important;line-height:1.75}
@media(max-width:700px){body:not(.wbc-home) main p,body:not(.wbc-home) main li{font-size:14px!important}}
/* Interior pages: keep explanatory copy and lists at a readable, consistent size. */
body:not(.wbc-home) main p,body:not(.wbc-home) main li{font-size:16px!important;line-height:1.7!important}
body:not(.wbc-home) .wbc-kicker{font-size:12px!important}
body:not(.wbc-home) .wbc-inline-cta{font-size:15px!important}
@media(max-width:700px){body:not(.wbc-home) main p,body:not(.wbc-home) main li{font-size:15px!important;line-height:1.65!important}}