/* Olivier — page bio */

.bleed-1{top:-220px;left:-260px;width:620px;height:540px;}
.bleed-2{top:240px;right:-220px;width:480px;height:420px;}
.bleed-3{top:1480px;left:-200px;width:520px;height:420px;}
.bleed-4{bottom:-160px;right:-160px;width:520px;height:460px;}

.scrib.s1{top:80px;right:42%;width:54px;height:30px;transform:rotate(-12deg);}
.scrib.s2{top:1200px;right:6%;width:50px;height:50px;transform:rotate(6deg);}
.scrib.s3{top:1820px;left:8%;width:64px;height:34px;transform:rotate(-4deg);}

/* Hero */
.hero{
  position:relative;z-index:5;
  padding:64px 80px 60px 80px;
  display:grid;grid-template-columns:1.15fr 0.85fr;gap:56px;
  align-items:start;
}
.hero-text{padding-top:14px;}
.eyebrow-hand{
  font-family:var(--hand);
  color:var(--coral);font-size:36px;font-weight:600;
  transform:rotate(-2deg);
  display:inline-flex;align-items:center;gap:12px;
  margin-bottom:12px;
}
.eyebrow-hand .x{
  width:18px;height:18px;display:inline-block;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5 6 L19 19 M19 6 L5 19' stroke='%23F2774E' stroke-width='2.8' fill='none' stroke-linecap='round'/></svg>") center/contain no-repeat;
  transform:translateY(-2px) rotate(-10deg);
}
.h1{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(72px,8vw,128px);line-height:0.94;
  letter-spacing:-0.02em;margin:0 0 26px 0;color:var(--ink);
}
.h1 .last{font-style:italic;font-weight:400;display:inline-block;position:relative;}
.h1 .last::after{
  content:"";position:absolute;left:-4px;right:8px;bottom:-8px;height:8px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'><path d='M2 7 Q 28 2 60 6 T 122 5 Q 158 8 198 4' stroke='%23F2774E' stroke-width='2.6' fill='none' stroke-linecap='round'/></svg>") center/100% 100% no-repeat;
}
.kicker{
  font-family:var(--serif);font-style:italic;
  font-size:22px;line-height:1.5;color:var(--ink-soft);
  max-width:480px;margin:0 0 28px 0;
}
.kicker strong{font-weight:600;color:var(--ink);font-style:normal;}
.hero-meta{
  display:flex;flex-wrap:wrap;gap:14px;
}

.portrait-medal{
  position:relative;width:100%;max-width:440px;justify-self:end;
  aspect-ratio:1/1;
}
.portrait-medal .washes{position:absolute;inset:-14% -14%;z-index:0;pointer-events:none;}
.portrait-medal img{
  position:relative;z-index:2;width:100%;height:100%;
  display:block;object-fit:cover;border-radius:50%;mix-blend-mode:multiply;
}
.portrait-medal .deco{position:absolute;z-index:3;pointer-events:none;}
.portrait-medal .deco.x1{top:4%;right:-4%;width:38px;height:38px;transform:rotate(10deg);}
.portrait-medal .deco.x2{bottom:6%;left:-2%;width:30px;height:30px;transform:rotate(-12deg);}

/* Body : bio + chronologie en notes de marge */
.bio{
  position:relative;z-index:5;
  padding:36px 80px 40px 80px;
  border-top:1px dashed rgba(35,38,63,0.18);
}
.bio-eyebrow{
  display:flex;align-items:baseline;gap:18px;
  font-family:var(--sans);
  font-size:12px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--ink-mute);
  padding-top:30px;margin-bottom:6px;
}
.bio-eyebrow .num{
  font-family:var(--hand);font-size:38px;color:var(--coral);
  letter-spacing:0;text-transform:none;line-height:1;
  transform:translateY(6px) rotate(-3deg);
}
.bio-title{
  font-family:var(--serif);font-weight:500;
  font-size:clamp(36px,3.6vw,52px);line-height:1.05;
  letter-spacing:-0.01em;margin:0 0 36px 0;max-width:760px;
}
.bio-title em{font-family:var(--hand);font-style:normal;color:var(--coral);font-size:1.05em;}

.bio-grid{
  display:grid;
  grid-template-columns:minmax(0,640px) 260px;
  gap:80px;
}
.bio-body{font-family:var(--serif);font-size:19px;line-height:1.78;}
.bio-body p{margin:0 0 1.4em 0;}
.bio-body p:first-of-type::first-letter{
  font-family:var(--serif);font-weight:500;
  font-size:5.4em;line-height:0.86;
  float:left;padding:6px 12px 0 0;color:var(--coral);
}
.bio-body .pull{
  font-style:italic;font-size:26px;line-height:1.35;
  color:var(--ink);
  margin:1.6em -10px;padding:8px 24px 8px 26px;
  position:relative;
  border-left:2px solid var(--coral);
  background:linear-gradient(to right, rgba(245,192,160,0.18), transparent 70%);
}
.bio-body .pull::before{
  content:"«";position:absolute;left:-2px;top:-32px;
  font-style:normal;font-size:80px;line-height:1;color:var(--peach);
}

