/* TYPOGRAPHIE — Satoshi variable, fichiers locaux (normal et italique). */
@font-face{font-family:Satoshi;src:url('/assets/Satoshi-Variable.woff2') format('woff2');font-weight:300 900;font-style:normal;font-display:swap}
@font-face{font-family:Satoshi;src:url('/assets/Satoshi-VariableItalic.woff2') format('woff2');font-weight:300 900;font-style:italic;font-display:swap}
/*
 SITE PUBLIC — /site/styles/main.css
 REPÈRES : rechercher GROUPE pour localiser un ensemble de règles.
 Les sélecteurs sous chaque repère indiquent les éléments concernés.
 RESPONSIVE indique les adaptations selon la largeur de la fenêtre.
 L’ordre des règles est conservé : une règle plus bas peut préciser une règle précédente.
 Les commentaires sont informatifs et ne changent pas le rendu.
*/

/* GROUPE THEME — Variables globales : couleurs, dimensions, espacements et variantes jour/nuit. */
/* Site motion is explicitly enabled independently of the OS preference. */

    :root{color-scheme:dark;--bg:#080808;--fg:#eee9e2;--muted:#aaa39b;--accent:#cc7d32;--line:#38332f}
*{box-sizing:border-box}
html{scroll-behavior:smooth}

/* GROUPE TYPOGRAPHIE — Polices, titres et texte courant. */
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.6 Satoshi,Arial,sans-serif}
a{color:inherit;text-decoration:none}
a:hover,a:focus-visible{color:var(--accent)}

