/* ===== LINGUI PROD - Application (PWA) =====
   Navigation en onglets, feuille d'installation, partage, transitions.
   La barre d'onglets n'apparaît que dans l'application installée, sur smartphone et tablette. */
:root{--lp-tab-h:62px;}

/* Transitions douces entre les pages (navigateurs compatibles), désactivées si l'utilisateur limite les animations */
@media (prefers-reduced-motion: no-preference){
  @view-transition{navigation:auto;}
  ::view-transition-old(root),::view-transition-new(root){animation-duration:.22s;}
}

/* Bords d'écran (encoche, coins arrondis) */
html body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);}

/* --- Barre d'onglets (application installée) --- */
.lp-tabbar{display:none;}
@media (max-width:900px){
  html.lp-app .lp-tabbar{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:9000;
    background:rgba(10,10,10,0.94);-webkit-backdrop-filter:saturate(140%) blur(16px);backdrop-filter:saturate(140%) blur(16px);
    border-top:1px solid rgba(240,124,21,0.28);padding:6px max(6px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left));}
  html.lp-app body{padding-bottom:calc(var(--lp-tab-h) + env(safe-area-inset-bottom)) !important;}
  html.lp-app .lp-jump{bottom:calc(var(--lp-tab-h) + 18px + env(safe-area-inset-bottom)) !important;}
  html.lp-app .lp-dock{bottom:calc(var(--lp-tab-h) + env(safe-area-inset-bottom));padding-bottom:0;}
  html.lp-app footer{padding-bottom:96px !important;}
}
.lp-tab{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-height:48px;padding:4px 2px;
  color:rgba(248,245,239,0.6);background:none;border:0;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;
  font:700 8.5px/1 Montserrat,system-ui,sans-serif;letter-spacing:1.3px;text-transform:uppercase;transition:color .2s ease;}
