:root{--roofnet-navy: #04263A;--roofnet-blue: #006EAB;--roofnet-blue-light: #9ABDDE;--roofnet-grey: #999999;--roofnet-cyan: #0089d4;--roofnet-ink: #13212b;--roofnet-muted: #55646f;--roofnet-paper: #f1f6fa;--menu-delay: .3s;--roofnet-header-height: 124px;}html, body{font-family:"Poppins", Arial, sans-serif;color: var(--roofnet-ink);}main.page h1, main.page h2, main.page h3, main.page p{font-family: inherit;}.roofnet-logo{display: inline-block;line-height: 0;width: 205px;}.roofnet-logo img{display: block;height: auto;width: 100%;}.top_space{height: var(--roofnet-header-height);}html.home-page .top_space{height: 0;}header.top{background: #fff;height: var(--roofnet-header-height);left: 0;padding: 0;position: fixed;top: 0;width: 100%;z-index: 20;transition: height var(--menu-delay) ease-in-out, box-shadow var(--menu-delay) ease-out, background var(--menu-delay) ease-out;}header.top::before{background: linear-gradient(110deg, #04263a 0%, var(--roofnet-navy) 62%, #0a3450 100%);content:"";inset: 0;position: absolute;z-index: -1;transition: opacity var(--menu-delay) ease-out;}html.home-page header.top:not(.header_scroll){background: transparent;}html.home-page header.top:not(.header_scroll)::before{opacity: 0;}header.top.header_scroll{box-shadow: 0 4px 18px rgba(9, 33, 52, .18);height: 72px;}header.top .roofnet-logo{transition: width var(--menu-delay) ease-in-out;}header.top.header_scroll .roofnet-logo{width: 150px;}header.top #menu_bt{transition: padding var(--menu-delay) ease-in-out;}header.top.header_scroll #menu_bt{padding: 0;}header.top .page_content{height: 100%;align-items: center;display: flex;justify-content: space-between;}header.top .menu ul, .roofnet-footer-nav{display: flex;gap: clamp(22px, 3vw, 60px);list-style: none;margin: 0;padding: 0;}header.top .menu li{margin: 0;}header.top .menu a{color: #fff;display: block;font-size: .95rem;font-weight: 400;padding: 12px 0;}header.top .menu .roofnet-menu-contact{border: 1px solid #fff;margin: 0 0 0 16px;padding: 0 22px;}header.top .menu .roofnet-menu-contact a{padding: 11px 0;text-transform: uppercase;}#menu_bt_close{display: none;}.consent-button{position: fixed;right: 0;bottom: 0;z-index: 2147483646;width: 70px;height: 66px;padding: 8px 10px;border: 0;background: transparent url('/images/consent/tarteaucitron.svg') center / 50px 50px no-repeat;color: transparent;font-size: 0;cursor: pointer;}.consent-button:focus-visible{outline: 2px solid #006eab;outline-offset: -3px;}@media (max-width: 640px){.consent-button{width: 53px;height: 49px;background-size: 33px 33px;}}.roofnet-eyebrow, .roofnet-label{color: var(--roofnet-blue);font-size: .98rem;font-weight: 600;letter-spacing: -.02em;margin-bottom: 34px;text-transform: uppercase;}.bouton.roofnet-button{border-radius: 0;font-family: inherit;font-size: .88rem;font-weight: 500;letter-spacing: 0;margin: 0;padding: 16px 24px;text-transform: uppercase;}.bouton.roofnet-button-primary{background: var(--roofnet-blue);border-color: var(--roofnet-blue);color: #fff;}.bouton.roofnet-button:hover, .bouton.roofnet-button-primary:hover{background: var(--roofnet-cyan);border-color: var(--roofnet-cyan);box-shadow: none;color: #fff;}.roofnet-section{padding: 112px 0;position: relative;}.roofnet-field-video{background: linear-gradient(135deg, #30495d, #101d28);height: 100%;inset: 0;overflow: hidden;position: absolute;width: 100%;}.roofnet-field-video > img, .roofnet-field-video .video_container, .roofnet-field-video video{height: 100%;inset: 0;position: absolute;width: 100%;}main.page .roofnet-field-video > img, .roofnet-field-video video{display: block;object-fit: cover;}.roofnet-field-video .video_container{z-index: 1;}.roofnet-video-play{align-items: center;background: rgba(20, 27, 32, .28);border: 6px solid #fff;border-radius: 50%;color: #fff;cursor: pointer;display: flex;height: clamp(112px, 9vw, 178px);justify-content: center;left: 50%;padding: 0;position: absolute;top: 54%;transform: translate(-50%, -50%);transition: background .2s ease, opacity .2s ease, transform .2s ease;width: clamp(112px, 9vw, 178px);z-index: 3;}.roofnet-video-play svg{fill: currentColor;height: 48%;margin-left: 6%;width: 48%;}.roofnet-video-play:hover, .roofnet-video-play:focus-visible{background: rgba(0, 110, 171, .8);transform: translate(-50%, -50%) scale(1.04);}.roofnet-video-play:focus-visible{outline: 3px solid #fff;outline-offset: 5px;}.roofnet-video-play.is-hidden{opacity: 0;pointer-events: none;}.roofnet-footer{background: var(--roofnet-navy);color: #fff;padding: 58px 0 44px;}.roofnet-footer a{color: #fff;}.roofnet-footer a:hover{color: var(--roofnet-blue-light);}.roofnet-footer-top{column-gap: 32px;justify-content: space-between;padding-bottom: 40px;}.roofnet-footer-nav{flex-wrap: wrap;max-width: 100%;padding-top: 24px;row-gap: 13px;}.roofnet-footer-nav a{font-size: .9rem;}.roofnet-footer .roofnet-logo{flex-shrink: 0;font-size: 2.5rem;}.roofnet-footer-bottom{border-top: 1px solid rgba(255, 255, 255, .22);gap: 16px 32px;padding-top: 32px;}.roofnet-footer-bottom p{font-size: .78rem;line-height: 1.85;margin: 0;}.roofnet-footer-bottom p:last-child{display: flex;flex-wrap: wrap;gap: 8px 25px;}.contact-hero{background: radial-gradient(circle at 82% 20%, rgba(0, 137, 212, .26), transparent 30%), linear-gradient(135deg, #04263a 0%, var(--roofnet-navy) 62%, #0a3450 100%);overflow: hidden;padding: clamp(75px, 8vw, 120px) 0 clamp(82px, 9vw, 135px);position: relative;}.contact-hero:after{background: linear-gradient(90deg, transparent, rgba(154, 189, 222, .55), transparent);bottom: 0;content:"";height: 1px;left: 15%;position: absolute;width: 70%;}.contact-hero-layout{align-items: end;display: grid;gap: clamp(45px, 8vw, 130px);grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr);}.contact-hero .portfolio-kicker, .contact-details .portfolio-kicker, .contact-form-success .portfolio-kicker{align-items: center;color: var(--roofnet-blue);display: flex;font-size: .78rem;font-weight: 600;gap: .55em;letter-spacing: .06em;margin: 0 0 20px;text-transform: uppercase;}.contact-hero .portfolio-kicker{color: var(--roofnet-blue-light);}.contact-hero .portfolio-kicker .icon, .contact-details .portfolio-kicker .icon{height: 1.15em;width: 1.15em;}.contact-hero h1{color: #fff;font-size: clamp(3rem, 5.4vw, 5.6rem);font-weight: 600;letter-spacing: -.06em;line-height: 1.02;margin: 0;}.contact-hero h1 span{color: var(--roofnet-blue-light);}.contact-hero-intro{color: rgba(255, 255, 255, .76);font-size: clamp(1rem, 1.25vw, 1.15rem);font-weight: 400;line-height: 1.75;margin: 2em 0 0;max-width: 710px;}.contact-hero-note{align-items: center;border-bottom: 1px solid rgba(255, 255, 255, .18);border-top: 1px solid rgba(255, 255, 255, .18);display: flex;gap: 1.1em;padding: 1.45em 0;}.contact-availability{background: var(--roofnet-blue-light);border: 5px solid rgba(154, 189, 222, .14);border-radius: 50%;box-sizing: content-box;flex: 0 0 auto;height: 9px;width: 9px;}.contact-hero-note p{color: rgba(255, 255, 255, .58);font-size: .69rem;letter-spacing: .08em;margin: 0 0 .35em;text-transform: uppercase;}.contact-hero-note strong{color: #fff;font-size: .87rem;font-weight: 500;}.contact-page{background: #fff;color: var(--roofnet-ink);padding: clamp(65px, 8vw, 120px) 0 clamp(90px, 10vw, 150px);}.contact-layout{display: grid;gap: clamp(45px, 8vw, 115px);grid-template-columns: minmax(250px, .7fr) minmax(0, 1.3fr);}.contact-details{align-self: start;position: sticky;top: 30px;}.contact-details h2, .contact-form-heading h2, .contact-form-success h2{font-weight: 600;letter-spacing: -.055em;}.contact-details h2{font-size: clamp(2rem, 3.3vw, 3.35rem);line-height: 1.1;margin: 0;}.contact-details-intro{color: var(--roofnet-muted);font-size: .96rem;line-height: 1.75;margin: 1.35em 0 0;max-width: 450px;}.contact-details-list{border-top: 1px solid #d9e0e4;margin-top: clamp(32px, 4vw, 52px);}.contact-details-list > a, .contact-details-list > div{align-items: center;border-bottom: 1px solid #d9e0e4;color: var(--roofnet-ink);display: grid;gap: 0 1em;grid-template-columns: 2.8em minmax(0, 1fr);padding: 1.15em 0;text-decoration: none;}.contact-details-list > a{transition: color .2s ease, padding-left .2s ease;}.contact-details-list > a:hover{color: var(--roofnet-blue);padding-left: .4em;}.contact-details-list span{align-items: center;background: #e7f2fa;border-radius: 50%;color: var(--roofnet-blue);display: flex;grid-row: 1 / span 2;height: 2.8em;justify-content: center;width: 2.8em;}.contact-details-list .icon{height: 1.25em;width: 1.25em;}.contact-details-list small{color: var(--roofnet-muted);font-size: .65rem;letter-spacing: .08em;text-transform: uppercase;}.contact-details-list strong{font-size: .86rem;font-weight: 500;min-width: 0;overflow-wrap: anywhere;}.contact-promise{align-items: flex-start;background: #edf6fb;border-left: 3px solid var(--roofnet-blue);display: flex;font-size: .73rem;gap: 1em;line-height: 1.65;margin-top: 2.2em;padding: 1.35em 1.5em;}.contact-promise > .icon{color: var(--roofnet-blue);flex: 0 0 auto;height: 1.4em;margin-top: .15em;width: 1.4em;}.contact-promise p{margin: 0;}.contact-form-card{background: var(--roofnet-paper);border: 1px solid #e1e6e9;box-shadow: 0 24px 70px rgba(9, 33, 52, .11);min-width: 0;padding: clamp(28px, 5vw, 62px);}.contact-form-step{color: var(--roofnet-blue);font-size: .67rem;font-weight: 600;letter-spacing: .11em;margin: 0 0 .8em;text-transform: uppercase;}.contact-form-heading h2{font-size: clamp(2rem, 3.6vw, 3.7rem);line-height: 1.08;margin: 0;}.contact-form-heading > p:last-child{color: var(--roofnet-muted);font-size: .94rem;line-height: 1.7;margin: 1em 0 0;}.contact-form{margin-top: clamp(34px, 5vw, 55px);}.contact-form[hidden], .contact-form-heading[hidden], .contact-form-success[hidden], .contact-form-error[hidden]{display: none !important;}.contact-honeypot{height: 1px;left: -10000px;overflow: hidden;position: absolute;top: auto;width: 1px;}.contact-form-grid{display: grid;gap: 1.35em;grid-template-columns: repeat(2, minmax(0, 1fr));}.contact-field{margin-bottom: 0;}.contact-field label{display: block;font-size: .72rem;font-weight: 500;margin-bottom: .65em;}.contact-field label span{color: var(--roofnet-blue);}.contact-field label small{color: var(--roofnet-muted);font-size: .84em;font-weight: 400;}.contact-field input, .contact-field select, .contact-field textarea{appearance: none;background: #fff;border: 1px solid #cfd8de;border-radius: 0;box-sizing: border-box;color: var(--roofnet-ink);font: inherit;font-size: .82rem;line-height: 1.5;outline: none;padding: .95em 1.05em;transition: border-color .2s ease, box-shadow .2s ease, background .2s ease;width: 100%;}.contact-field select{background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);background-position: calc(100% - 18px) calc(50% - 2px), calc(100% - 13px) calc(50% - 2px);background-repeat: no-repeat;background-size: 5px 5px, 5px 5px;padding-right: 2.8em;}.contact-field textarea{min-height: 190px;resize: vertical;}.contact-field input:focus, .contact-field select:focus, .contact-field textarea:focus{background: #fff;border-color: var(--roofnet-blue);box-shadow: 0 0 0 4px rgba(0, 110, 171, .16);}.contact-field input.is-invalid, .contact-field select.is-invalid, .contact-field textarea.is-invalid{border-color: #c44231;}.contact-field-error{color: #a53325;display: block;font-size: .65rem;line-height: 1.4;min-height: 1.4em;padding-top: .35em;}.contact-form-error{background: rgba(196, 66, 49, .09);border-left: 3px solid #c44231;color: #962d20;font-size: .72rem;line-height: 1.55;margin-top: 1.5em;padding: 1em 1.2em;}.contact-form-footer{align-items: center;border-top: 1px solid #d9e0e4;display: flex;gap: 2em;justify-content: space-between;margin-top: 2em;padding-top: 2em;}.contact-form-footer > p{align-items: center;color: var(--roofnet-muted);display: flex;font-size: .65rem;gap: .55em;line-height: 1.5;margin: 0;}.contact-form-footer > p .icon{height: 1.2em;width: 1.2em;}.contact-submit{align-items: center;background: var(--roofnet-blue);border: 1px solid var(--roofnet-blue);border-radius: 0;color: #fff;cursor: pointer;display: inline-flex;font: inherit;font-size: .76rem;font-weight: 600;justify-content: center;min-height: 3.6em;min-width: 205px;padding: .9em 1.5em;text-transform: uppercase;transition: background .25s ease, border-color .25s ease, transform .25s ease;}.contact-submit:hover{background: var(--roofnet-cyan);border-color: var(--roofnet-cyan);transform: translateY(-2px);}.contact-submit:focus-visible{box-shadow: 0 0 0 4px rgba(0, 110, 171, .22);outline: none;}.contact-submit:disabled{cursor: wait;opacity: .8;transform: none;}.contact-submit-label, .contact-submit-loading{align-items: center;display: flex;gap: .65em;}.contact-submit-label .icon{height: 1.25em;transition: transform .2s ease;width: 1.25em;}.contact-submit:hover .contact-submit-label .icon{transform: translateX(3px);}.contact-submit-loading{display: none;}.contact-form.is-loading .contact-submit-label{display: none;}.contact-form.is-loading .contact-submit-loading{display: flex;}.contact-form-success{align-items: flex-start;display: flex;flex-direction: column;justify-content: center;min-height: 540px;}.contact-form-success > span{align-items: center;background: var(--roofnet-blue);border-radius: 50%;color: #fff;display: flex;height: 4.3em;justify-content: center;margin-bottom: 2em;width: 4.3em;}.contact-form-success > span .icon{height: 2em;stroke-width: 2.5;width: 2em;}.contact-form-success h2{font-size: clamp(2.2rem, 4vw, 4rem);line-height: 1.08;margin: 0;}.contact-form-success > p:not(.portfolio-kicker){color: var(--roofnet-muted);font-size: .94rem;line-height: 1.75;margin: 1.2em 0 0;max-width: 560px;}.contact-form-success > a{align-items: center;color: var(--roofnet-ink);display: inline-flex;font-size: .78rem;font-weight: 600;gap: .6em;margin-top: 2.5em;text-decoration: none;}.contact-form-success > a:hover{color: var(--roofnet-blue);}.contact-form-success > a .icon{height: 1.3em;transition: transform .2s ease;width: 1.3em;}.contact-form-success > a:hover .icon{transform: translateX(3px);}@media(max-width: 900px){.contact-hero-layout, .contact-layout{grid-template-columns: 1fr;}.contact-hero-note{max-width: 480px;}.contact-details{position: static;}.contact-details-list{display: grid;gap: 0 1.5em;grid-template-columns: repeat(2, minmax(0, 1fr));}.contact-details-list > div{grid-column: 1 / -1;}}@media(max-width: 600px){.contact-hero{padding-bottom: 80px;padding-top: 65px;}.contact-hero-layout{gap: 35px;}.contact-hero h1{font-size: 2.85rem;}.contact-details-list, .contact-form-grid{grid-template-columns: 1fr;}.contact-details-list > div{grid-column: auto;}.contact-form-card{padding: 29px 20px 32px;}.contact-form-footer{align-items: stretch;flex-direction: column;}.contact-submit{width: 100%;}.contact-form-success{min-height: 440px;}}.company-contact h2{font-size: clamp(2.2rem, 3.5vw, 3.35rem);font-weight: 600;letter-spacing: -.06em;line-height: 1.1;margin: 0;}.company-contact{background: #f1f2f2;}.company-contact-card{align-items: center;display: flex;gap: 35px;justify-content: space-between;}.company-contact-card .roofnet-label{margin-bottom: 16px;}.company-contact-card .roofnet-button{flex: 0 0 auto;}.company-contact-card .roofnet-button span{font-size: 1.3rem;margin-left: 10px;vertical-align: -1px;}@media(max-width: 992px){:root{--roofnet-header-height: 114px;}header.top.header_scroll{height: 56px;}#menu_bt{color: #fff;display: block;padding: 0;position: static;}#menu_bt svg{width: 30px;}header.top .menu{background: var(--roofnet-navy);display: none;left: 0;padding: 95px 40px 36px;position: absolute;top: 0;width: 100%;}header.top.menu_mobile .menu{display: block;}header.top .menu ul{align-items: flex-start;flex-direction: column;gap: 4px;}header.top .menu .roofnet-menu-contact{margin: 14px 0 0;}.roofnet-section{padding: 82px 0;}}@media(max-width: 640px){.roofnet-logo{width: 150px;}.roofnet-eyebrow{font-size: .72rem;line-height: 1.6;margin-bottom: 24px;}.bouton.roofnet-button{text-align: center;width: 100%;}.roofnet-video-play{top: 60%;}.roofnet-footer{padding: 48px 0 35px;}.roofnet-footer-top, .roofnet-footer-bottom{align-items: flex-start;flex-direction: column;gap: 32px;}.roofnet-footer-top{padding-bottom: 42px;}.roofnet-footer-nav{display: grid;grid-template-columns: repeat(2, minmax(0, 1fr));gap: 13px 24px;padding-top: 0;width: 100%;}.roofnet-footer-bottom p:last-child{flex-direction: column;gap: 5px;}.roofnet-footer-bottom p:last-child span{display: none;}.company-contact h2{font-size: 2.3rem;}.company-contact{padding-bottom: 75px;padding-top: 75px;}.company-contact-card{align-items: flex-start;flex-direction: column;}.company-contact-card .roofnet-button{width: 100%;}}@media (min-width: 481px) and (max-width: 640px){.roofnet-footer-nav{grid-template-columns: repeat(3, minmax(0, 1fr));}}header.top{z-index:50}header.top .page_content{width:100%;max-width:1600px;padding-inline:clamp(20px, 4vw, 64px);gap:25px}header.top .roofnet-logo{position:relative;flex-shrink:0;display:flex;align-items:center;gap:18px;width:auto;--header-roofnet-width:205px;--header-alpha-height:30px}header.top .logo-roofnet{display:block;width:var(--header-roofnet-width);height:auto;color:#fff;fill:currentColor;transition:width .3s ease, color .3s ease}header.top .logo-roofnet [fill]{fill:currentColor}header.top .logo-alpha{display:block;width:auto;height:var(--header-alpha-height);color:#fff;fill:currentColor;flex-shrink:0;transition:height .3s ease, color .3s ease;border-left: 1px solid rgba(255, 255, 255, 0.35);padding-left: 15px;}header.top.header_scroll::before{opacity:0}header.top.header_scroll .roofnet-logo{width:auto;--header-roofnet-width:150px;--header-alpha-height:26px}header.top.header_scroll .logo-roofnet{color:var(--roofnet-blue)}header.top.header_scroll .logo-alpha{color:#2495ae}header.top .menu ul{gap:clamp(10px, 1.35vw, 22px);align-items:center}header.top .menu a{position:relative;font-size:clamp(11px, .9vw, 14px);white-space:nowrap;padding:9px 0;text-decoration:none;transition:color .2s ease}header.top .menu a::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:2px;background:var(--roofnet-cyan);transform:scaleX(0);transform-origin:left;transition:transform .3s cubic-bezier(.2, .7, .3, 1)}header.top .menu a:hover::after, header.top .menu a:focus-visible::after, header.top .menu a[aria-current="true"]::after{transform:scaleX(1)}header.top.header_scroll .menu a{color:var(--roofnet-ink)}header.top .menu .roofnet-menu-contact{margin-left:0;padding-inline:16px;transition:background .2s ease, border-color .2s ease}header.top.header_scroll .menu .roofnet-menu-contact{background:var(--roofnet-blue);border-color:var(--roofnet-blue)}header.top.header_scroll .menu .roofnet-menu-contact a{color:#fff}header.top .menu .roofnet-menu-contact a{font-size:12px;text-transform:none}header.top .menu .roofnet-menu-contact a::after{display:none}header.top .menu .roofnet-menu-contact:hover, header.top .menu .roofnet-menu-contact:focus-within{background:var(--roofnet-cyan);border-color:var(--roofnet-cyan)}#menu_bt, #menu_bt_close{background:transparent;border:1px solid rgba(255, 255, 255, .8);width:44px;height:42px;padding:5px;cursor:pointer;line-height:0;position:relative;z-index:52}#menu_bt{display:none}#menu_bt svg, #menu_bt_close svg{width:30px}header.top.header_scroll #menu_bt{padding:5px;border-color:var(--roofnet-blue)}header.top.header_scroll #menu_bt svg g{stroke:var(--roofnet-blue)}header.top.menu_mobile #menu_bt{display:none}header.top.menu_mobile #menu_bt_close{display:block}header.top.menu_mobile #menu_bt_close svg g{stroke:#fff}body.roofnet-menu-open{overflow:hidden}@media(max-width:1200px){header.top .page_content{flex-wrap:nowrap}header.top .roofnet-logo{margin-right:auto}#menu_bt{display:block}header.top .menu{display:none;position:fixed;inset:0;background:var(--roofnet-navy);padding:90px clamp(24px, 7vw, 80px) 35px;overflow-y:auto;max-height:100dvh}header.top.menu_mobile .menu{display:flex;align-items:center}header.top.menu_mobile .roofnet-logo{position:relative;z-index:52}header.top.menu_mobile .logo-roofnet, header.top.menu_mobile .logo-alpha{color:#fff}header.top .menu ul{flex-direction:column;align-items:flex-start;gap:8px}header.top .menu a, header.top.header_scroll .menu a{font-size:clamp(18px, 3.4vh, 28px);color:#fff;white-space:normal;padding:8px 0}header.top .menu a::after{display:none}header.top .menu .roofnet-menu-contact{margin:10px 0 0;padding-inline:20px}header.top .menu .roofnet-menu-contact a{font-size:15px}}@media(min-width:1201px){header.top .menu{display:block}header.top.menu_mobile #menu_bt_close{display:none}}@media(max-width:640px){header.top .roofnet-logo{--header-roofnet-width:150px;--header-alpha-height:26px;gap:14px}}@media(prefers-reduced-motion:reduce){header.top, header.top *, header.top .menu a::after{transition:none}}