/* GROUPE CONTROLES — Boutons, champs, formulaires et états interactifs. */
button,input,textarea,select{font:inherit}
button{cursor:pointer}
::selection{background:var(--accent);color:#080808}

/* GROUPE NAVIGATION — Menus, choix du site, logo et navigation principale. */
header{position:fixed;z-index:20;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:20px calc(5vw + max(0px, (100vw - 1320px)/2));background:linear-gradient(#080808f2,#080808b0);backdrop-filter:blur(16px);border-bottom:1px solid #ffffff18}
.brand{display:block;width:133px;line-height:0}
.brand img{display:block;width:100%;height:auto}
nav{display:flex;align-items:center;gap:2rem;text-transform:uppercase;font-size:.72rem;letter-spacing:.16em}
nav .nav-book{border:1px solid var(--accent);padding:10px 15px;color:var(--accent);transition:background-color .2s ease,color .2s ease}
nav .nav-book:hover,nav .nav-book:focus-visible{background:var(--accent);color:#080808}
.menu-toggle{display:none}

/* GROUPE ACCUEIL PUBLIC — Premier écran du site public, logo et introduction. */
.hero{min-height:100svh;position:relative;display:flex;align-items:end;padding:130px 0 7%;overflow:hidden;background:radial-gradient(ellipse 65% 65% at 72% 45%,#5a2d1470 0%,#27170e34 45%,transparent 78%),linear-gradient(135deg,#090909 25%,#17110e 75%,#090909)}
.hero:before{content:"";position:absolute;width:58vw;height:58vw;max-width:850px;max-height:850px;border:1px solid #cc7d323e;border-radius:50%;right:-6vw;top:5%;box-shadow:0 0 0 8vw #cc7d3207,0 0 0 16vw #cc7d3205;transform:translateY(calc(var(--scroll,0px)*-.13))}
.hero:after{content:"";position:absolute;inset:0;opacity:.12;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.25'/%3E%3C/svg%3E")}
.hero-content{position:relative;z-index:1;width:100%;max-width:1320px;margin:auto;padding:0 5%;top:-150px}
.eyebrow{color:var(--accent);font-size:.76rem;text-transform:uppercase;letter-spacing:.25em;font-weight:700}
.hero h1{margin:4vw 0 3vw;line-height:0}
.hero-logo{display:block;width:65%;height:auto}
.hero-line{display:flex;align-items:end;justify-content:space-between;gap:2rem}
.hero p{max-width:480px;color:#d1c7bb;font-size:clamp(1.15rem,2vw,1.65rem);line-height:1.35;margin:0}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:13px 22px;border:1px solid var(--accent);color:#080808;background:var(--accent);font-weight:700;white-space:nowrap}
.btn:hover,.btn:focus-visible{background:#e79a50;color:#080808}
.btn.ghost{background:transparent;color:var(--accent)}
.btn.ghost:hover{background:#cc7d3222}
.scrollcue{display:block;margin-top:8vh;color:#aa9e92;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase}
.wrap{max-width:1320px;margin:auto;padding:0 5%}
.section{padding:120px 0;border-top:1px solid var(--line)}

/* GROUPE ENTETE — Titre de section et commandes langue, site public et thème. */
.section-title{display:flex;flex-direction:column;align-items:flex-start;gap:16px;margin-bottom:17.5px}
.index{color:var(--accent);letter-spacing:.2em;font-size:.75rem}
.section h2{font-size:clamp(2.8rem,7vw,7rem);letter-spacing:-.065em;line-height:1;margin:0}
.intro{max-width:100%;font-size:clamp(1.2rem,2vw,1.75rem);line-height:1.45;color:#d6cec5}
.muted{color:var(--muted)}

/* GROUPE MUSIQUE — Tracks, sorties, archives et lecteurs SoundCloud. */
.music-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:50px 0 30px}
.set-card{background:#151311;border:1px solid #36302b;min-height:390px;padding:24px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;transition:transform .3s,border-color .3s}
.set-card:hover{transform:translateY(-6px);border-color:var(--accent)}
.set-card:before{content:"";position:absolute;width:270px;height:270px;top:13%;left:calc(50% - 135px);border:1px solid #b66f2c88;border-radius:50%;box-shadow:0 0 0 24px #cc7d3210,0 0 0 65px #cc7d3208}
.set-card:nth-child(2):before{border-radius:32%;transform:rotate(33deg)}
.set-card:nth-child(3):before{width:190px;height:190px;left:calc(50% - 95px);box-shadow:0 0 45px #a3562d52,0 0 0 65px #cc7d3208}
.set-card>*{position:relative}
.set-card small{color:var(--accent);letter-spacing:.14em;text-transform:uppercase}
.set-card h3{font-size:1.65rem;line-height:1.1;margin:0 0 10px}
.set-card p{color:var(--muted);margin:0}
.set-card .listen{border-top:1px solid var(--line);padding-top:16px;color:var(--accent);font-size:.82rem;text-transform:uppercase;letter-spacing:.12em}
.links-row{display:flex;gap:30px;flex-wrap:wrap}
.text-link{color:var(--accent);border-bottom:1px solid var(--accent);padding-bottom:4px}
.archive{background:#12100f}
.archive-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:8%;align-items:center}
.archive h2{margin:16px 0 17.5px}
.archive .intro{margin:0 0 30px}
.archive-list{padding:0;list-style:none;border-top:1px solid var(--line)}
.archive-list li{padding:18px 0;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;gap:20px}
.archive-list span{color:var(--accent)}
.archive-list .archive-list-heading{color:var(--accent);font-weight:700}
.archive-list li:not(.archive-list-heading){justify-content:flex-start}
.archive-list li:not(.archive-list-heading)::before{content:"↗";color:var(--accent);margin-left:5px;margin-right:0;flex:0 0 auto}
.note{font-size:.82rem;color:var(--muted);margin-top:18px}

/* GROUPE ARTISTE — Présentation de l’artiste, photos et citations. */
.about-layout{display:grid;grid-template-columns:1fr 1fr;gap:10%;align-items:start}
.about-layout p{font-size:1.15rem;color:#c8c0b8;margin-top:0}
.big-quote{font-size:clamp(2rem,4vw,4rem);letter-spacing:-.05em;line-height:1.15;color:var(--accent)}

/* GROUPE BOOKING — Réservation, formulaire et documents techniques. */
.booking{background:#080808}
.booking-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:9%;align-items:start}
.riders{display:flex;flex-direction:column;margin:45px 0 0;border-top:1px solid var(--line)}
.riders a{display:flex;justify-content:space-between;padding:18px 0;border-bottom:1px solid var(--line);color:var(--accent)}
form{border:1px solid #44352a;background:#191512;padding:32px}
form h3{margin:0 0 22px;font-size:1.5rem}
label{display:block;font-size:.82rem;color:#d5c8b8;margin-bottom:17px}
input,textarea,select{display:block;width:100%;margin-top:7px;padding:12px 13px;min-height:48px;background:#0d0c0b;border:1px solid #554438;border-radius:0;color:var(--fg)}
textarea{min-height:105px;resize:vertical}
input:focus,textarea:focus,select:focus{outline:2px solid var(--accent);outline-offset:2px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-note{font-size:.8rem;color:var(--muted)}
.prototype{color:#a69788;font-size:.78rem;margin-top:20px}

/* GROUPE PIED DE PAGE — Liens sociaux, langues, signature et pied de page. */
.connect{padding:100px 0 35px;background:#12100f}
.connect > .wrap > .index{display:block;margin-bottom:8px;text-align:left}
.connect h2{margin:0 0 30px}
.connect-links{display:flex;flex-wrap:wrap;gap:12px 35px}
.connect-links a{color:var(--accent);border-bottom:1px solid var(--accent)}
footer{margin-top:110px;padding-top:20px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;color:var(--muted);font-size:.8rem}

/* GROUPE ANIMATIONS — Animations, transitions et séquences de chargement. */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s,transform .7s}
.reveal.visible{opacity:1;transform:none}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){header{padding:16px 5vw}nav{gap:1rem}header nav a:not(.nav-book){display:none}.hero{padding:110px 0 8%}.brand{width:94.5px}.hero h1{margin:9vw 0 8vw}.hero-line{display:block}.hero-actions{margin-top:35px}.music-grid{grid-template-columns:1fr}.set-card{min-height:270px}.archive-layout,.about-layout,.booking-grid{grid-template-columns:1fr;gap:50px}.section{padding:85px 0}.form-row{grid-template-columns:1fr}form{padding:22px}}
.hero-photo{position:absolute;z-index:0;right:0;top:0;width:100%;height:100%;object-fit:cover;object-position:center 46%;transform:translateY(calc(var(--scroll,0px)*-.09)) scale(1.07);transform-origin:center}
.hero:before{z-index:1;inset:0;width:auto;height:auto;max-width:none;max-height:none;border:0;border-radius:0;box-shadow:none;right:0;top:0;transform:none;background:linear-gradient(90deg,#080808e8 0%,#080808b0 34%,#08080862 68%,#08080844 100%),linear-gradient(0deg,#080808e8 0%,transparent 55%)}
.hero:after{z-index:1}
.hero-content{z-index:2}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.hero-photo{width:100%;object-position:58% 48%;opacity:.9}.hero:before{background:linear-gradient(90deg,#080808c9,#08080823 90%),linear-gradient(0deg,#080808f5 0%,#08080877 48%,#08080863 100%)}}
.music-grid{display:flex;gap:16px;max-width:100%;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin:50px 0 0}
.music-grid::-webkit-scrollbar{display:none}
.music-grid:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.music-grid .set-card{flex:0 0 calc((100% - 48px)/4);min-width:0;scroll-snap-align:start;scroll-snap-stop:always}
.music-controls{margin-top:22px;gap:20px;flex-wrap:wrap}
.music-controls .gallery-nav{margin-left:auto;flex-shrink:0}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.music-grid .set-card{flex-basis:85%}}
.release-tracks{display:flex!important;grid-template-columns:none!important;gap:16px;max-width:100%;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch;margin:50px 0 0!important}
.release-tracks::-webkit-scrollbar{display:none}
.release-tracks:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.release-tracks .release-track{flex:0 0 calc((100% - 48px)/4);min-width:0;scroll-snap-align:start;scroll-snap-stop:always}
.release-controls{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;margin-top:22px;gap:20px;flex-wrap:wrap}
.release-controls .gallery-nav{margin-left:auto;flex-shrink:0}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.release-tracks .release-track{flex-basis:85%}}
#soundcloud-modal{position:fixed;z-index:100;inset:0;width:auto;max-width:none;padding:24px 16px;border:0;border-radius:0;background:rgba(0,0,0,.72);color:#171717;overflow:auto;box-shadow:none;place-items:center}
#soundcloud-modal:not([hidden]){display:grid}
#soundcloud-modal[hidden]{display:none}
.soundcloud-panel{position:relative;width:min(960px,calc(100vw - 32px));background:#f2f2f2;border-radius:9px;box-shadow:0 20px 90px #0009}
.hero p{color:#fff}
.hero-actions{margin-top:10px;margin-bottom:10px}
.hero h1{margin-bottom:clamp(20px,3vw,45px)}
.hero-line{display:flex;flex-direction:column;align-items:flex-start;gap:24px}
.hero-actions{justify-content:flex-start}
.hero-actions .btn.ghost{background:rgba(0,0,0,.4);color:#f0ae6b;border-color:#e69a4c}
.hero-actions .btn.ghost:hover{background:#cc7d32;color:#080808}
.hero-line p{font-size:clamp(2.536rem,3.502vw,3.381rem);max-width:760px;line-height:1.23;text-shadow:0 1px 9px #000}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.hero h1{margin-bottom:22px}.hero-line{display:flex;gap:22px}.hero-actions{margin-top:10px;margin-bottom:10px}.hero-actions .btn{min-height:48px}.hero-line p{font-size:2.536rem}}
.releases{margin-top:0;padding:0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:8%;align-items:end}
.releases h2{font-size:clamp(2.9rem,6.6vw,6.4rem);line-height:.95;letter-spacing:-.065em;margin:25px 0 0;font-style:normal}
.section h2 em,.about-layout em{font-style:normal;color:var(--accent)}
.releases-body{max-width:470px}
.releases-body p{font-size:clamp(1.15rem,1.8vw,1.6rem);line-height:1.4;color:#d9d1c8;margin:0 0 30px}
.release-link{display:flex;align-items:center;justify-content:space-between;gap:35px;color:var(--accent);border-top:1px solid #78502e;border-bottom:1px solid #78502e;padding:15px 0;font-weight:700}
.release-link span{font-size:1.4rem;line-height:1}
.release-link:hover{color:#f1aa63}
.releases-body small{display:block;color:var(--muted);margin-top:18px;font-size:.82rem}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.releases{grid-template-columns:1fr;gap:35px;margin-top:0;padding:0}.releases h2{margin-top:15px}.releases-body p{font-size:1.2rem}}
.releases{grid-template-columns:1fr 1fr}
.releases-body{align-self:end}
.release-tracks{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:15px}
.release-track{min-width:0;background:#151311;border:1px solid var(--line);padding:13px}
.release-cover{display:block;aspect-ratio:1;overflow:hidden;background:#221b15}
.release-cover img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.release-cover:hover img{transform:scale(1.04)}
.release-track-name{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:16px 3px 12px}
.release-track-name h4{margin:0;font-size:1.3rem;line-height:1.25}
.release-track-name h4 span{display:block;font-size:.75rem;font-weight:400;color:var(--muted)}
.release-track-name a{font-size:1.3rem;color:var(--accent)}
.release-track iframe{display:block;background:#f5f5f5}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.release-tracks{grid-template-columns:1fr;gap:22px}.release-track{max-width:500px}}
.player-slot{min-height:105px;border-top:1px solid var(--line);padding:12px 3px 3px}
.player-launch{display:flex;align-items:center;gap:14px;width:100%;min-height:51px;padding:11px 14px;background:#2b211a;color:var(--accent);border:1px solid #8b592f;text-align:left;font-weight:700}
.player-launch[hidden]{display:none}
.player-launch:hover,.player-launch:focus-visible{background:var(--accent);color:#080808}
.player-fallback{display:inline-block;color:var(--muted);font-size:.78rem;margin-top:10px;border-bottom:1px solid #63594e}
.player-fallback:hover{color:var(--accent)}
.release-track iframe{background:transparent}
.release-track iframe[hidden]{display:none}
button.release-cover{width:100%;padding:0;border:0;cursor:pointer}
.release-cover:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.player-slot{min-height:0;padding-bottom:0}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
html.soundcloud-open{overflow:hidden}
#soundcloud-player-modal{position:fixed;z-index:120;inset:0;display:grid;place-items:center;padding:24px;background:#000b;backdrop-filter:blur(8px)}
#soundcloud-player-modal[hidden]{display:none}
.soundcloud-card{position:relative;width:min(720px,calc(100vw - 32px));padding:14px;background:#11100f;border:1px solid #79502f;box-shadow:0 24px 90px #000}
.soundcloud-card iframe{display:block;width:100%;height:166px;border:0;background:#11100f}
.soundcloud-unavailable{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:92px;padding:20px;border-top:1px solid var(--line);color:#d6cec5}
.soundcloud-unavailable p{margin:0}
.soundcloud-unavailable a{flex:0 0 auto;color:var(--accent);border-bottom:1px solid var(--accent)}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){.soundcloud-unavailable{align-items:flex-start;flex-direction:column}}
.soundcloud-dock-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin:0 0 10px;color:var(--accent)}
.soundcloud-dock-title{margin:0;max-width:calc(100% - 50px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.soundcloud-close{width:30px;height:30px;border:1px solid #ffffff40;border-radius:50%;background:transparent;color:white;font-size:21px;line-height:1}
.soundcloud-close:hover{background:var(--accent);color:#080808}
.release-listen{display:inline-block;font-size:1rem;font-weight:400;margin:4px 0 8px}
.player-slot{border-top:0;padding:8px 3px 3px}
.release-tracks{grid-template-columns:repeat(4,minmax(0,1fr))}

/* RESPONSIVE — @media(max-width:1000px) */
@media(max-width:1000px){.release-tracks{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){.release-tracks{grid-template-columns:1fr}}
.music-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.set-card{min-height:0;padding:0;display:flex;flex-direction:column;background:#151311}
.set-card:before{display:none}
.set-cover{display:block;width:100%;aspect-ratio:1;padding:0;border:0;background:#211c18;line-height:0;overflow:hidden}
.set-cover img{display:block;width:100%;height:100%;aspect-ratio:1;object-fit:cover;transition:transform .35s}
.set-cover:hover img,.set-cover:focus-visible img{transform:scale(1.04)}
.set-info{display:flex;flex:1;flex-direction:column;padding:20px 18px 18px}
.set-info small{font-size:.72rem;line-height:1.4;letter-spacing:.1em}
.set-title{margin:12px 0 0}
.set-title h3{font-size:clamp(1.05rem,1.55vw,1.42rem);line-height:1.25;margin:0;letter-spacing:-.025em}
.set-actions{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:13px}
.set-card .listen{border:0;padding:0;text-transform:none;letter-spacing:0;font-size:1rem}

/* RESPONSIVE — @media(max-width:1000px) */
@media(max-width:1000px){.music-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){.music-grid{grid-template-columns:1fr}.set-title h3{font-size:1.35rem}}
.release-tracks{gap:16px}
.release-track{padding:0;display:flex;flex-direction:column;overflow:hidden}
.release-track-name{padding:20px 18px 0;align-items:flex-start}
.release-track .player-slot{margin-top:auto;padding:13px 18px 18px}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.release-track{max-width:none}}
.release-cover:focus-visible img{transform:scale(1.04)}
.release-links{grid-column:1/-1;margin-top:30px}
.releases{row-gap:0;border-bottom:0}
.release-cover img{height:auto;aspect-ratio:1;object-fit:cover;transition:transform .35s}
.release-cover:hover img,.release-cover:focus-visible img{transform:scale(1.04)}
section[id]{scroll-margin-top:80px}
.releases-section{border-top:0;padding:40px 0 90px}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.releases-section{padding:35px 0 85px}}

/* RESPONSIVE — @media(min-width:801px) and (max-width:980px) */
@media(min-width:801px) and (max-width:980px){nav{gap:1rem}}
/* Alternate the existing charcoal backgrounds between page sections. */
    #music,.archive,#photos,.connect{background:#080808}
.releases-section,#about,.booking{background:#12100f}
.hero:before{background:linear-gradient(90deg,#080808c9,#08080823 90%),linear-gradient(0deg,#080808 0%,#080808e8 12%,#0808089c 40%,#08080863 100%)}
.hero:after{-webkit-mask-image:linear-gradient(#000 0%,#000 72%,transparent 100%);mask-image:linear-gradient(#000 0%,#000 72%,transparent 100%)}
#music{border-top:0}
.releases-section{padding:120px 0}
.releases{display:block}
.releases .section-title{align-items:flex-start}
.releases .section-title .index{margin:0;text-align:left}
.releases .section-title h2{font-size:clamp(2.8rem,7vw,7rem);line-height:1;letter-spacing:-.065em;margin:0}
.releases .intro{max-width:100%;font-size:clamp(1.2rem,2vw,1.75rem);line-height:1.45;color:#d6cec5;margin:0}
.releases .release-tracks{margin:50px 0 30px}
.releases .release-links{margin-top:0}
.release-listen{color:var(--accent);border:0;margin:0}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.releases-section{padding:85px 0}}
#music .section-title,#booking .section-title,#about .section-title{align-items:flex-start}
#music .section-title .index,#booking .section-title .index,#about .section-title .index{margin:0;text-align:left}
#photos .section-title{align-items:flex-start}
#photos .section-title .index{margin:0;text-align:left}

/* GROUPE VIDEOS — Cartes vidéo, lecture et fenêtre vidéo. */
#videos{background:#12100f}
#videos .section-title{align-items:flex-start}
#videos .section-title .index{margin:0;text-align:left}
.video-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.video-track::-webkit-scrollbar{display:none}
.video-card{position:relative;flex:0 0 calc((100% - 48px)/4);min-width:0;aspect-ratio:9/16;padding:0;border:1px solid #36302b;background:#151311;overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always;color:#fff;text-align:left}
.video-card img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .35s}
.video-card:hover img,.video-card:focus-visible img{transform:scale(1.04)}
.video-card:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 50%,#000b)}
.video-play{position:absolute;z-index:1;left:50%;top:50%;transform:translate(-50%,-50%);display:grid;place-items:center;width:58px;height:58px;border:1px solid #ffffffb0;border-radius:50%;background:#080808a8;font-size:1.4rem;transition:background .2s,color .2s}
.video-card:hover .video-play,.video-card:focus-visible .video-play{background:var(--accent);color:#080808}
.video-caption{position:absolute;z-index:1;left:18px;right:18px;bottom:18px;font-size:.88rem;line-height:1.35;text-shadow:0 2px 10px #000}
.video-controls{display:flex;justify-content:space-between;align-items:center;margin-top:22px}
.video-modal{border:0;padding:10px;background:#111;color:var(--fg);max-width:calc(100vw - 24px);max-height:min(1500px,calc(100dvh - 24px));overflow:visible;box-shadow:0 28px 90px #000c}
.video-modal::backdrop{background:rgba(0,0,0,.9);backdrop-filter:blur(5px)}
.video-modal iframe{display:block;width:min(420px,calc(100vw - 44px));height:min(740px,1500px,calc(100dvh - 58px));max-height:1500px;aspect-ratio:9/16;border:0;background:#000}
.video-modal-close{position:absolute;top:-39px;right:0;width:36px;height:36px;border:1px solid #ffffff70;border-radius:50%;background:#111;color:#fff;font-size:1.5rem}
.video-modal-close:hover{background:var(--accent);color:#080808}
.video-source{display:block;margin-top:10px;color:var(--accent);font-size:.78rem}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.video-card{flex-basis:calc((100% - 16px)/2)}}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){.video-card{flex-basis:85%}.video-modal iframe{height:min(700px,calc(100dvh - 70px))}}

/* GROUPE PHOTOS — Galerie photo, navigation et visionneuse. */
.gallery-controls{display:flex;align-items:center;justify-content:flex-end;margin-top:22px}
.gallery-nav{display:flex;gap:8px}
.gallery-nav button{display:grid;place-items:center;width:46px;height:46px;background:transparent;border:1px solid #6a4a2e;color:var(--accent);font-size:1.35rem;line-height:1;transition:background .2s,color .2s}
.gallery-nav button:hover,.gallery-nav button:focus-visible{background:var(--accent);color:#080808}
.gallery-nav button:disabled{opacity:.35;cursor:default}
.gallery-track{display:flex;gap:16px;max-width:100%;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.gallery-track::-webkit-scrollbar{display:none}
.gallery-track:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.gallery-info-card,.gallery-slide{position:relative;display:block;flex:0 0 calc((100% - 48px)/4);min-width:0;aspect-ratio:1;padding:0;border:1px solid #36302b;background:#151311;overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always;cursor:zoom-in;text-align:left}
/* Photos avec description : même cellule du carrousel, commande info superposée. */
.gallery-info-card>.gallery-slide{width:100%;height:100%;border:0}
.gallery-info-card>.track-info-button{position:absolute;right:15px;bottom:15px;z-index:2}
.gallery-slide img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s}
.gallery-slide:hover img,.gallery-slide:focus-visible img{transform:scale(1.04)}
.gallery-slide span{position:absolute;left:18px;bottom:15px;color:#fff;font-size:.7rem;letter-spacing:.18em;text-shadow:0 2px 8px #000}
.gallery-note{margin:16px 0 0;color:var(--muted);font-size:.78rem}
html.gallery-open{overflow:hidden}
.gallery-modal{width:min(1120px,calc(100vw - 64px));max-width:none;max-height:min(1500px,calc(100dvh - 60px));padding:10px 10px 14px;border:0;background:#111;overflow:visible;color:var(--fg);box-shadow:0 28px 90px #000c}
.gallery-modal::backdrop{background:rgba(0,0,0,.9);backdrop-filter:blur(5px)}
.gallery-modal img{display:block;max-width:100%;max-height:min(1200px,calc(100dvh - 130px));width:auto;height:auto;margin:auto;object-fit:contain;box-shadow:0 20px 50px #0009}
.gallery-modal-close{position:absolute;top:-45px;right:0;width:36px;height:36px;border:1px solid #ffffff70;border-radius:50%;background:#111;color:white;font-size:1.5rem;line-height:1}
.gallery-modal-step{position:absolute;top:50%;transform:translateY(-50%);width:42px;height:52px;border:1px solid #ffffff70;background:#080808b8;color:white;font-size:1.7rem;line-height:1}
.gallery-modal-prev{left:12px}
.gallery-modal-next{right:12px}
.gallery-modal-close:hover,.gallery-modal-step:hover{background:var(--accent);color:#080808}
.gallery-modal-count{margin:11px 0 0;text-align:center;color:#cfc5b8;font-size:.75rem;letter-spacing:.18em}

/* RESPONSIVE — @media(max-width:1000px) */
@media(max-width:1000px){.gallery-info-card,.gallery-slide{flex-basis:calc((100% - 16px)/2)}}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){.gallery-info-card,.gallery-slide{flex-basis:100%}.gallery-modal{width:calc(100vw - 24px);padding:6px 6px 12px}.gallery-modal-step{width:35px;height:44px}.gallery-modal-prev{left:7px}.gallery-modal-next{right:7px}}
#about > .wrap > .about-welcome{font-size:calc(1.15rem + 6px);font-weight:400;line-height:1.6}

#booking .riders{width:70%}
#booking .riders a{padding:9px 0}
#booking .booking-grid > .reveal .intro{width:70%;max-width:none}
.gallery-intro{margin:0 0 45px;font-size:1.15rem;font-weight:400}

/* RESPONSIVE — @media(min-width:801px) */
@media(min-width:801px){.about-layout > .reveal:first-child{width:calc(100% + 80px)}}
.hero h1{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hero-content{top:100px}
.hero-line{gap:0}
.hero-line > .eyebrow{position:relative;top:-25px}
.hero-line p{margin:0 0 40px;max-width:1180px}
.hero-line .hero-actions{margin:25px 0 0;position:relative;top:100px}
.about-layout .big-quote{font-size:0;min-height:0;aspect-ratio:1;background:none;color:transparent}
.about-photo{display:block;width:100%;justify-self:end;padding:0;border:0;border-radius:0;cursor:zoom-in;text-align:left}
.about-photo{order:-1;justify-self:start}

/* RESPONSIVE — @media(min-width:801px) */
@media(min-width:801px){.about-layout{grid-template-columns:1.0625fr 1fr;gap:50px;align-items:start}.about-layout > .reveal:first-child{grid-column:1;grid-row:1;width:100%;min-width:0;overflow-wrap:break-word}.about-layout .about-photo{grid-column:2;grid-row:1;align-self:start}}
.about-photo img{display:block;width:100%;height:100%;object-fit:cover}
.about-photo:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
#music > .wrap > .intro,.releases .intro,.archive .intro{font-size:1.15rem}
.archive .intro{width:80%;max-width:560px}

/* RESPONSIVE — @media(min-width:801px) */
@media(min-width:801px){#booking .riders,#booking .booking-grid > .reveal .intro{width:calc(70% + 55px)}}

/* RESPONSIVE — @media(min-width:801px) */
@media(min-width:801px){#booking .booking-grid{grid-template-columns:.8fr 1.2fr;gap:6%}}

/* RESPONSIVE — @media(min-width:801px) */
@media(min-width:801px){#booking form{width:calc(100% + 80px);margin-left:-80px}}

/* RESPONSIVE — @media(min-width:801px) */
@media(min-width:801px){#booking form{width:calc(100% + 114px);margin-left:-114px}}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){#booking .riders,#booking .booking-grid > .reveal .intro,.archive .intro{width:100%}}
.archive-list{border-top:0;position:relative;top:32px}
.archive-list{transform:translateX(-111px)}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.archive-list{transform:none}}
.archive-list .archive-list-heading{justify-content:flex-start;font-size:1.25em}
.archive-list li{position:relative;padding-left:40px}
.archive-list .archive-list-heading::before{content:"➜";position:absolute;left:0;color:#fff;margin:0;font-size:1.15em;font-weight:800;line-height:1.35}
.archive-list li:not(.archive-list-heading)::before{position:absolute;left:5px;margin:0}
.archive-list .streaming-apps{align-items:center;flex-wrap:wrap;column-gap:6px}
.archive-list .platform-icons{display:inline-flex;align-items:center;gap:10px;margin-left:8px;color:#fff;line-height:0}
.platform-icons svg{display:block;width:20px;height:20px;fill:currentColor}
.social-icons{display:flex;flex-wrap:wrap;min-width:0;max-width:100%;align-items:center;gap:20px;margin-top:32px}
.social-icons a{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:29px;height:29px;color:#fff;transition:color .2s ease,transform .2s ease}
.social-icons svg{display:block;width:100%;height:100%;fill:currentColor}
.social-icons a:hover,.social-icons a:focus-visible{color:var(--accent);transform:translateY(-2px)}
.social-icons a:focus-visible{outline:1px solid currentColor;outline-offset:5px}
.scrollcue{transform:translateY(150px)}
#booking-form button:disabled{cursor:wait;opacity:.65}
#booking-form .form-note:not([hidden]){margin:18px 0 0;color:#d6cec5}
#booking-form [name="_honey"]{display:none!important}

/* RESPONSIVE — @media(min-width:801px) and (max-width:1180px) */
@media(min-width:801px) and (max-width:1180px){
      .archive-list{width:calc(100% + 87px);margin-left:24px}
      .about-layout .about-photo{width:105%}
      #booking .booking-grid{grid-template-columns:1fr;gap:38px}
      #booking form{width:100%;margin-left:0;min-width:0}
      #booking .riders,#booking .booking-grid > .reveal .intro{width:100%}
    }
.archive-layout{position:relative}
.archive-layout > .reveal:first-child > .index{display:block;text-align:left}
.archive .section-title h2{margin:0}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){
      html,body{max-width:100%;overflow-x:hidden}
      body{padding-bottom:64px}
      header{padding:14px 5vw;min-height:64px;backdrop-filter:none}
      header nav{position:fixed;z-index:30;left:0;right:0;bottom:0;display:flex;gap:0;overflow-x:auto;overscroll-behavior-x:contain;background:#080808f5;border-top:1px solid var(--line);box-shadow:0 -8px 30px #0008;scrollbar-width:none}
      header nav::-webkit-scrollbar{display:none}
      header nav a,header nav a:not(.nav-book){display:flex!important;flex:0 0 auto;align-items:center;justify-content:center;min-height:58px;padding:0 16px;border:0;border-right:1px solid #ffffff12;font-size:.68rem;letter-spacing:.13em}
      header nav .nav-book{color:var(--accent);background:#17110e}
      .hero{min-height:100dvh;padding:90px 0 40px}
      .hero-content{top:0;padding-inline:5vw}
      .hero-line p{font-size:clamp(2rem,10vw,2.75rem);line-height:1.14;margin-bottom:30px}
      .hero-line .hero-actions{width:100%;gap:10px;margin-top:22px}
      .hero-actions .btn{flex:1 1 190px;white-space:normal;text-align:center}
      .scrollcue{margin-top:50px;transform:none}
      .section{padding:76px 0}
      .wrap{padding-inline:5vw}
      .section-title{align-items:flex-start;flex-direction:column;gap:18px;margin-bottom:8px}
      .section-title .index,#photos .section-title .index,#videos .section-title .index{margin:0;text-align:left}
      .section h2{font-size:clamp(3.25rem,18vw,5.25rem);line-height:.92}
      .intro,#music > .wrap > .intro,.releases .intro,.archive .intro,.gallery-intro{font-size:1.05rem;line-height:1.5;max-width:100%}
      .archive-layout,.about-layout,.booking-grid{gap:38px}
      .archive-layout > .reveal:first-child > .index{position:static;display:block;margin-bottom:18px;text-align:left}
      .archive-list{width:100%}
      .about-photo{width:100%;max-width:620px}
      .about-layout > .reveal:first-child{min-width:0}
      .video-controls,.music-controls,.release-controls{align-items:flex-start;gap:18px}
      .gallery-nav button{width:48px;height:48px}
      #booking form{width:100%;margin-left:0;padding:22px}
      #booking .riders,#booking .booking-grid > .reveal .intro{width:100%}
      .connect{padding-top:76px}
      .connect-links{gap:18px 24px}
      .connect-links a{min-height:44px;display:inline-flex;align-items:center}
      footer{flex-direction:column;margin-top:70px;padding-bottom:20px}
      .gallery-modal-close,.video-modal-close{top:8px;right:8px;z-index:4;background:#080808e8}
      .gallery-modal img{max-height:min(1200px,calc(100dvh - 110px))}
      .video-modal{padding-top:54px}
      .video-modal iframe{max-height:calc(100dvh - 130px)}
      .soundcloud-card{width:calc(100vw - 24px)}
      section,.hero{scroll-margin-top:64px}
      .gallery-track,.video-track,.music-grid,.release-tracks{touch-action:pan-x pan-y}
      a,button,input,textarea,select{-webkit-tap-highlight-color:#cc7d3240}
    }

/* RESPONSIVE — @media(max-width:420px) */
@media(max-width:420px){
      header nav a,header nav a:not(.nav-book){padding-inline:13px;font-size:.63rem}
      .hero-line p{font-size:clamp(1.8rem,9.5vw,2.35rem)}
      .section h2{font-size:clamp(3rem,17vw,4.4rem)}
      .form-row{grid-template-columns:1fr}
      .gallery-info-card,.gallery-slide{flex-basis:92%}
      .video-card{flex-basis:82%}
      .links-row{gap:18px}
    }
#connect > .wrap{display:grid;grid-template-columns:1fr auto;column-gap:32px;row-gap:15px;align-items:center}
#connect > .wrap > .index{grid-column:1/-1;margin-bottom:0}
#connect .social-icons{grid-column:1;grid-row:2;margin-top:0}
#connect .connect-links{grid-column:2;grid-row:2;justify-content:flex-end}
#connect footer{grid-column:1/-1;margin-top:0}

/* RESPONSIVE — @media(max-width:1180px) */
@media(max-width:1180px){#connect > .wrap{grid-template-columns:1fr}#connect .connect-links{grid-column:1;grid-row:3;justify-content:flex-start}}
.about-layout p.about-sound{color:var(--accent);font-weight:400}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){
      header nav{display:grid;grid-template-columns:.85fr 1.05fr 1.05fr .8fr 1.5fr;overflow-x:visible;width:100%}
      header nav a[href="#photos"],header nav a[href="#videos"]{display:none!important}
      header nav a,header nav a:not(.nav-book){min-width:0;padding-inline:3px;font-size:clamp(.5rem,2.2vw,.63rem);letter-spacing:.06em;white-space:nowrap}
    }

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){.hero-line > .eyebrow{margin-bottom:24px}}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){
      main{padding-block:5px}
      .wrap,.hero-content{padding-inline:calc(5vw + 5px)}
    }

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){#booking textarea{min-height:210px}}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){#connect .connect-links{display:grid;grid-template-columns:max-content max-content;gap:6px 20px;justify-items:start}}
.section h2 .title-line{position:relative;left:calc(.0325em - var(--title-inset))}
.gallery-intro strong{font-size:inherit;font-weight:inherit}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){#connect footer{gap:5px}}
.action-arrow{display:inline-block;transition:transform .2s ease;flex-shrink:0}

/* RESPONSIVE — @media(hover:hover) */
@media(hover:hover){a:hover .action-arrow,button:not(:disabled):hover .action-arrow{transform:translate(3px,-3px)}}
a:focus-visible .action-arrow,button:not(:disabled):focus-visible .action-arrow{transform:translate(3px,-3px)}
.section-title + .intro{margin-top:0}
.archive-list li:not(.archive-list-heading){padding-top:9px;padding-bottom:9px}

/* Hero eyebrow — shared tablet/desktop positioning. */
@media(min-width:601px){.hero-line > .eyebrow{top:-25px}}
#music .music-grid{margin-top:45px}
.releases .release-tracks{margin-top:45px!important}
.archive .intro{margin-bottom:35px}
#photos .gallery-intro,#videos .gallery-intro{margin-bottom:40px}
#booking .riders{margin-top:40px}

/* RESPONSIVE — @media(min-width:601px) and (max-width:1180px) */
@media(min-width:601px) and (max-width:1180px){
      .release-tracks,.music-grid{align-items:flex-start}
      .release-track .player-slot,.set-actions{margin-top:0}
    }
:is(a,button):has(.action-arrow){transition:color .2s ease,background-color .2s ease,border-color .2s ease,filter .2s ease}

/* RESPONSIVE — @media(hover:hover) */
@media(hover:hover){
      :is(a,button):has(.action-arrow):not(:disabled):hover{color:#f5b574;border-color:#f5b574}
      .btn:has(.action-arrow):not(.ghost):not(:disabled):hover{background:#e79a50;color:#080808;border-color:#e79a50}
      .hero-actions .btn.ghost:has(.action-arrow):hover,header nav .nav-book:has(.action-arrow):hover{background:#e79a50;color:#080808;border-color:#e79a50}
    }
:is(a,button):has(.action-arrow):focus-visible{outline:2px solid #f5b574;outline-offset:4px}

/* RESPONSIVE — @media(hover:hover) */
@media(hover:hover){:is(a.listen,a.release-listen):has(.action-arrow):hover{color:#dc934d;border-color:#dc934d}}

/* RESPONSIVE — @media(hover:hover) */
@media(hover:hover){a[href*="youtube.com"]:has(.action-arrow):hover{color:#dc934d;border-color:#dc934d}}

/* RESPONSIVE — @media(min-width:1181px), (min-width:801px) and (hover:hover) and (pointer:fine) */
@media(min-width:1181px), (min-width:801px) and (hover:hover) and (pointer:fine){.hero-line p{line-height:calc(1.23em - 5px)}}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.archive h2{margin-bottom:8px}}
.music-controls,.release-controls{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:18px;margin-top:22px}
.music-controls > .links-row,.release-controls > .links-row{min-width:0;margin:0;grid-column:1}
.music-controls > .gallery-nav,.release-controls > .gallery-nav{margin:0;justify-self:end;align-self:center}
.music-grid,.release-tracks,.gallery-track,.video-track{overflow-y:hidden}
#booking-form .form-note:not([hidden]){margin-bottom:10px}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){.hero-line .hero-actions{top:0;margin-top:122px}.hero .scrollcue{margin-top:30px}}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){
      .hero{min-height:calc(100svh - 64px);padding-bottom:80px}
      .hero-content{position:static}
      .hero-line{position:relative;z-index:2}
      .hero .scrollcue{position:absolute;z-index:2;bottom:20px;left:calc(5vw + 5px);margin:0}
    }

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){.hero-line > .eyebrow{top:-20px}}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){.archive-layout{row-gap:8px}.archive-list{top:0}}
.section{padding-bottom:100px}
.about-layout > .reveal > p:last-child{margin-bottom:0}
.archive-list{margin-bottom:0}
.archive-layout > .reveal:last-child{padding-bottom:32px}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.section{padding-bottom:56px}}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){.archive-layout > .reveal:last-child{padding-bottom:0}}


/* RESPONSIVE — @media(max-width:800px) */


/* RESPONSIVE — @media (min-width:0px)  */
/* Desert Atmosphere: short, eased movement; no layout or scroll interception. */
@media (min-width:0px) {
  .section-title.reveal { transform:none; }
  .section-title.reveal .title-line { display:inline-block; opacity:0; transform:translateY(22px); transition:opacity .8s ease,transform .9s cubic-bezier(.2,.7,.2,1); }
  .section-title.reveal.visible .title-line { opacity:1; transform:translateY(0); }
  .section-title.reveal em.title-line { transition-delay:.12s; }
}

/* RESPONSIVE — @media (hover:hover) and (pointer:fine) and (min-width:0px)  */
@media (hover:hover) and (pointer:fine) and (min-width:0px) {
  .hero-photo { transform:translate3d(var(--motion-x,0px),calc(var(--motion-y,0px) + var(--scroll,0px)*-.09),0) scale(1.07); transition:transform .65s cubic-bezier(.2,.7,.2,1); }
  .hero-logo { transform:translate3d(calc(var(--motion-x,0px)*-.45),calc(var(--motion-y,0px)*-.45),0); transition:transform 1.4s cubic-bezier(.2,.7,.2,1); }
  .set-cover,.release-cover { position:relative; transform:perspective(900px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transition:transform .5s cubic-bezier(.2,.7,.2,1); }
  .set-cover::after,.release-cover::after { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at var(--light-x,50%) var(--light-y,50%),#ffe0b92b,transparent 65%); opacity:0; transition:opacity .4s; }
  .set-cover.motion-active::after,.release-cover.motion-active::after { opacity:1; }
}
/* Keep clear hover/focus feedback even when spatial motion is disabled. */
.set-cover:hover img,.set-cover:focus-visible img,
:is(.release-cover,.about-photo):hover img,:is(.release-cover,.about-photo):focus-visible img { filter:brightness(1.15) saturate(1.06); }

/* RESPONSIVE — @media (min-width:0px)  */
@media (min-width:0px) {
  .set-cover:hover img,.set-cover:focus-visible img,
  :is(.release-cover,.about-photo):hover img,:is(.release-cover,.about-photo):focus-visible img { transform:scale(1.07); }
}
/* Loading fades affect opacity only, leaving hover zoom and tilt independent. */
@keyframes cover-soft-load { from { opacity:0; } to { opacity:1; } }

/* RESPONSIVE — @media (min-width:0px)  */
@media (min-width:0px) {
  .set-cover img.cover-loading,:is(.release-cover,.about-photo) img.cover-loading,
  .set-cover img.cover-loaded:not(.cover-in-view),
  :is(.release-cover,.about-photo) img.cover-loaded:not(.cover-in-view) { opacity:0; }
  .set-cover img.cover-loaded.cover-in-view,
  :is(.release-cover,.about-photo) img.cover-loaded.cover-in-view { animation:cover-soft-load .85s ease-out both; }
}
/* Hero identity: 25% larger than the base .76rem eyebrow. */
.hero-line > .eyebrow { font-size:.95rem; }
.about-photo { overflow:hidden; position:relative; }
.about-photo img { transition:transform .35s; }
/* White icon opening: CSS deadline also reveals the site if JavaScript fails. */
.page-intro { position:fixed; inset:0; z-index:1100; display:grid; place-items:center; background:#080808; pointer-events:none; animation:intro-deadline 1s ease 5s forwards; }
.page-intro.is-leaving { animation:intro-deadline .9s ease-in-out forwards; }
@keyframes spinner-arrive { from{opacity:0} to{opacity:1} }
@keyframes spinner-turn { to{transform:rotate(360deg)} }
@keyframes intro-deadline { to{opacity:0;visibility:hidden} }
body:has(:focus-visible) .page-intro { display:none; }
/* Keep the card frame legible above tilted/zoomed artwork and inside the scroller. */
.set-card,.release-track { position:relative; border-color:#75604c; }
.set-card::after,.release-track::after { content:""; position:absolute; inset:0; z-index:2; border:1px solid #75604c; pointer-events:none; }
.set-card:hover { transform:none; }
.set-card:hover::after,.release-track:hover::after,
.set-card:focus-within::after,.release-track:focus-within::after { border-color:var(--accent); }
.intro-spinner { display:block; width:48px; height:48px; fill:#fff; box-shadow:none; filter:none; animation:spinner-arrive .5s ease both,spinner-turn 6s linear infinite; }
.intro-content { display:flex; flex-direction:column; align-items:center; gap:24px; }
.intro-welcome { margin:0; color:var(--fg); font:inherit; font-size:18px; letter-spacing:normal; animation:spinner-arrive .7s ease both; }
/* Scroll-linked heading entrance; clipping prevents horizontal page overflow. */
.section { overflow-x:clip; }
.title-reveal-host.reveal { opacity:1; transform:none; transition:none; }
.section h2.scroll-title { opacity:var(--title-opacity,1); transform:translate3d(var(--title-shift,0px),0,0); transition:none; }
.section .scroll-title .title-line { opacity:1; transform:none; transition:none; }
/* Descriptions fade during the second half of their heading's scroll journey. */
.section .scroll-description { opacity:var(--description-opacity,1); transform:none; transition:none; }
/* Patreon has two stationary, successive fades instead of a sliding heading. */
#archive h2.scroll-title { opacity:1; transform:none; }
#archive h2.scroll-title > span.title-line { opacity:var(--patreon-first-opacity,1); transform:none; transition:none; }
#archive h2.scroll-title > em.title-line { opacity:var(--patreon-second-opacity,1); transform:none; transition:none; }

/* RESPONSIVE — @media(min-width:0px) */
/* Patreon benefits enter in a quick cascade during the Archive title fade. */
@media(min-width:0px){
  .archive-list.included-sequence > li {
    opacity:0; transform:translateY(14px);
    transition:opacity .4s ease-out,transform .45s cubic-bezier(.16,1,.3,1);
    transition-delay:var(--included-delay,0ms);
  }
  .archive-list.included-sequence.included-visible > li {
    opacity:1; transform:none;
  }
}
/* Section labels finish their fade before the heading begins its journey. */
.section .scroll-banner { opacity:var(--banner-opacity,1); transition:none; }
/* Reveal the home copy as the opening overlay fades away. */
@keyframes hero-copy-fade { from{opacity:0} to{opacity:var(--hero-exit-opacity,1)} }
@keyframes hero-identity-arrive {
  from{opacity:0;transform:translateX(clamp(45px,7vw,100px))}
  to{opacity:var(--hero-exit-opacity,1);transform:translateX(0)}
}

/* RESPONSIVE — @media(min-width:0px) */
@media(min-width:0px){
  .hero-opening:not(.hero-ready) .hero-line > p,
  .hero-opening:not(.hero-ready) .hero-line > .eyebrow { opacity:0; }
  .hero-opening.hero-ready .hero-line > p { animation:hero-copy-fade 1.2s ease-out .2s both; }
  .hero-opening.hero-ready .hero-line > .eyebrow { animation:hero-identity-arrive 1.25s cubic-bezier(.22,1,.36,1) .2s both; }
}
/* Keep the trial link visible when reached by keyboard. */
#archive .btn.scroll-description:focus-visible { opacity:1; }
#archive .patreon-the { color:inherit; transition:color .35s ease; }
#archive .archive-settled .patreon-the { color:var(--accent); }

/* RESPONSIVE — @media(min-width:0px) */
/* The first Music, Releases, Video and Photo cards follow the fully revealed heading, from left to right. */
@media(min-width:0px){
  :is(#music,#releases,#videos,#photos) .cover-sequence-card {
    opacity:0; transform:translateY(14px);
    transition:opacity .55s ease-out,transform .6s cubic-bezier(.16,1,.3,1);
    transition-delay:var(--cover-delay,0ms);
  }
  :is(#music,#releases,#videos,#photos).covers-ready .cover-sequence-card {
    opacity:1; transform:none;
  }
  :is(#music,#releases,#videos,#photos) .cover-sequence-card:focus-within { opacity:1; transform:none; transition:none; }
}

/* RESPONSIVE — @media(min-width:0px) */
/* Hero exits in reading order as the visitor scrolls down. */
@media(min-width:0px){
  .hero-line > p,.hero-line > .eyebrow,.hero-actions > .btn,.hero .scrollcue { opacity:var(--hero-exit-opacity,1); }
  .hero-actions > .btn.hero-exit-hidden { pointer-events:none; }
  .hero-actions > .btn:focus-visible { opacity:1; pointer-events:auto; }
}
/* Slightly lighter warm background for the information below music artwork. */
.set-card,.release-track { background:#211d19; }
/* About: a stationary portrait fade, followed by the biography. */
#about .about-photo,#about .about-photo:hover img,#about .about-photo:focus-visible img { transform:none; }

/* RESPONSIVE — @media(min-width:0px) */
@media(min-width:0px){
  #about.about-sequence .about-photo.reveal { opacity:0; transform:none; transition:opacity .85s ease-out; }
  #about.about-sequence.about-photo-ready .about-photo.reveal { opacity:1; }
  #about.about-sequence .about-photo img { opacity:1; animation:none; }
  #about.about-sequence .scroll-description { opacity:0; transition:opacity .6s ease-out; }
  #about.about-sequence.about-text-ready .scroll-description { opacity:1; }
}
/* Homepage booking button uses regular-weight text. */
.hero-actions .btn { font-size:16px; font-weight:400; line-height:1.6; }

/* RESPONSIVE — @media(min-width:0px) */
/* Booking: synchronized entrance fade; copy, rider and form remain visible. */
@media(min-width:0px){
  #booking.booking-sequence .booking-grid > div.reveal { opacity:var(--description-opacity,1); transform:none; transition:none; }
  #booking.booking-sequence .booking-grid .scroll-description { opacity:1; }
  #booking.booking-sequence #booking-form.reveal {
    opacity:var(--description-opacity,1);
    transform:none;
    transition:none;
  }
  #booking.booking-sequence:focus-within #booking-form { opacity:1; transform:none; }
  #booking.booking-sequence:focus-within .booking-grid > div { opacity:1; }
}

/* RESPONSIVE — @media(min-width:0px) */
/* Footer fades with its viewport entry and reverses when scrolling back. */
@media(min-width:0px){
  #connect.footer-fade > .wrap { opacity:var(--footer-opacity,1); }
  #connect.footer-fade:focus-within > .wrap { opacity:1; }
}
.footer-legal { display:flex; align-items:baseline; flex-wrap:wrap; gap:4px 8px; }
.footer-legal .privacy-settings { color:inherit; }
.footer-legal a,.footer-legal .privacy-settings { text-decoration:none; border-bottom:0; }
/* Alternate section backgrounds and separate booking from the footer. */
#booking { background:#080808; }
#connect { border-top:1px solid #383838; }
/* Keep Play close to its own title, independent of off-screen long titles. */
.music-grid,.release-tracks { align-items:flex-start; }
.set-actions,.release-track .player-slot { margin-top:0; }
/* Reserve two title lines so Play links stay aligned, without shortening DATA. */
.set-title h3,.release-track-name h4 .release-title {
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
  overflow:hidden;
  height:2.5em;
  line-height:1.25;
}
.release-track-name h4 { min-width:0; width:100%; min-height:calc(2.5em + 15px); }
.release-track-name h4 .release-title { font-size:inherit; font-weight:inherit; color:inherit; }
.social-icons a.social-text-link{width:auto;max-width:100%;height:auto;min-height:29px;overflow-wrap:anywhere}

/* RESPONSIVE — @media(max-width:800px) */
/* Match section heading sizing on phones and tablets; preserve desktop. */
@media(max-width:800px){.releases .section-title h2{font-size:clamp(3.25rem,18vw,5.25rem);line-height:.92}}

/* RESPONSIVE — @media(max-width:420px) */
@media(max-width:420px){.releases .section-title h2{font-size:clamp(3rem,17vw,4.4rem)}}
/* Vector action arrows: identical monochrome rendering on iOS and desktop. */
.action-arrow{
  width:1em;height:1em;overflow:hidden;text-indent:-9999px;vertical-align:-.12em;
  background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 13L13 3M4 3h9v9' fill='none' stroke='black' stroke-width='1.2'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 13L13 3M4 3h9v9' fill='none' stroke='black' stroke-width='1.2'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* RESPONSIVE — @media(max-width:600px) */
/* Phone hero: lower headline, compact actions, cue above bottom navigation. */
@media(max-width:600px){
 .hero{min-height:calc(100svh - 64px);padding-top:clamp(160px,30svh,240px);padding-bottom:70px;align-items:flex-start}
 .hero-content{margin:0 auto}
 .hero-line > p{font-size:clamp(1.8rem,8.4vw,2.25rem);line-height:1.14;margin-bottom:20px}
 .hero-line > .eyebrow{top:0;margin-bottom:0}
 .hero-line .hero-actions{top:0;margin-top:32px;gap:10px}
 .hero-actions .btn{flex:1 1 0;min-width:0;padding-inline:10px}
 .hero .scrollcue{bottom:20px;margin:0}
}

/* RESPONSIVE — @media(max-width:600px) */
/* Compact phone hero typography; identity stays on one line. */
@media(max-width:600px){
 .hero-line > p{font-size:clamp(1.65rem,7.7vw,2.0625rem)}
 .hero-line > .eyebrow{font-size:clamp(.5rem,2.5vw,.72rem);letter-spacing:.06em;white-space:nowrap;max-width:100%}
}

/* RESPONSIVE — @media(min-width:801px) and (max-width:1180px), (min-width:801px) and (max-width:1366px) and (hover:none) and (pointer:coarse) */
/* Half the section opening space on phones and tablets. */
@media(min-width:801px) and (max-width:1180px), (min-width:801px) and (max-width:1366px) and (hover:none) and (pointer:coarse){
 .section{padding-top:60px!important}
 .connect{padding-top:50px!important}
}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){
 .section,.connect{padding-top:38px!important}
}
#about > .wrap > .about-welcome{max-width:760px;margin:0 0 25px}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){#about > .wrap > .about-welcome{font-size:calc(1.05rem + 6px);line-height:1.5;max-width:100%}}
/* About heading aligned left with the description. */
#about .section-title h2{margin-left:0;text-align:left}

/* RESPONSIVE — @media(min-width:801px) */
/* Raise the About portrait in the two-column layout without altering reveal transforms. */
@media(min-width:801px){.about-layout .about-photo{position:relative;top:-90px}}

/* RESPONSIVE — @media(max-width:800px), (max-width:1366px) and (pointer:coarse) */
/* Bottom menu: reveal after scrolling a quarter of the hero on touch layouts. */
@media(max-width:800px), (max-width:1366px) and (pointer:coarse){
 header{backdrop-filter:none;-webkit-backdrop-filter:none}
 header nav{position:fixed;left:0;right:0;bottom:0;top:auto;z-index:30;background:#080808f5;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom,0px)}
 html.scroll-menu-ready header nav{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .4s ease,visibility 0s linear .4s}
 html.scroll-menu-ready header nav.scroll-menu-visible{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .4s ease,visibility 0s}
}

/* RESPONSIVE — @media(min-width:801px) and (max-width:1366px) and (pointer:coarse) */
@media(min-width:801px) and (max-width:1366px) and (pointer:coarse){
 header nav{display:flex;justify-content:center;gap:0;overflow-x:auto}
 header nav a{display:flex;align-items:center;justify-content:center;min-height:58px;padding:0 14px;flex-shrink:0}
 body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
}

/* RESPONSIVE — @media(max-width:600px) */
/* Phone hero copy and actions: 50px lower; scroll cue stays anchored. */
@media(max-width:600px){.hero-line{top:70px}.hero{padding-bottom:120px}}

/* RESPONSIVE — @media(max-width:600px) */
/* Follow the phone hero block with its scroll cue. */
@media(max-width:600px){.hero{min-height:calc(100svh + 6px);padding-bottom:190px}}

/* RESPONSIVE — @media(max-width:600px) */
/* Consistent phone section heading-to-description gap: 8px + 5px. */
@media(max-width:600px){
 .section .section-title{margin-bottom:13px}
 #archive h2{margin-bottom:13px}
 #booking .booking-grid > .reveal > .intro{margin-top:0}
}

/* RESPONSIVE — @media(max-width:1180px), (max-width:1366px) and (pointer:coarse) */
/* Hide the release mix subtitle on phones and tablets; preserve track titles. */
@media(max-width:1180px), (max-width:1366px) and (pointer:coarse){
 .release-track-name h4 > .release-title + span{display:none}
 .release-track-name h4{min-height:2.5em}
}

/* RESPONSIVE — @media(max-width:600px) */
/* Phone scroll hint: 15px higher, independent of headline and actions. */
@media(max-width:600px){.hero .scrollcue{bottom:35px;transform:none;translate:none}}

/* RESPONSIVE — @media(max-width:600px) */
/* Phone hero covers the largest Safari viewport without changing height on scroll. */
@media(max-width:600px){.hero{min-height:calc(100lvh + 6px)}}
/* CMS footer locale picker: native disclosure, no external icon dependency. */
.footer-tools{display:flex;align-items:center;justify-content:flex-end;gap:20px;flex-wrap:wrap}
.footer-language{position:relative;top:-5px;font-size:12px;line-height:1.4;letter-spacing:.015em;text-align:left;z-index:5}
.footer-language summary{list-style:none;display:flex;align-items:center;gap:9px;min-height:40px;padding:9px 12px;border:1px solid #655443;border-radius:6px;background:#171310;color:var(--fg);cursor:pointer;transition:border-color .2s,background .2s}
.footer-language summary::-webkit-details-marker{display:none}
.footer-language summary:hover,.footer-language[open] summary{border-color:var(--accent);background:#241b14}
.footer-language summary:focus-visible,.language-options a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.language-chevron{width:6px;height:6px;border-top:1px solid currentColor;border-left:1px solid currentColor;transform:rotate(45deg);margin:3px 1px 0 8px;transition:transform .2s}
.footer-language[open] .language-chevron{transform:rotate(225deg);margin-top:-3px}
.language-options{position:absolute;bottom:calc(100% + 8px);right:0;min-width:68px;padding:5px;background:#191512;border:1px solid #655443;border-radius:8px;box-shadow:0 10px 30px #0006}
.language-options a{display:flex;align-items:center;gap:10px;min-height:42px;padding:9px 10px;border-radius:4px;color:var(--fg);text-transform:none;letter-spacing:normal;white-space:nowrap}
.language-options a:hover{background:#ffffff0a;color:var(--accent)}
.language-options a[aria-current]{background:#cc7d321a;color:#e7a05a}
.language-options a[aria-current]::after{content:'✓';margin-left:auto;font-size:12px}
.language-flag{display:inline-block;width:20px;height:14px;flex:0 0 20px;border-radius:2px;box-shadow:inset 0 0 0 1px #ffffff20;overflow:hidden;background-size:cover;background-position:center}
.language-flag--fr{background-image:linear-gradient(90deg,#244b94 0 33.33%,#f4f1ec 33.33% 66.66%,#ce444c 66.66%)}
.language-flag--en{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 40'%3E%3Cpath fill='%23243b70' d='M0 0h60v40H0z'/%3E%3Cpath stroke='%23f4f1ec' stroke-width='8' d='m0 0 60 40M60 0 0 40'/%3E%3Cpath stroke='%23bf3f4b' stroke-width='3' d='m0 0 60 40M60 0 0 40'/%3E%3Cpath stroke='%23f4f1ec' stroke-width='12' d='M30 0v40M0 20h60'/%3E%3Cpath stroke='%23bf3f4b' stroke-width='7' d='M30 0v40M0 20h60'/%3E%3C/svg%3E")}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){.footer-tools{justify-content:space-between;gap:12px;margin-top:14px}.footer-language summary{min-height:44px}}
/* Responsive footer signature, CMS preview. */
.signature-mobile{display:none}

/* RESPONSIVE — @media(max-width:600px) */
@media(max-width:600px){
  #connect footer .footer-legal{flex-wrap:nowrap;white-space:nowrap;gap:4px;font-size:11px;letter-spacing:0}
  #connect footer .footer-legal a,#connect footer .footer-legal button{font-size:inherit;letter-spacing:inherit}
  .signature-desktop,.footer-tools .footer-credit{display:none}
  .signature-mobile{display:inline}
  #connect .footer-tools{justify-content:flex-end}
}
/* Equal editorial slots keep carousel cards and Play baselines aligned. */
.music-grid,.release-tracks{align-items:stretch}
.set-info>small{
 display:-webkit-box;
 -webkit-box-orient:vertical;
 -webkit-line-clamp:2;
 line-clamp:2;
 overflow:hidden;
 line-height:1.4;
 height:2.8em;
 min-height:2.8em;
 flex-shrink:0;
}
.set-title h3,.release-track-name h4 .release-title{height:2.5em;min-height:2.5em;line-height:1.25}
.set-actions,.release-track .player-slot{margin-top:auto}
.set-cover,.release-cover{flex-shrink:0;aspect-ratio:1}
/* The introduction belongs to the text column, never behind the portrait. */
#about .about-layout .about-welcome{font-size:calc(1.15rem + 6px);font-weight:400;line-height:1.6;margin:0 0 25px;max-width:100%;overflow-wrap:break-word}
#about .about-layout{grid-template-columns:minmax(0,1.0625fr) minmax(0,1fr)}
#about .about-layout .about-photo{width:100%;max-width:100%;top:0;align-self:start}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){
 #about .about-layout{grid-template-columns:minmax(0,1fr)}
 #about .about-layout .about-welcome{font-size:calc(1.05rem + 6px);line-height:1.5}
}

/* RESPONSIVE — @media(prefers-reduced-motion:no-preference) */
/* Scroll motion follows measured speed, without changing hover interactions. */
@media(prefers-reduced-motion:no-preference){
 .reveal,.section-title.reveal .title-line,.scroll-description,
 #about.about-sequence .about-photo.reveal,#about.about-sequence .scroll-description{
  transition-duration:var(--scroll-fade-duration,450ms)!important;
  transition-delay:0s!important;
 }
 :is(.set-cover,.release-cover,.about-photo) img.cover-loaded.cover-in-view{
  animation-duration:var(--scroll-fade-duration,450ms)!important;
  animation-delay:0s!important;
 }
}

/* RESPONSIVE — @media(prefers-reduced-motion:no-preference) */
/* Preserve the left-to-right cascade even when scroll transitions accelerate. */
@media(prefers-reduced-motion:no-preference){
 :is(#music,#releases,#photos,#videos) .cover-sequence-card{
  transition-duration: max(220ms,var(--scroll-fade-duration,450ms))!important;
  transition-delay:calc(var(--cover-order,0) * var(--cover-stagger,140ms))!important;
 }
}
/* Match list arrows to button SVG arrows, including iOS. */
.archive-list li:not(.archive-list-heading)::before{
  content:"";display:block;color:var(--accent);
  width:1em;height:1em;overflow:hidden;text-indent:-9999px;vertical-align:-.12em;
  background-color:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 13L13 3M4 3h9v9' fill='none' stroke='black' stroke-width='1.2'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 13L13 3M4 3h9v9' fill='none' stroke='black' stroke-width='1.2'/%3E%3C/svg%3E") center/contain no-repeat;
}
/* Keep hero logo motion composited and the scroll link keyboard-visible. */
.hero.motion-active .hero-logo{will-change:transform}
.hero .scrollcue:focus-visible{outline:2px solid var(--accent);outline-offset:6px}
/* Keep recovered covers visible and preserve a readable opening cascade. */
:is(#music,#releases,#photos,#videos) .cover-sequence-card{transition-delay:calc(var(--cover-order,0)*140ms)!important}
/* Emphasize the About introduction and keep the signature in the left legal group. */
#about .about-layout p.about-welcome{font-weight:400;font-size:calc(1.15rem + 2pt)}
footer .footer-legal .footer-signature{margin-left:0;text-align:left}

/* RESPONSIVE — @media(max-width:800px) */
@media(max-width:800px){#connect footer .footer-legal{flex-wrap:wrap}#connect footer .footer-legal .footer-signature{flex-basis:100%;margin-left:0}}
/* Keep translated rider links clear of the booking form. */
#booking .riders a{gap:20px;padding-right:24px;font-size:calc(1rem - 2pt)}
#booking .riders a>span{min-width:0;max-width:58%;text-align:right;overflow-wrap:break-word}

/* RESPONSIVE — @media(min-width:801px) */
/* Desktop legal footer: Cookie | Design by Metapixels. */
@media(min-width:801px){footer .footer-legal .footer-signature::before{content:"|";display:inline-block;margin-right:8px}}
/* Rider dividers: leave 15px clear on the right. */
#booking .riders{width:calc(70% + 40px)}

/* RESPONSIVE — @media(max-width:1180px) */
@media(max-width:1180px){#booking .riders{width:100%}}
/* Remove 20px of reserved space below single-line music genres. */
#music .set-info>small{height:auto;min-height:1.4em}
#music .set-title{margin-top:calc(12px + .72rem * 1.4 - 20px)}
/* Releases use the same genre-to-title layout as Listen. */
.release-track-name{flex-direction:column;gap:0}
.release-genre{display:block;color:var(--accent);font-size:.72rem;line-height:1.4;letter-spacing:.1em;text-transform:uppercase;margin-bottom:calc(12px + .72rem * 1.4 - 20px)}
/* Uploaded artist portraits retain their actual proportions. */
.about-layout .about-photo.managed-image{aspect-ratio:auto}
.about-photo.managed-image img{height:auto;object-fit:contain}

.social-icons:empty,.connect-links:empty{display:none}