*{box-sizing:border-box}html,body{margin:0;background:#000;color:#edf9ff;font-family:Arial,Helvetica,sans-serif}body{min-height:100svh;overflow:hidden}.stage{position:relative;width:100vw;height:100svh;overflow:hidden;background:#000}.art{position:absolute;inset:0;background-image:url("assets/Fond Arkonis 2027.jpg");background-repeat:no-repeat;background-size:100% 100%;pointer-events:none}.navigation{position:absolute;inset:0;pointer-events:none}.navbtn{--cyan:#00e8ff;position:absolute;left:calc(var(--x)*100%/1815);top:calc(var(--y)*100%/867);width:calc(var(--w)*100%/1815);height:calc(var(--h)*100%/867);border:0;padding:0;cursor:pointer;color:#effcff;background:transparent;pointer-events:auto;isolation:isolate;filter:drop-shadow(0 0 4px #00c9e8);transition:filter .18s ease}.navbtn:before{content:"";position:absolute;inset:4% 1%;background:linear-gradient(145deg,#00edff 0%,#08769c 17%,#00131c 25%,#001016 75%,#057d99 84%,#00ecff 100%);clip-path:polygon(10% 0,90% 0,100% 35%,91% 100%,9% 100%,0 65%);z-index:-2}.navbtn:after{content:"";position:absolute;inset:14% 5%;background:linear-gradient(155deg,#102f3b 0%,#061015 45%,#01080e 70%,#153441 100%);clip-path:polygon(9% 0,91% 0,100% 34%,91% 100%,9% 100%,0 66%);z-index:-1}.navbtn span{display:flex;align-items:center;justify-content:center;height:100%;padding:0 5%;text-transform:uppercase;white-space:nowrap;font-size:clamp(8px,.72vw,14px);font-weight:700;letter-spacing:.02em;text-shadow:0 0 4px #9ec9d6}.navbtn:hover,.navbtn:focus-visible{filter:drop-shadow(0 0 7px #ff8b78)}.navbtn:hover:before,.navbtn:focus-visible:before{background:linear-gradient(145deg,#ffb29c,#ff745d 19%,#301516 28%,#261012 74%,#ff7d67 87%,#ffc1ae)}.navbtn:hover:after,.navbtn:focus-visible:after{background:linear-gradient(150deg,#42221d,#0f0b0e 55%,#391d21)}.navbtn.active{filter:drop-shadow(0 0 8px #ff36cf)}.navbtn.active:before{background:linear-gradient(145deg,#ff8aee,#ff23c8 19%,#4e0a46 28%,#2b0727 75%,#ff2ccc 88%,#ff9cf2)}.navbtn.active:after{background:linear-gradient(150deg,#3c123b,#140a19 55%,#44103b)}.navbtn:focus-visible{outline:1px solid #fff;outline-offset:2px}.module{position:absolute;left:24%;right:7%;top:32%;bottom:5%;overflow:auto;scrollbar-color:#136579 #03090c;scrollbar-width:thin}.module-inner{min-height:100%;display:grid;place-items:center}.placeholder{text-align:center;opacity:.35;letter-spacing:.2em}.placeholder span{display:block;font-size:clamp(22px,3vw,50px);color:#8bdef7}.placeholder small{display:block;font-size:clamp(9px,.85vw,14px);margin-top:10px;letter-spacing:.12em}@media(max-aspect-ratio: 1/1){body{overflow:auto}.stage{height:100svh;min-height:640px}.art{background-size:auto 100%;background-position:top left}.navigation{inset:0}.navbtn{left:calc(4% + (var(--x) - 816)*.12%);top:calc(195px + (var(--y) - 47)*1px);width:22%;height:46px}.navbtn:nth-child(n+5){top:265px}.navbtn:nth-child(4n+1){left:4%}.navbtn:nth-child(4n+2){left:28%}.navbtn:nth-child(4n+3){left:52%}.navbtn:nth-child(4n+4){left:76%}.navbtn span{font-size:clamp(7px,1.9vw,12px)}.module{top:350px;left:7%;right:7%;bottom:5%}}@media(prefers-reduced-motion:reduce){.navbtn{transition:none}}
/* V2 : aucun cadre opaque autour des boutons ; lien externe uniquement sur action volontaire. */
.navbtn{background:transparent;overflow:visible}
.portfolio-link{display:inline-block;margin-top:28px;color:#59e9ff;text-decoration:none;font-size:clamp(12px,1vw,17px);letter-spacing:.03em;border-bottom:1px solid #168ca4;padding-bottom:5px}
.portfolio-link:hover,.portfolio-link:focus-visible{color:#ff9b8d;border-color:#ff9b8d}

/* V3 : finesse verticale sans modifier largeur ni typographie. */
.navbtn:before{inset:1% 1%}
.navbtn:after{inset:13% 5%}

/* V9 : boutons a 80%, centres et coordonnees V8 conserves ; contours plus nets. */
.navbtn{transform:scale(.8);transform-origin:center center;filter:drop-shadow(0 0 1.5px #00c9e8)}
.navbtn:hover,.navbtn:focus-visible{filter:drop-shadow(0 0 2.5px #ff8b78)}
.navbtn.active{filter:drop-shadow(0 0 3px #ff36cf)}

/* V12 : contenu d'accueil valide, image 1200 x 560 et transition initiale. */
.module-inner{display:flex;align-items:center;justify-content:center;min-height:100%}
.accueil-wrap{position:relative;width:100%;max-width:1200px;aspect-ratio:15/7;flex:none;overflow:hidden}
.accueil-image,.accueil-intro{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.accueil-intro{animation:arkonis-intro 3s ease-in-out forwards;pointer-events:none}
@keyframes arkonis-intro{0%,50%{opacity:1}100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.accueil-intro{animation:none;display:none}}
@media(max-aspect-ratio:1/1){.accueil-wrap{width:100%;flex:none}}

/* V12 : cadre aluminium metallique commun a toutes les rubriques.
   Le contenu reste independant et les images ne sont pas retouchees. */
.module{
  overflow:hidden;
  border:2px solid #aab1b8;
  border-radius:15px;
  background:linear-gradient(160deg,rgba(15,20,29,.86),rgba(1,4,10,.94));
  box-shadow:
    0 0 0 1px rgba(19,24,32,.95),
    0 0 0 3px rgba(210,219,228,.13),
    0 9px 23px rgba(0,0,0,.76),
    0 0 15px rgba(180,201,218,.17),
    inset 0 1px 0 rgba(255,255,255,.65),
    inset 0 -2px 3px rgba(0,0,0,.75);
}
.module::before{
  content:"";position:absolute;z-index:2;pointer-events:none;
  inset:0;border-radius:13px;
  box-shadow:inset 0 1px 0 rgba(250,253,255,.45),inset 1px 0 0 rgba(220,231,240,.16),inset -1px 0 0 rgba(60,67,74,.75);
}
.module-inner{height:100%;min-height:100%;overflow:auto;scrollbar-width:thin;scrollbar-color:#707c86 #101720}
.accueil-wrap{max-width:none;width:100%;height:100%;aspect-ratio:auto;overflow:hidden}
.accueil-image,.accueil-intro{object-fit:fill}
@media(max-aspect-ratio:1/1){.accueil-wrap{width:100%;height:auto;aspect-ratio:15/7}.module-inner{align-items:center}}

/* FIX 3 : introduction hors module, 2 s de lecture + 2 s de fondu. */
.module.module-pending{visibility:hidden}
.intro-overlay{position:absolute;left:24%;right:7%;top:32%;bottom:5%;z-index:5;pointer-events:none;display:flex;align-items:center;justify-content:center;overflow:hidden}
.intro-overlay img{display:block;width:100%;height:100%;object-fit:contain}
.intro-overlay.intro-playing{animation:intro-out-4s 4s linear both}
@keyframes intro-out-4s{0%,50%{opacity:1}100%{opacity:0}}
@media(max-aspect-ratio:1/1){.intro-overlay{top:350px;left:7%;right:7%;bottom:5%}}
@media(prefers-reduced-motion:reduce){.intro-overlay{display:none}}

/* FIX 4 : decalage horizontal de 60 px du module et de son introduction, largeur preservee. */
@media(min-aspect-ratio:1/1){
  .module,.intro-overlay{left:calc(24% - 60px);right:calc(7% + 60px)}
}

/* FIX 5 : centrage horizontal automatique du module et de l'introduction.
   Largeur conservee (69vw), hauteur et animation inchangees. */
@media (min-aspect-ratio: 1/1) {
  .module, .intro-overlay {
    left: 50%;
    right: auto;
    width: 69%;
    transform: translateX(-50%);
  }
}

/* Photographie : visuel valide, lien invisible et accessible. */
.photo-final{position:relative;width:100%;height:100%;overflow:hidden;background:#fff}
.photo-final img{display:block;width:100%;height:100%;object-fit:fill}
.photo-final .photo-book-link{position:absolute;left:41%;top:78%;width:26%;height:13%;z-index:4;display:block;cursor:pointer;border-radius:12px}
.photo-final .photo-book-link:focus-visible{outline:3px solid #008bc7;outline-offset:-3px;background:rgba(0,153,255,.08)}

/* V16 : module Synthology, PNG valide intact et zone PDF interactive. */
.synthology-final{position:relative;width:100%;height:100%;overflow:hidden;background:#030819}
.synthology-final img{display:block;width:100%;height:100%;object-fit:fill}
.synthology-final .synthology-pdf-link{position:absolute;left:66.6%;top:77.5%;width:31.8%;height:16.1%;z-index:4;display:block;cursor:pointer;border-radius:12px}
.synthology-final .synthology-pdf-link:focus-visible{outline:3px solid #00bdfc;outline-offset:-3px;background:rgba(0,153,255,.09)}

/* Ajustement demande : remonter le module de 38 px, sans modifier sa hauteur. */
.module{top:calc(32% - 38px);bottom:calc(5% + 38px)}
@media(max-aspect-ratio:1/1){.module{top:312px;bottom:calc(5% + 38px)}}

/* V18 : le PNG Photoshop fourni est immuable ; seuls les champs du cadre vide sont HTML. */
.contact-final{position:relative;width:100%;height:100%;overflow:hidden;background:#020b1c;container-type:inline-size}
.contact-image{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}
.contact-form-v18{position:absolute;left:60.1%;top:27.5%;width:36.3%;height:54.7%;display:flex;flex-direction:column;gap:1.4cqw;font-family:Arial,Helvetica,sans-serif;color:#eef7ff;font-size:1.18cqw;line-height:1.2}
.cf-field{display:flex;flex-direction:column;gap:.65cqw;min-width:0}
.cf-field label{font-size:1.13cqw;font-weight:600;text-shadow:0 1px 2px #000}
.cf-field select,.cf-field input,.cf-field textarea{width:100%;min-width:0;border:1px solid #4a8cc6;border-radius:.45cqw;background:rgba(3,23,49,.94);color:#f2f8ff;font:inherit;outline-offset:2px;padding:.7cqw .9cqw}
.cf-field :is(select,input,textarea):focus-visible{outline:2px solid #26d8ff}
.cf-field :is(input,textarea)::placeholder{color:#94abc9}
.cf-field select{height:3.9cqw;cursor:pointer}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:1.25cqw}
.cf-row input{height:3.6cqw}
.cf-message{flex:1;min-height:0}
.cf-message textarea{flex:1;min-height:4cqw;resize:none;padding-top:.8cqw}
.cf-footer{display:flex;align-items:center;justify-content:flex-end;gap:.8cqw;min-height:5.1cqw}
.cf-send{flex:none;min-height:4.6cqw;min-width:22.5cqw;padding:.7cqw 1.4cqw;border:1px solid #aeeaff;border-radius:.8cqw;color:#fff;font-size:1.23cqw;font-weight:700;white-space:nowrap;cursor:pointer;background:linear-gradient(110deg,#01385d,#041331 55%,#4e075b);box-shadow:0 0 .8cqw #04aef7,inset 0 0 .8cqw #126db7, .35cqw .15cqw 1cqw #d317d5;text-shadow:0 0 .5cqw #8ac9ff}
.cf-send:hover,.cf-send:focus-visible{border-color:#fff;box-shadow:0 0 1.4cqw #00baff,0 0 1.3cqw #ed39df}
.cf-send:disabled{opacity:.6;cursor:wait}
.cf-plane{font-size:1.75cqw;color:#bdeaff;margin-right:.6cqw}
.cf-status{flex:1;font-size:1cqw;color:#a4f6ff;overflow-wrap:anywhere}
.cf-other[hidden]{display:none}
.contact-form-v18.has-other{gap:.8cqw}
.contact-form-v18.has-other .cf-field{gap:.3cqw}
.contact-form-v18.has-other .cf-field select{height:3.1cqw}
.contact-form-v18.has-other .cf-row input{height:3.1cqw}
.contact-form-v18.has-other .cf-footer{min-height:4.4cqw}
.contact-form-v18.has-other .cf-send{min-height:3.9cqw}
.cf-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
/* Zones invisibles sur les trois icônes déjà présentes dans le PNG validé. */
.cf-social-link,.cf-mail-link{position:absolute;display:block;z-index:3;border-radius:10%;background:transparent}
.cf-social-link:focus-visible,.cf-mail-link:focus-visible{outline:2px solid #1de7ff;outline-offset:1px}
.contact-fb{left:32.9%;top:85.1%;width:5.4%;height:10.7%}
.contact-yt{left:41.5%;top:85.1%;width:5.4%;height:10.7%}
.contact-ig{left:50.2%;top:85.1%;width:5.4%;height:10.7%}
.cf-mail-link{left:62.8%;top:87.5%;width:26%;height:8.2%}

/* Galerie publique ARKONIS — V19 prototype, isolée des autres rubriques */
.ag-gallery{width:100%;height:100%;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;position:relative;background:radial-gradient(ellipse at 50% 75%,#1b2e42 0%,#09121f 50%,#03070d 100%);color:#eaf8ff}
.ag-heading{font-size:clamp(16px,2vw,30px);font-weight:bold;letter-spacing:.2em;text-shadow:0 0 14px #1acbff;margin:0 0 5px}.ag-heading span{color:#ff66d7}.ag-hint{font-size:clamp(9px,.9vw,13px);color:#a5bfcb;letter-spacing:.08em}
.ag-viewport{width:100%;height:73%;position:relative;overflow:hidden;perspective:1000px;outline:none;touch-action:pan-y;cursor:default}.ag-viewport:focus-visible{outline:2px solid #00dfff;outline-offset:-4px}
.ag-flow{position:absolute;inset:0;transform-style:preserve-3d}.ag-card{position:absolute;left:50%;top:50%;height:72%;max-height:285px;border:1px solid #8ab4c8;border-radius:7px;background:#080e16;padding:5px;box-shadow:0 13px 23px #000b,0 0 10px #009dc04a;cursor:pointer;transform-style:preserve-3d;transition:box-shadow .2s,border-color .2s;overflow:hidden;backface-visibility:visible}.ag-card img{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none}.ag-card.ag-selected{border-color:#ff75d7;box-shadow:0 0 23px #ff45c18a,0 20px 35px #000b}.ag-card:hover{border-color:#fff}.ag-counter{font-size:12px;color:#b8c7d2;letter-spacing:.15em}
.ag-lightbox{position:absolute;inset:0;z-index:50;background:rgba(0,4,12,.86);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:12px;box-sizing:border-box}.ag-lightbox img{display:block;max-width:min(1600px,100%);max-height:min(900px,100%);width:auto;height:auto;object-fit:contain;cursor:zoom-out;box-shadow:0 10px 45px #000}.ag-lightbox p{margin:0;font-size:13px;color:#fff;text-align:center;max-width:90%}
@media(max-width:700px){.ag-heading{letter-spacing:.08em}.ag-card{padding:3px}.ag-viewport{height:75%}}
@media(prefers-reduced-motion:reduce){.ag-card{transition:none}}

/* V19 Fix3 : navigation uniquement par fleches, sans suivi de souris */
.ag-gallery,.ag-gallery *{-webkit-user-select:none;user-select:none}
.ag-nav{position:absolute;top:50%;transform:translateY(-50%);z-index:120;width:46px;height:64px;border:1px solid #43c8f0;border-radius:9px;background:rgba(3,15,29,.85);color:#c9f7ff;font-size:30px;line-height:1;cursor:pointer;box-shadow:0 0 14px #04aaf04d;transition:background .15s,box-shadow .15s}
.ag-nav:hover,.ag-nav:focus-visible{background:rgba(10,68,105,.95);box-shadow:0 0 20px #08c9ff88;outline:none}
.ag-nav-prev{left:12px}.ag-nav-next{right:12px}
@media(max-width:700px){.ag-nav{width:33px;height:49px;font-size:22px}.ag-nav-prev{left:4px}.ag-nav-next{right:4px}}

/* V19 Fix4 : titre argent satine, cartes +35 %, carousel circulaire. */
.ag-heading{font-size:clamp(15px,1.65vw,26px);font-weight:600;letter-spacing:.035em;text-transform:none;text-align:center;line-height:1.3;background:linear-gradient(180deg,#ffffff 0%,#c8d0d8 30%,#737e8b 58%,#d8e0e7 82%,#929da9 100%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 2px 12px rgba(172,191,210,.13);margin:0 16px 3px;flex-shrink:0}
.ag-viewport{height:82%;}
.ag-card{height:90%;max-height:385px;}
@media(max-width:700px){.ag-heading{font-size:clamp(13px,3vw,18px);}.ag-card{max-height:300px}}

/* Studio : la maquette approuvée est un PNG intact, les boutons sont invisibles. */
.studio-final{width:100%;height:100%;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}
.studio-image{width:100%;height:100%;object-fit:contain;display:block;pointer-events:none;user-select:none}
/* Les coordonnées des zones suivent l'image complète, format 3:2. */
.studio-hotspot{position:absolute;border:0;padding:0;margin:0;background:transparent;cursor:zoom-in;z-index:2}
.studio-hotspot:focus-visible{outline:2px solid #32eaff;outline-offset:-3px}
.studio-lightbox{position:fixed;inset:0;z-index:10000;background:rgba(0,3,12,.94);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;padding:30px 16px 16px;box-sizing:border-box}
.studio-lightbox img{max-width:min(1600px,96vw);max-height:calc(100vh - 105px);width:auto;height:auto;object-fit:contain;box-shadow:0 0 32px #000;cursor:zoom-out}
.studio-lightbox p{margin:0;color:#e5f8ff;font-size:14px;text-align:center}
.studio-close{position:absolute;top:10px;right:18px;border:1px solid #44dfff;border-radius:6px;background:#091b2c;color:#fff;font-size:32px;width:46px;height:44px;cursor:pointer}

.studio-final{height:auto;max-height:100%;aspect-ratio:3/2}
.studio-image{width:100%;height:100%;object-fit:fill}

/* PARTENAIRES — ajout isolé V19 Fix4 */
.partners{box-sizing:border-box;width:100%;height:100%;overflow:auto;position:relative;padding:2.2% 4% 3%;font-family:Arial,sans-serif;color:#e9f7ff;text-align:center;background:linear-gradient(120deg,rgba(0,11,32,.88),rgba(1,24,55,.79) 54%,rgba(1,8,29,.9)),url('assets/Fond Arkonis 2027.jpg') center/cover;border:1px solid #297bb3;border-radius:10px;box-shadow:inset 0 0 28px #001427;scrollbar-width:thin;scrollbar-color:#1a8ac1 #031023}
.partners:before{content:'';position:absolute;inset:0;pointer-events:none;opacity:.25;background:repeating-linear-gradient(135deg,transparent 0 70px,#087cc122 72px 75px,transparent 77px 170px)}
.partners>*{position:relative}.partners-head h1{margin:0;color:#e4f7ff;font-size:clamp(20px,2vw,36px);letter-spacing:.09em;font-weight:500;text-shadow:0 0 12px #087dc2}.partners-head h1:first-letter{color:#fa83b5}.partners-head p{margin:7px 0 11px;color:#7dd9f5;letter-spacing:.18em;font-size:clamp(8px,.75vw,13px)}
.partners-intro{max-width:970px;margin:auto}.partners-intro p{margin:5px 0;line-height:1.3;font-size:clamp(10px,.83vw,14px)}.partners-thanks{color:#ff9dbd;font-weight:bold!important}
.partners-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5%;margin:14px 0 12px}.partners-card{min-width:0;border:1px solid #2479ae;border-radius:8px;background:linear-gradient(145deg,#061a33d9,#061020e6);padding:8px 6px 5px;box-shadow:inset 0 0 15px #0a315c}.partners-logo{height:83px;display:flex;align-items:center;justify-content:center}.partners-logo img{max-width:96%;max-height:80px;object-fit:contain}.partners-card h2{margin:2px 0;color:#99cce5;font-size:clamp(10px,.76vw,13px);font-weight:400}
.partners-invite{border-top:1px solid #176a9d;padding-top:9px;max-width:980px;margin:auto}.partners-invite h2{margin:0 0 7px;font-size:clamp(13px,1.1vw,20px);letter-spacing:.07em;color:#8ce6ff;font-weight:500}.partners-invite p{font-size:clamp(10px,.8vw,14px);line-height:1.3;margin:5px 0}.partners-invite strong{color:#46dcff}.partners-signature{font-size:clamp(24px,2.5vw,42px);font-family:cursive;font-style:italic;color:#e9f9ff;text-shadow:0 0 9px #2bc6ff;margin-top:4px}
@media(max-width:750px){.partners{padding:12px}.partners-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.partners-logo{height:66px}.partners-logo img{max-height:63px}}


/* Partenaires : visuel approuvé 900x560, affichage intégral sans défilement. */
.module-inner:has(.partners-final){overflow:hidden;min-height:0}
.partners-final{position:relative;width:100%;height:100%;overflow:hidden;background:#031425}
.partners-final-image{display:block;width:100%;height:100%;object-fit:fill;pointer-events:none}
.partners-final-link{position:absolute;z-index:5;display:block;border-radius:9px;cursor:pointer;transition:background .15s ease,box-shadow .15s ease}
.partners-final-link:hover,.partners-final-link:focus-visible{background:rgba(255,116,94,.32);box-shadow:inset 0 0 0 2px #ff9b88,0 0 15px #ff776e,0 0 5px #ff8c80;outline:none}
