/* Four independent planes: black (0), fire (1), glass (2), content (3).
   The glass blur is rendered with the fire (fire-orbit.js): a full-screen
   backdrop-filter over an animated canvas is too costly on phones. */
.orbit-page{position:relative;background:#030202;--ink:#fff5ed;--muted:#b7aaa3;--line:rgba(255,205,175,.15);isolation:isolate}
.cosmos-black,.frosted-glass{position:fixed;inset:0;pointer-events:none}
.cosmos-black{z-index:0;background:#030202}
/* The fire scrolls with the page, so the browser keeps it on the heading with
   no script during scrolling. fire-orbit.js sets its height, within the page. */
.fire-layer{position:absolute;top:0;left:0;right:0;z-index:1;height:100vh;height:100lvh;max-height:100%;overflow:hidden;pointer-events:none}
#fire-canvas{display:block;width:100%;height:100%;opacity:0;transition:opacity 1.2s ease}
.fire-ready #fire-canvas{opacity:1}
.fire-fallback{position:absolute;top:0;left:0;right:0;height:100vh;height:100lvh;background:radial-gradient(ellipse 95px 68px at 24% 33%,#ffd393 0%,#ff701a 15%,#b62b08 36%,transparent 72%),radial-gradient(ellipse 260px 160px at 24% 33%,#b8260638,transparent 76%),radial-gradient(ellipse 85px 60px at 76% 42%,#ffe0a5 0%,#ff6413 18%,#c02b07 36%,transparent 72%),radial-gradient(ellipse 280px 165px at 76% 42%,#cd2e0833,transparent 76%);filter:blur(13px) saturate(1.18);transition:opacity 1.2s}
.fire-ready .fire-fallback{opacity:0}
.fire-unavailable #fire-canvas{opacity:0}
.fire-unavailable .fire-fallback{opacity:1}
.frosted-glass{z-index:2;background:linear-gradient(180deg,rgba(3,2,2,.13),rgba(10,4,2,.02) 42%,rgba(3,2,2,.48) 82%,#030202d9),radial-gradient(ellipse at 50% 37%,transparent 24%,rgba(3,2,2,.34) 78%,rgba(3,2,2,.7))}
.frosted-glass::after{content:"";position:absolute;inset:0;opacity:.045;background-image:url('/assets/frost-grain.svg');background-size:180px 180px;mix-blend-mode:screen}
.orbit-page .hub-shell{z-index:3}
.orbit-page .wrap{width:min(1180px,calc(100% - 112px))}
.orbit-page .hub-header{height:88px;border-color:rgba(255,209,181,.12)}
.orbit-page .wordmark{color:#f8e8df;font-weight:600}
.orbit-page .wordmark-glyph{border-color:rgba(255,182,138,.32);background:linear-gradient(145deg,rgba(255,157,95,.15),rgba(255,98,25,.025));box-shadow:inset 0 1px rgba(255,219,196,.14);color:#ffc39c}
.orbit-page .header-right{display:flex;align-items:center;gap:20px}
.orbit-page .menu-toggle{border-color:rgba(255,213,189,.2);background:rgba(255,222,203,.035);border-radius:50%}
.orbit-page .menu-toggle:hover,.orbit-page .menu-toggle[aria-expanded="true"]{background:rgba(255,169,111,.12);border-color:rgba(255,192,151,.4)}
.orbit-page .menu-panel{top:52px;background:rgba(19,12,9,.96);border-color:rgba(255,196,156,.2);box-shadow:0 18px 50px #0009,inset 0 1px #ffddc410}
.orbit-page .menu-panel a:hover{background:rgba(255,178,124,.1)}
.orbit-page .menu-panel a span{color:#d79e7e}
/* A backdrop filter over the animated fire is recomputed at every frame. These
   surfaces are nearly opaque, or lie over a glow that is already blurred. */
.orbit-page .menu-toggle,.orbit-page .menu-panel,.orbit-page .toast{backdrop-filter:none}
.orbit-page .hub-main{padding-block:0 46px;justify-content:center}
.orbit-hero{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;min-height:clamp(360px,48svh,530px);padding:65px 0 76px}
.orbit-page .hub-main h1{position:relative;margin:0;padding-right:.08em;color:#fff2e8;font-size:clamp(76px,9.5vw,132px);font-weight:600;line-height:1.04;letter-spacing:-.078em;text-shadow:0 2px 30px rgba(255,110,36,.12),0 0 100px rgba(255,133,61,.13)}
.orbit-page .hub-main h1 span{color:#ff995c;text-shadow:0 0 24px #ff6a3659}
.orbit-page .services{width:100%}
.orbit-page .section-line{margin-bottom:17px;color:#d4c5bb}
.orbit-page .section-line h2{font-size:10px;font-weight:550;letter-spacing:.14em;text-transform:uppercase}
.orbit-page .section-line>span{font-size:9px;color:#95847b}
.orbit-page .section-line i{background:rgba(228,184,158,.3);width:30px}
.orbit-page .service-grid{gap:18px}
.orbit-page .service-card{min-height:280px;padding:23px 24px;border-radius:16px;border-color:rgba(232,185,155,.17);background:linear-gradient(125deg,rgba(46,31,23,.34),rgba(15,12,10,.53) 52%,rgba(11,9,8,.7));box-shadow:inset 0 1px rgba(255,224,201,.055),0 12px 40px rgba(0,0,0,.15)}
.orbit-page .service-card::before{background:linear-gradient(130deg,rgba(255,208,170,.035),transparent 42%,transparent 75%,rgba(255,152,93,.018))}
.orbit-page .service-card::after{left:10%;right:36%;background:linear-gradient(90deg,transparent,rgba(255,215,184,.26),transparent)}
.orbit-page .service-card:hover{border-color:rgba(255,174,121,.4);box-shadow:inset 0 1px rgba(255,225,201,.12),0 16px 48px rgba(0,0,0,.34),0 0 35px rgba(255,97,20,.035)}
.orbit-page .card-light{background:radial-gradient(circle,rgba(255,141,66,.12),transparent 68%)}
.orbit-page .card-index{font-size:9px;letter-spacing:.16em;color:#a7978d}
.orbit-page .card-corner{color:#d4bbaa;border-color:rgba(237,191,160,.17);font-size:15px}
.orbit-page .card-symbol{margin-top:17px;width:60px;height:60px}
.orbit-page .card-symbol img,.orbit-page .card-symbol svg{width:54px;height:54px}
.orbit-page .card-content{margin-top:13px}
.orbit-page .card-content strong{font-size:23px;font-weight:550;color:#f6eae2}
.orbit-page .card-bottom{padding-top:24px;color:#a7978c;font-size:10px}
.orbit-page .card-bottom>span:last-child,.orbit-page .copy-button{font-size:9px;font-weight:600;letter-spacing:.09em;color:#d8c5b8}
.orbit-page .card-actions{margin-top:14px}
.orbit-page .card-actions a{gap:9px;padding:8px 10px;border-color:rgba(255,212,183,.16);background:rgba(255,192,147,.035);color:#d7c7bc;font-size:10px}
.orbit-page .card-actions a:hover{background:rgba(255,163,98,.12);border-color:rgba(255,191,146,.4)}
.orbit-page .upcoming-card{background:linear-gradient(135deg,rgba(27,21,16,.45),rgba(9,8,7,.65));border-color:rgba(232,185,155,.13)}
.orbit-page .upcoming-card:hover{transform:none;border-color:rgba(232,185,155,.13);box-shadow:inset 0 1px rgba(255,224,201,.055),0 12px 40px rgba(0,0,0,.15)}
.orbit-page .construction-tape{top:66%;padding:10px 8px;border-color:#e6ae75;background:#bd7b42;color:#201208;font-size:10px;letter-spacing:.16em;box-shadow:0 8px 26px #0008}
.orbit-page .hub-footer{height:66px;color:#8f8179;border-color:rgba(242,204,178,.1);font-size:10px;letter-spacing:.025em}
.orbit-page .toast{border-color:rgba(255,192,150,.25);background:rgba(25,15,9,.96);color:#ffe9d7}
.orbit-page :focus-visible{outline-color:#ffb37b}
/* Let the title area use the space left by the services and navigation. */
@media(min-width:941px){
.orbit-page .hub-header{flex-shrink:0;height:clamp(64px,8.15svh,88px)}
.orbit-page .hub-footer{flex-shrink:0;height:clamp(48px,6.12svh,66px)}
.orbit-page .hub-main{padding-bottom:clamp(20px,4.26svh,46px)}
.orbit-hero{flex:1 0 auto;min-height:0;padding:clamp(16px,3svh,40px) 0}
.orbit-page .hub-main h1{font-size:clamp(64px,min(9.5vw,12.23svh),132px)}
.orbit-page .services{flex-shrink:0}
}
@media(max-width:940px) and (min-width:721px){.orbit-page .wrap{width:calc(100% - 72px)}}
/* La carte à venir devient un bandeau d'une ligne sous les services. */
@media(min-width:721px){.orbit-page .upcoming-card{min-height:0;flex-direction:row;align-items:center;gap:22px}.orbit-page .upcoming-card .card-content{margin-top:0}.orbit-page .upcoming-card .construction-tape{left:34%;width:72%;top:50%;transform:translateY(-50%) rotate(-3deg)}}
@media(max-width:720px){.orbit-page .wrap{width:min(100% - 40px,520px)}.orbit-page .hub-header{height:74px}.orbit-page .header-right{gap:18px}.orbit-page .hub-main{padding-block:0 34px;justify-content:flex-start}.orbit-hero{min-height:clamp(230px,43svh,370px);padding:clamp(30px,8svh,76px) 0}.orbit-page .hub-main h1{font-size:clamp(62px,15vw,100px);margin:0}.orbit-page .service-grid{gap:14px}.orbit-page .service-card{min-height:246px;padding:21px}.orbit-page .server-card{min-height:280px}.orbit-page .upcoming-card{min-height:246px}.orbit-page .construction-tape{top:67%}.orbit-page .hub-footer{min-height:64px}}
@media(min-width:721px) and (max-width:940px) and (max-height:500px){.orbit-hero{min-height:clamp(140px,45svh,230px);padding:24px 0}.orbit-page .hub-main h1{font-size:clamp(54px,16svh,80px)}}
@media(max-width:390px){.orbit-page .hub-main h1{font-size:60px}.orbit-page .wrap{width:calc(100% - 32px)}}
@media(prefers-reduced-motion:reduce){#fire-canvas,.fire-fallback{transition:none}}
/* Phones, in either orientation: no background and no transparency. The fire is
   never rendered there (fire-orbit.js), and each surface takes the opaque colour
   it showed over the page black, so the page looks the same with nothing to blend. */
@media(max-width:720px),(max-width:940px) and (max-height:500px){.cosmos-black,.fire-layer,.frosted-glass,.orbit-page .card-light{display:none}.orbit-page .wordmark-glyph{background:linear-gradient(145deg,#291910,#090403)}.orbit-page .menu-toggle{background:#0c0a09}.orbit-page .menu-toggle:hover,.orbit-page .menu-toggle[aria-expanded="true"]{background:#21160f}.orbit-page .menu-panel{background:#120c09}.orbit-page .menu-panel a:hover{background:#2a1c14}.orbit-page .toast{background:#180e09}.orbit-page .service-card{background:linear-gradient(125deg,#120c09,#090706 52%)}.orbit-page .upcoming-card{background:linear-gradient(135deg,#0e0b08,#070605)}.orbit-page .card-actions a{background:#120e0b}.orbit-page .card-actions a:hover{background:#271a11}}