.lp-tab svg{width:22px;height:22px;}
.lp-tab[aria-current="page"]{color:#F07C15;}
.lp-tab:active{transform:scale(.94);}

/* --- Barre « Télécharger l'app » (dégradé), sous les boutons « Menu » et « Contactez-nous » --- */
html.lp-has-dl body nav[style*="position:sticky"]{padding-bottom:var(--lp-dl-pb) !important;}
.lp-dl{position:absolute;z-index:2;display:flex;align-items:center;justify-content:center;gap:9px;height:40px;padding:0 12px;margin:0;border:0;cursor:pointer;
  color:#0b0b0b;font:800 10.5px/1 Montserrat,system-ui,sans-serif;letter-spacing:3px;text-transform:uppercase;overflow:hidden;
  background:linear-gradient(90deg,#E5194C 0%,#F2542D 38%,#F7941D 72%,#FBC02D 100%);box-shadow:0 8px 22px -10px rgba(242,84,45,0.75);
  -webkit-tap-highlight-color:transparent;transition:transform .2s ease,filter .2s ease;}
.lp-dl svg{width:16px;height:16px;flex:0 0 auto;}
.lp-dl:hover{filter:brightness(1.06);}
.lp-dl:active{transform:scale(.98);}
.lp-dl:focus-visible{outline:2px solid #F8F5EF;outline-offset:2px;}
.lp-dl::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;background:linear-gradient(100deg,transparent,rgba(255,255,255,0.45),transparent);transform:skewX(-18deg);}
@media (prefers-reduced-motion: no-preference){.lp-dl::after{animation:lpShine 4.5s ease-in-out 1.2s infinite;}}
@keyframes lpShine{0%{left:-40%;}35%,100%{left:120%;}}
html.lp-app .lp-dl{display:none !important;}
@media (max-width:380px){.lp-dl{letter-spacing:2px;font-size:10px;}}

/* --- Feuille d'installation iPhone / iPad --- */
.lp-sheet{position:fixed;inset:0;z-index:10000;display:flex;align-items:flex-end;justify-content:center;background:rgba(0,0,0,0.6);}
.lp-sheet[hidden]{display:none;}
.lp-sheet-box{width:100%;max-width:460px;background:#0e0e0e;border-top:2px solid #F07C15;padding:26px 24px calc(26px + env(safe-area-inset-bottom));
  color:#F8F5EF;font-family:Montserrat,system-ui,sans-serif;animation:lpSheetIn .25s ease-out;}
@keyframes lpSheetIn{from{transform:translateY(30px);opacity:0;}to{transform:none;opacity:1;}}
.lp-sheet-box h2{font-size:18px;font-weight:600;margin:0 0 6px;}
.lp-sheet-box h2 em{color:#F07C15;font-weight:400;}
.lp-sheet-box p{font-size:13px;line-height:1.7;color:rgba(248,245,239,0.65);margin:0 0 16px;}
.lp-sheet-box ol{margin:0 0 22px;padding:0;list-style:none;counter-reset:s;}
.lp-sheet-box li{counter-increment:s;display:flex;align-items:center;gap:12px;font-size:14px;line-height:1.5;padding:10px 0;border-bottom:1px solid rgba(255,255,255,0.07);}
.lp-sheet-box li::before{content:counter(s);flex:0 0 26px;height:26px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(240,124,21,0.6);color:#F07C15;font-size:11px;font-weight:800;}
.lp-sheet-box li svg{width:18px;height:18px;vertical-align:-3px;color:#F07C15;}
.lp-sheet-close{width:100%;background:#F07C15;color:#080808;border:0;padding:15px;font:800 11px/1 Montserrat,system-ui,sans-serif;letter-spacing:3px;text-transform:uppercase;cursor:pointer;}

/* --- Partage --- */
.lpi-share{background:none;border:0;padding:0;margin:0;cursor:pointer;font:inherit;}
.lp-toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom));transform:translate(-50%,20px);z-index:10001;opacity:0;pointer-events:none;
  background:#141414;color:#F8F5EF;border:1px solid rgba(240,124,21,0.45);padding:12px 18px;font:600 12px/1.4 Montserrat,system-ui,sans-serif;letter-spacing:.4px;
  transition:opacity .25s ease,transform .25s ease;max-width:calc(100vw - 40px);text-align:center;}
.lp-toast.is-on{opacity:1;transform:translate(-50%,0);}
html.lp-app .lp-toast{bottom:calc(var(--lp-tab-h) + 16px + env(safe-area-inset-bottom));}
@media (max-width:900px){
  /* lecteur de podcast ouvert : flèches au-dessus du lecteur (et non par-dessus) */
  html.lp-app body.lp-has-dock .lp-jump,html.lp-app body.lp-dock-open .lp-jump{bottom:calc(var(--lp-tab-h) + 136px + env(safe-area-inset-bottom)) !important;}
  html.lp-app body.lp-has-dock{padding-bottom:calc(var(--lp-tab-h) + 150px + env(safe-area-inset-bottom)) !important;}
}
/* Site web : flèches au-dessus du lecteur de podcast dès son ouverture (avant, seulement après un défilement) */
html body.lp-has-dock .lp-jump,html body.lp-dock-open .lp-jump{bottom:calc(136px + env(safe-area-inset-bottom));}

/* ===== v3 - En-tête unifié : un seul dégradé continu sur « Menu », « Contactez-nous » et « Télécharger l'app » ===== */
:root{--lp-g:linear-gradient(90deg,#E5194C 0%,#F2542D 38%,#F7941D 72%,#FBC02D 100%);--lp-gw:100%;}
/* Contactez-nous : plein dégradé */
html body nav[style*="position:sticky"] > div > a[href^="mailto"]{
  background:var(--lp-g) !important;background-image:var(--lp-g) !important;background-size:var(--lp-gw) 100% !important;
  background-position:calc(-1 * var(--lp-gx-c,0px)) 0 !important;background-repeat:no-repeat !important;
  color:#0b0b0b !important;-webkit-text-fill-color:#0b0b0b !important;border:0 !important;box-shadow:none !important;}
/* Menu : même dégradé en contour fin, fond transparent */
html body nav[style*="position:sticky"] > div > button{
  border:1px solid transparent !important;color:#F8F5EF !important;
  background:linear-gradient(rgba(10,10,10,0.92),rgba(10,10,10,0.92)) padding-box,var(--lp-g) border-box !important;
  background-size:100% 100%,var(--lp-gw) 100% !important;background-position:0 0,calc(-1 * var(--lp-gx-m,0px)) 0 !important;background-repeat:no-repeat !important;}
html body nav[style*="position:sticky"] > div > button:hover{color:#FBC02D !important;}
/* Télécharger l'app : même dégradé, sans halo (plus épuré) */
.lp-dl{background:var(--lp-g) !important;background-size:var(--lp-gw) 100% !important;box-shadow:none !important;}

/* Menu déroulant : verre fumé transparent, filet dégradé en haut (sélecteurs renforcés : priorité sur refresh.css) */
html body #mobile-menu#mobile-menu{background:rgba(14,14,14,0.55) !important;-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);
  border:1px solid rgba(255,255,255,0.12) !important;box-shadow:0 24px 60px rgba(0,0,0,0.55) !important;}
html body #mobile-menu#mobile-menu::before{content:"";position:absolute;top:-1px;left:-1px;right:-1px;height:2px;background:var(--lp-g);pointer-events:none;}
html body #mobile-menu#mobile-menu .menu-item{background:rgba(255,255,255,0.035) !important;border:1px solid rgba(255,255,255,0.09) !important;color:#F8F5EF !important;box-shadow:none !important;}
html body #mobile-menu#mobile-menu .menu-item:hover,html body #mobile-menu#mobile-menu .menu-item:focus-visible{background:rgba(255,255,255,0.08) !important;border-color:rgba(247,148,29,0.55) !important;color:#FBC02D !important;}
html body #mobile-menu#mobile-menu .menu-item[aria-current="page"]{color:#F7941D !important;border-color:rgba(255,255,255,0.14) !important;
  background:linear-gradient(90deg,#E5194C,#F2542D 38%,#F7941D 72%,#FBC02D) center bottom / 100% 2px no-repeat,rgba(255,255,255,0.06) !important;}
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){html body #mobile-menu#mobile-menu{background:rgba(14,14,14,0.96) !important;}}

/* Smartphone et application : logo en haut à droite, même hauteur que la colonne de boutons */
html.lp-logo-al body nav[style*="position:sticky"]{align-items:flex-start !important;}
html.lp-logo-al body nav[style*="position:sticky"] a img.lp-logo-img{margin-top:var(--lp-logo-mt,0px) !important;display:block;}
/* Pendant l'écran d'entrée : rien d'autre à l'écran */
html.lpx-on .lp-tabbar,html.lpx-on .lp-dl{display:none !important;}

/* ===== v4 - En-tête et menu : orange #F07C15 (comme « Voir les interviews »), fonds transparents ===== */
html body nav[style*="position:sticky"] > div > button,
html body nav[style*="position:sticky"] > div > a[href^="mailto"]{
  background:transparent !important;background-image:none !important;border:1px solid #F07C15 !important;
  color:#F07C15 !important;-webkit-text-fill-color:#F07C15 !important;box-shadow:none !important;}
html body nav[style*="position:sticky"] > div > button:hover,
html body nav[style*="position:sticky"] > div > a[href^="mailto"]:hover{background:rgba(240,124,21,0.10) !important;color:#F7941D !important;-webkit-text-fill-color:#F7941D !important;}
/* Menu déroulant : grand cadre au contour orange, transparent ; pas de cases, seulement les textes en orange */
html body #mobile-menu#mobile-menu{background:rgba(10,10,10,0.6) !important;border:1px solid #F07C15 !important;box-shadow:0 24px 60px rgba(0,0,0,0.5) !important;padding:10px 12px !important;}
html body #mobile-menu#mobile-menu::before{content:none !important;}
html body #mobile-menu#mobile-menu > .menu-links{gap:2px !important;}
html body #mobile-menu#mobile-menu .menu-item{background:transparent !important;border:0 !important;box-shadow:none !important;color:#F07C15 !important;padding:13px 10px !important;}
html body #mobile-menu#mobile-menu .menu-item:hover,html body #mobile-menu#mobile-menu .menu-item:focus-visible{background:transparent !important;color:#F6A317 !important;}
html body #mobile-menu#mobile-menu .menu-item[aria-current="page"]{background:transparent !important;color:#F07C15 !important;text-decoration:underline !important;text-decoration-thickness:1px !important;text-underline-offset:6px !important;}

/* ===== Pied de page identique partout : logo centré, « © 2026 Lingui Prod | Toulouse … » dessous (comme sur mobile) ===== */
@media (min-width:769px){
  html body footer{flex-direction:column !important;align-items:center !important;justify-content:center !important;text-align:center !important;gap:16px !important;padding:36px 40px 40px !important;}
  html body footer .f-logo{justify-content:center !important;width:100%;}
  html body footer small{text-align:center !important;}
  html body footer .f-links{justify-content:center !important;flex-wrap:wrap !important;overflow:visible !important;row-gap:10px;max-width:1100px;}
  html body footer > div:last-child{justify-content:center !important;}
}
html body nav[style*="position:sticky"] > div > button,html body nav[style*="position:sticky"] > div > a[href^="mailto"]{white-space:nowrap !important;}
html.lp-logo-al body nav[style*="position:sticky"] > div{flex-shrink:0 !important;}

/* ===== v5 ===== */
/* « Télécharger l'app » : orange plein, comme « Voir les interviews » */
.lp-dl,html body nav .lp-dl{background:#F07C15 !important;background-image:none !important;color:#080808 !important;box-shadow:none !important;}
.lp-dl::after{content:none !important;animation:none !important;}
.lp-dl:hover{filter:none;background:#F28A2E !important;}

/* Écran d'entrée de l'application : plus court et plus fluide */
#lpx.is-fast.is-go .lpx-logo{animation-duration:.5s !important;}
#lpx.is-fast.is-go{animation-duration:.32s !important;animation-delay:.18s !important;}
#lpx.is-fast.is-go .lpx-cta,#lpx.is-fast.is-go .lpx-skip{animation-duration:.18s !important;}

/* Menu déroulant : entrée animée, éléments qui apparaissent en cascade, surbrillance au survol / au clavier */
html body #mobile-menu#mobile-menu{background:radial-gradient(120% 70% at 50% 0%,rgba(240,124,21,0.10),rgba(10,10,10,0) 60%),rgba(10,10,10,0.72) !important;
  border:1px solid rgba(240,124,21,0.85) !important;padding:10px !important;transform-origin:top center;}
html body #mobile-menu#mobile-menu.open{animation:lpMenuPop .32s cubic-bezier(.2,.9,.25,1) both !important;}
@keyframes lpMenuPop{from{opacity:0;transform:translateY(-10px) scaleY(.94);}to{opacity:1;transform:none;}}
html body #mobile-menu#mobile-menu > .menu-links{gap:3px !important;}
html body #mobile-menu#mobile-menu .menu-item{position:relative;overflow:hidden;border-radius:0 !important;text-decoration:none !important;
  color:#F07C15 !important;padding:14px 12px !important;transition:color .2s ease,background-color .25s ease,letter-spacing .25s ease,transform .25s ease !important;}
html body #mobile-menu#mobile-menu .menu-item::before{content:"" !important;position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(240,124,21,0) 0%,rgba(240,124,21,0.26) 50%,rgba(240,124,21,0) 100%);
  transform:scaleX(0);transition:transform .35s cubic-bezier(.2,.9,.25,1);}
html body #mobile-menu#mobile-menu .menu-item::after{content:"→" !important;position:absolute;right:14px;top:50%;transform:translate(-8px,-50%);opacity:0;
  color:#F6A317;font-weight:800;letter-spacing:0;transition:opacity .25s ease,transform .25s ease;}
html body #mobile-menu#mobile-menu .menu-item:hover,html body #mobile-menu#mobile-menu .menu-item:focus-visible,html body #mobile-menu#mobile-menu .menu-item.is-hl{
  color:#FFB24D !important;background:rgba(240,124,21,0.10) !important;letter-spacing:2.9px !important;outline:none !important;}
html body #mobile-menu#mobile-menu .menu-item:hover::before,html body #mobile-menu#mobile-menu .menu-item:focus-visible::before,html body #mobile-menu#mobile-menu .menu-item.is-hl::before{transform:scaleX(1);}
html body #mobile-menu#mobile-menu .menu-item:hover::after,html body #mobile-menu#mobile-menu .menu-item:focus-visible::after,html body #mobile-menu#mobile-menu .menu-item.is-hl::after{opacity:1;transform:translate(0,-50%);}
html body #mobile-menu#mobile-menu .menu-item[aria-current="page"]{text-decoration:none !important;background:rgba(240,124,21,0.07) !important;color:#F6A317 !important;}
html body #mobile-menu#mobile-menu .menu-item:active{transform:scale(.98);}
html body #mobile-menu#mobile-menu.open .menu-item{animation:lpItemIn .38s cubic-bezier(.2,.9,.25,1) both;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(1){animation-delay:0.03s;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(2){animation-delay:0.06s;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(3){animation-delay:0.09s;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(4){animation-delay:0.12s;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(5){animation-delay:0.15s;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(6){animation-delay:0.18s;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(7){animation-delay:0.21s;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(8){animation-delay:0.24s;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(9){animation-delay:0.27s;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(10){animation-delay:0.30s;}
html body #mobile-menu#mobile-menu.open .menu-item:nth-child(11){animation-delay:0.33s;}
@keyframes lpItemIn{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion: reduce){html body #mobile-menu#mobile-menu.open,html body #mobile-menu#mobile-menu.open .menu-item{animation:none !important;}}
