/* Virgule — filières art direction 01
   Selection as a visual atlas, not a grid of generic cards. */
body.filieres-art-direction{background:var(--ardoise);overflow-x:hidden}
body.filieres-art-direction .page-hero{
  min-height:clamp(480px,62vw,700px);
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(240px,.85fr);
  align-items:end;
  gap:clamp(30px,7vw,110px);
  text-align:start;
  padding:clamp(112px,13vw,170px) clamp(20px,7vw,100px) clamp(54px,8vw,92px);
  background:var(--ardoise-2);
  border-bottom:1px solid var(--vgl-v3-line);
}
body.filieres-art-direction .page-hero::after{
  content:'∫';
  position:absolute;
  inset-inline-end:clamp(20px,8vw,120px);
  inset-block-start:50%;
  transform:translateY(-46%);
  font:400 clamp(220px,34vw,520px)/.7 var(--font-head);
  color:rgba(217,168,87,.055);
  pointer-events:none;
}
body.filieres-art-direction .page-hero>*{position:relative;z-index:1;max-width:820px;margin-inline:0}
body.filieres-art-direction .page-eyebrow{
  color:var(--craie-doree);
  letter-spacing:.16em;
  margin-bottom:18px;
}
body.filieres-art-direction .page-title{
  max-width:9ch;
  font-size:clamp(54px,8vw,100px);
  letter-spacing:-.06em;
  line-height:.9;
}
body.filieres-art-direction .page-sub{max-width:540px;margin-top:22px;line-height:1.7}
body.filieres-art-direction .filiere-section{
  padding:0 clamp(16px,6vw,88px) 100px;
  background:var(--ardoise);
}
body.filieres-art-direction .filiere-section>.container{max-width:1200px;margin-inline:auto}
body.filieres-art-direction .type-toggle-wrap{
  justify-content:flex-start;
  margin:0;
  padding-block:18px;
  border-bottom:1px solid var(--vgl-v3-line);
}
body.filieres-art-direction .type-toggle{border:0;border-radius:0;padding:0;background:transparent}
body.filieres-art-direction .type-btn{
  min-height:48px;
  border-radius:0;
  border-inline-start:1px solid var(--vgl-v3-line);
  padding-inline:18px;
}
body.filieres-art-direction .type-btn:last-child{border-inline-end:1px solid var(--vgl-v3-line)}
body.filieres-art-direction .type-btn.active{background:var(--craie-doree);color:var(--ardoise)}
body.filieres-art-direction .type-info{
  max-width:760px;
  margin:30px 0 54px;
  padding:14px 0 14px 16px;
  border-inline-start:2px solid var(--craie-doree);
  border-block:0;
  border-radius:0;
  background:transparent!important;
}
body.filieres-art-direction .type-info-icon{display:none}
body.filieres-art-direction .selector-grid{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  border-inline-start:1px solid var(--vgl-v3-line);
  border-top:1px solid var(--vgl-v3-line);
}
body.filieres-art-direction .fil-btn{
  min-height:330px;
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  padding:26px 24px 24px;
  border:0!important;
  border-inline-end:1px solid var(--vgl-v3-line)!important;
  border-bottom:1px solid var(--vgl-v3-line)!important;
  border-radius:0;
  background:transparent!important;
  transition:background-color .2s ease;
  overflow:hidden;
}
body.filieres-art-direction .fil-btn::before{
  inset-block-start:18px;
  inset-inline-end:18px;
  font-size:11px;
  color:var(--craie-doree-border);
}
body.filieres-art-direction .fil-btn::after{
  opacity:1;
  top:auto;
  inset-block-end:22px;
  inset-inline-end:22px;
  color:var(--craie-doree-border);
  transform:none;
}
body.filieres-art-direction .fil-btn:hover{
  transform:none;
  background:rgba(217,168,87,.045)!important;
}
body.filieres-art-direction .fil-btn:hover::after{color:var(--craie-doree);transform:translate(3px,-3px)}
body.filieres-art-direction .fil-btn-icon{
  width:46px;
  height:46px;
  margin-bottom:42px;
  color:var(--craie-doree);
}
body.filieres-art-direction .fil-btn-icon.txt{
  font:400 45px/.9 var(--font-mono,'JetBrains Mono',monospace);
}
body.filieres-art-direction .fil-btn-name{
  max-width:13ch;
  font-size:clamp(21px,2.4vw,30px);
  line-height:.98;
  letter-spacing:-.025em;
}
body.filieres-art-direction .fil-btn-count{
  max-width:28ch;
  margin-top:12px;
  color:var(--craie-pale);
  line-height:1.5;
}
body.filieres-art-direction .fil-btn-tag{
  margin-top:auto;
  border-radius:0;
  padding:5px 8px;
  background:transparent;
}
body.filieres-art-direction .cta-band{
  padding:clamp(90px,12vw,160px) clamp(20px,7vw,100px);
  border-block:1px solid var(--vgl-v3-line);
  background:var(--ardoise-2);
  text-align:start;
}
body.filieres-art-direction .cta-band h3{
  max-width:9ch;
  font-size:clamp(42px,7vw,82px);
  line-height:.92;
  letter-spacing:-.055em;
}
body.filieres-art-direction .cta-band p{max-width:500px;margin:22px 0}
body.filieres-art-direction .cta-band .btn-cta{border-radius:0;min-height:48px;padding-inline:20px}
@media(max-width:850px){
 body.filieres-art-direction .page-hero{grid-template-columns:1fr;min-height:500px}
 body.filieres-art-direction .page-hero::after{inset-block-start:42%;font-size:300px}
 body.filieres-art-direction .selector-grid{grid-template-columns:1fr 1fr}
 body.filieres-art-direction .fil-btn{min-height:260px}
}
@media(max-width:600px){
 body.filieres-art-direction .page-hero{min-height:520px;padding:108px 18px 48px}
 body.filieres-art-direction .page-title{font-size:clamp(50px,15vw,72px)}
 body.filieres-art-direction .page-hero::after{inset-inline-end:-10px;inset-block-start:44%;font-size:240px}
 body.filieres-art-direction .filiere-section{padding-inline:16px;padding-bottom:70px}
 body.filieres-art-direction .type-toggle-wrap{padding-block:12px}
 body.filieres-art-direction .type-btn{padding-inline:14px}
 body.filieres-art-direction .type-info{margin-block:24px 36px}
 body.filieres-art-direction .selector-grid{grid-template-columns:1fr}
 body.filieres-art-direction .fil-btn{min-height:220px;padding:22px 18px}
 body.filieres-art-direction .fil-btn-icon{margin-bottom:28px}
 body.filieres-art-direction .fil-btn-name{font-size:25px}
 body.filieres-art-direction .cta-band{padding:80px 18px}
}
@media(prefers-reduced-motion:reduce){
 body.filieres-art-direction .fil-btn,body.filieres-art-direction .fil-btn::after{transition:none}
}