/* Notes en marge */
.margin-notes{
  position:relative;
  padding-top:18px;
}
.margin-notes::before{
  content:"";position:absolute;left:-44px;top:0;bottom:0;width:1px;
  background:repeating-linear-gradient(to bottom, var(--coral) 0 4px, transparent 4px 12px);
  opacity:0.45;
}
.margin-notes .label{
  font-family:var(--sans);font-size:11px;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--ink-mute);
  margin-bottom:18px;
}
.note{
  position:relative;
  margin-bottom:24px;
  padding-left:0;
}
.note .yr{
  font-family:var(--hand);font-size:30px;color:var(--coral);
  line-height:1;transform:rotate(-3deg);display:inline-block;
}
.note .ev{
  display:block;font-family:var(--serif);font-style:italic;
  font-size:15.5px;line-height:1.45;color:var(--ink-soft);
  margin-top:4px;
}
.note::before{
  content:"";position:absolute;left:-50px;top:8px;width:14px;height:14px;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M5 6 L19 19 M19 6 L5 19' stroke='%23F2774E' stroke-width='3' fill='none' stroke-linecap='round'/></svg>") center/contain no-repeat;
}

/* Voix — bandeau citation */
.voix{
  position:relative;z-index:5;
  margin:40px 0 0 0;
  padding:80px 80px 80px 80px;
  display:grid;grid-template-columns:1fr 1.4fr;gap:64px;align-items:center;
}
.voix .label{
  font-family:var(--sans);
  font-size:12px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--ink-mute);
  display:flex;align-items:center;gap:14px;
}
.voix .label::before{content:"";display:inline-block;width:38px;height:1px;background:var(--ink-mute);}
.voix .ref{
  font-family:var(--hand);font-size:32px;color:var(--coral);line-height:1.1;
  transform:rotate(-2deg);margin:12px 0 0 0;
}
.voix .ref small{
  display:block;font-family:var(--sans);font-size:11px;color:var(--ink-mute);
  letter-spacing:0.16em;text-transform:uppercase;font-weight:500;
  transform:rotate(2deg);margin-top:8px;
}
.voix-text{
  position:relative;
  font-family:var(--serif);font-style:italic;
  font-size:clamp(24px,2vw,30px);line-height:1.45;color:var(--ink);
  max-width:720px;
}
.voix-text .open-quote{
  position:absolute;left:-58px;top:-30px;
  font-style:normal;font-size:110px;line-height:1;color:var(--lilac);
}

/* Anchors to other pages */
.next-up{
  position:relative;z-index:5;
  padding:40px 80px 80px 80px;
  display:grid;grid-template-columns:1fr 1fr;gap:24px;
}
.next-card{
  position:relative;
  background:var(--paper);
  border:1px solid rgba(35,38,63,0.12);
  border-radius:3px;
  padding:28px 30px 26px 30px;
  text-decoration:none;color:var(--ink);
  overflow:hidden;isolation:isolate;
  min-height:160px;
  display:flex;flex-direction:column;justify-content:space-between;gap:18px;
}
.next-card::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:repeating-linear-gradient(to bottom,
    transparent 0, transparent 27px,
    rgba(201,210,224,0.45) 27px, rgba(201,210,224,0.45) 28px);
}
.next-card .wash{position:absolute;inset:auto -25% -40% -25%;height:80%;z-index:1;pointer-events:none;}
.next-card .row{position:relative;z-index:2;display:flex;align-items:baseline;justify-content:space-between;gap:14px;}
.next-card .lab{font-family:var(--sans);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-mute);}
.next-card h3{font-family:var(--serif);font-weight:500;font-size:36px;line-height:1.05;letter-spacing:-0.01em;margin:0;position:relative;z-index:2;}
.next-card p{font-family:var(--serif);font-style:italic;font-size:16px;color:var(--ink-soft);margin:0;position:relative;z-index:2;}
.next-card .arr{font-family:var(--serif);font-style:italic;color:var(--coral);font-size:16px;}

/* ────────── Mobile ────────── */
@media (max-width:720px){
  .hero{grid-template-columns:1fr;padding:24px 22px 36px 22px;gap:24px;}
  .portrait-medal{order:-1;max-width:78%;margin:0 auto;}
  .h1{font-size:64px;line-height:0.96;}
  .kicker{font-size:18px;}
  .bio{padding:24px 22px 24px 22px;}
  .bio-grid{grid-template-columns:1fr;gap:36px;}
  .bio-body{font-size:17.5px;line-height:1.7;}
  .bio-body .pull{font-size:22px;margin:1.4em 0;}
  .margin-notes::before{display:none;}
  .note::before{left:0;top:6px;width:12px;height:12px;}
  .note{padding-left:24px;}
  .voix{grid-template-columns:1fr;gap:18px;padding:32px 22px 40px 22px;margin-top:8px;}
  .voix-text{font-size:22px;}
  .voix-text .open-quote{left:-4px;top:-32px;font-size:80px;}
  .next-up{grid-template-columns:1fr;padding:24px 22px 48px 22px;}
  .next-card h3{font-size:30px;}
  .bleed-1{width:380px;height:340px;top:-120px;left:-180px;}
  .bleed-2{width:340px;height:300px;top:520px;right:-180px;}
  .bleed-3{display:none;}
  .bleed-4{width:380px;height:340px;bottom:-180px;right:-180px;}
}