@charset "UTF-8";
/* LOOKBOOK THE ESCAPE � THE CLIFFS � FW26 */

/* VARIABLES */
:root{--bg:#fffcf8;--txt:#000;--muted:rgba(0,0,0,.45);--font:"Montserrat",sans-serif;--fs:14px;--gap:60px;--grid-gap:8px;--col:74%;--logo:64px;--cta-pad:15px 22px;--cta-ls:1.6px;--cta-inset:24px;--card-w:380px;--card-pad:34px 34px 40px}
@media (max-width:1024px){:root{--fs:13px;--gap:40px;--col:80%;--logo:52px}}
@media (max-width:767px){:root{--fs:12px;--gap:30px;--grid-gap:4px;--col:60%;--logo:34px;--cta-pad:11px 13px;--cta-ls:1px;--cta-inset:12px;--card-w:300px;--card-pad:18px 16px 20px}}

/* BASE */
html,body{overflow-x:clip}
.lookbook,.lookbook *{box-sizing:border-box}
.lookbook{position:relative;width:100%;margin-inline:calc(50% - 50vw);background:var(--bg);color:var(--txt);font-family:var(--font);line-height:1.6;overflow-x:clip}
.lookbook a{color:inherit;text-decoration:none}
.lookbook a:focus-visible,.lookbook button:focus-visible{outline:2px solid var(--txt);outline-offset:2px}
.lookbook .line{position:relative;width:100%;overflow-x:clip;animation:escIn .6s ease forwards}
.lookbook .line-margin{margin-bottom:var(--gap)}
@keyframes escIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
@media (max-width:767px){.lookbook .hidden-m{display:none!important}}
@media (min-width:768px){.lookbook .hidden-d{display:none!important}}

/* IMAGES (zoom au survol, sauf visuels encadr�s .no-zoom ; .esc-fixed = portrait 2/3) */
.lookbook picture,.lookbook picture img{display:block;width:100%;height:auto}
.lookbook .quickshop{display:block;position:relative}
.lookbook .img-container{position:relative;overflow:hidden}
.lookbook .img-container img{transition:transform 1s cubic-bezier(.25,.1,.25,1)}
.lookbook a:hover .img-container img{transform:scale(1.015)}
.lookbook .no-zoom a:hover .img-container img{transform:none}
.lookbook .esc-cell{position:relative;min-width:0}
.lookbook .esc-fixed .img-container{aspect-ratio:2/3}
.lookbook .esc-fixed picture,.lookbook .esc-fixed img{height:100%;object-fit:cover}

/* TEXTES MANUSCRITS (calés sur la colonne de la vidéo) + VIDÉO
   Le lien « Voir la collection » est sous la vidéo, dans le flux et au-dessus des lignes suivantes (z-index) ;
   en desktop, la marge de la ligne est réduite de la hauteur du lien : écart vidéo → texte 2 = --gap. */
.lookbook .line-esc-texte{padding-inline:calc((100% - var(--col)) / 2)}
.lookbook .line-esc-texte .esc-texte{width:44%;max-width:560px;margin-inline:auto}
.lookbook .line-esc-texte--left .esc-texte{width:62%;max-width:820px;margin-inline:0 auto}
.lookbook .esc-collection{position:relative;width:var(--col);margin-inline:auto}
.lookbook .esc-video{position:relative;width:100%!important;height:auto!important;margin:0!important;aspect-ratio:16/9;overflow:hidden;background:#e9e1d4}
.lookbook .esc-video video{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover}
.lookbook .esc-collection-foot{position:relative;z-index:5;padding-top:12px;text-align:right}
.lookbook .line-esc-video{z-index:5}
@media (min-width:768px){
  /* lien dans le flux : on retire sa hauteur (12 + 5 + 1px + 1 ligne) de la marge pour garder video -> texte 2 = --gap */
  .lookbook .line-esc-video.line-margin{margin-bottom:calc(var(--gap) - var(--fs) - 18px)}
}
@media (max-width:767px){
  .lookbook .esc-video{aspect-ratio:9/16}
  .lookbook .line-esc-texte .esc-texte{width:77%}
  .lookbook .line-esc-texte--left .esc-texte{width:120%;max-width:none}  /* texte 2 mobile : 3 lignes, d�borde un peu � droite de la colonne */
}

/* LIEN SOULIGN� (Voir la collection + CTA soulign�) */
.lookbook .esc-link,.lookbook .lb-cta,.lookbook .lb-card__title,.lookbook .lb-card__name,.lookbook .lb-card__price{font-family:var(--font);font-size:var(--fs);font-weight:500;letter-spacing:var(--cta-ls);text-transform:uppercase}
.lookbook .esc-link{display:inline-block;padding-bottom:5px;border-bottom:1px solid;line-height:1;white-space:nowrap;transition:opacity .3s}
.lookbook .esc-link:hover{opacity:.55}

/* TRIO (Corentin desktop) + DUO (Corentin mobile, Djovanni desktop) � m�me �cart entre visuels partout : --grid-gap */
.lookbook .esc-trio,.lookbook .esc-duo{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--grid-gap)}
.lookbook .esc-duo{grid-template-columns:repeat(2,minmax(0,1fr))}
.lookbook .esc-duo{column-gap:var(--grid-gap);row-gap:0}  /* le CTA (3e enfant) n'ajoute pas d'�cart sous les photos */
.lookbook .line-djovanni .esc-duo{column-gap:0!important}  /* Djovanni : 2 photos coll�es, pleine largeur (maquette) */
.lookbook .esc-cta-under{padding:12px 26px 0}

/* SPLIT � grand visuel + 2 petits (Marius, Peyton) : les petits donnent la hauteur */
.lookbook .line-split{--big:3.2fr;--sgap:var(--grid-gap);display:grid;grid-template-columns:minmax(0,var(--big)) minmax(0,1fr);gap:var(--sgap);padding-inline:3%}
.lookbook .split-big{position:relative;min-width:0}
.lookbook .split-big>.quickshop{position:absolute;inset:0}
.lookbook .split-big .img-container,.lookbook .split-big picture,.lookbook .split-big img{height:100%;object-fit:cover}
.lookbook .split-side{display:flex;flex-direction:column;gap:var(--sgap);min-width:0}
@media (min-width:768px){
  .lookbook .line-split--reverse{grid-template-columns:minmax(0,1fr) minmax(0,var(--big))}
  .lookbook .line-split--reverse .split-big{order:2}
}
@media (max-width:767px){.lookbook .line-split{--big:2fr;--sgap:var(--grid-gap);padding-inline:0}}

/* AMBROISE desktop � portrait + petit cadre centr�, CTA soulign� en bas de la colonne (align� sur le bas du portrait) */
.lookbook .line-ambroise{display:grid;grid-template-columns:1fr 1fr}
.lookbook .ambroise-side{position:relative;display:flex;align-items:center;justify-content:center}
.lookbook .ambroise-small{width:53%}
.lookbook .lb-info.ambroise-cta{position:absolute;left:17px;bottom:0;z-index:20}  /* m�me retrait que les CTA soulign�s de Camille et Courtney */
.lookbook .ambroise-cta .lb-card.is-open{background:var(--bg)}

/* COLONNES LAT�RALES � logo en haut, CTA soulign� en bas (Camille, Courtney desktop) */
.lookbook .line-side{display:grid;grid-template-columns:62.5% minmax(0,1fr);padding-left:3.4%}
.lookbook .line-side--right{grid-template-columns:minmax(0,1fr) 63.5%;padding:0 5.5% 0 0}
.lookbook .side-duo{display:grid;grid-template-columns:1fr 1fr;gap:var(--grid-gap)}
.lookbook .side-col{display:flex;flex-direction:column;justify-content:space-between;align-items:center;padding:0 17px;min-width:0}
.lookbook .esc-side-cta{align-self:flex-start;display:flex;flex-direction:column;align-items:flex-start}
.lookbook .line-side--right .esc-side-cta{align-self:flex-end;align-items:flex-end}

/* CADRES ET VISUELS SEULS (Damien, Ambroise mobile, Camille mobile) */
.lookbook .esc-cadre{width:71%;margin-inline:auto}
.lookbook .esc-solo{width:66%;margin-inline:auto}
.lookbook .line-ambroise-mob{width:71.5%}
.lookbook .line-damien{--cta-inset:2.6vw}
@media (max-width:767px){
  .lookbook .esc-cadre{width:93.5%}
  .lookbook .line-damien{--cta-inset:4vw}
  .lookbook .line-ambroise-mob{--cta-inset:5vw}
}

/* LOGOS � anim�s en desktop (script), fixe en mobile */
.lookbook .esc-logo{width:var(--logo);flex:none}
.lookbook .esc-drift{position:relative;z-index:2;will-change:transform}
.lookbook .line-logo-mob{display:flex;justify-content:center}

/* FINAL */
.lookbook .esc-final-cta{position:absolute;bottom:23%;left:50%;transform:translateX(-50%);z-index:10;color:#fff}
@media (max-width:767px){.lookbook .esc-final-cta{bottom:18%}}

/* CTA � VOIR LE LOOK � � d�faut bas droite ; --left bas gauche ; --top haut droite ;
   --left-m bas gauche en mobile seulement ; --plain soulign� hors visuel */
.lookbook .lb-info{position:relative;text-align:left}
.lookbook .lb-info--overlay{position:static}
.lookbook .lb-cta{position:absolute;bottom:var(--cta-inset);right:var(--cta-inset);z-index:20;display:inline-flex!important;align-items:center;gap:12px;width:auto!important;height:auto!important;min-height:0!important;margin:0!important;padding:var(--cta-pad)!important;background:#fff;border:0!important;border-radius:0!important;box-shadow:none!important;color:var(--txt);line-height:1!important;white-space:nowrap;cursor:pointer;-webkit-appearance:none;appearance:none;transition:background-color .4s,color .4s,opacity .3s}
.lookbook .lb-cta:hover{background:#000;color:#fff}
.lookbook .lb-cta__icon::before{content:"+";font-size:1.35em;font-weight:400;line-height:1}
.lookbook .lb-cta[aria-expanded="true"]{opacity:0;visibility:hidden}
.lookbook .lb-cta--left,.lookbook .lb-cta--left~.lb-card{left:var(--cta-inset);right:auto;transform-origin:bottom left}
.lookbook .lb-cta--top,.lookbook .lb-cta--top~.lb-card{top:var(--cta-inset);bottom:auto;transform-origin:top right}
@media (max-width:767px){.lookbook .lb-cta--left-m,.lookbook .lb-cta--left-m~.lb-card{left:var(--cta-inset);right:auto;transform-origin:bottom left}}
.lookbook .lb-cta--plain{position:static;padding:0 0 5px!important;background:none;border-bottom:1px solid!important;max-height:60px;overflow:hidden;transition:opacity .3s,visibility .45s,max-height .45s,padding .45s}
.lookbook .lb-cta--plain:hover{background:none;color:var(--txt);opacity:.55}
.lookbook .lb-cta--plain[aria-expanded="true"]{max-height:0;padding:0!important;border:0!important}

/* CARTE PRODUITS � sur visuel : ne d�borde jamais (d�file si besoin) ; sous CTA soulign� : d�pli�e en flux */
.lookbook .lb-card{position:absolute;bottom:var(--cta-inset);right:var(--cta-inset);z-index:40;width:min(var(--card-w),calc(100% - 2 * var(--cta-inset)));max-height:calc(100% - 2 * var(--cta-inset));overflow-y:auto;overscroll-behavior:contain;padding:var(--card-pad);background:#fff;box-shadow:0 18px 40px -18px rgba(0,0,0,.18);opacity:0;visibility:hidden;transform:translateY(14px);transform-origin:bottom right;transition:opacity .5s,transform .5s,visibility .5s}
.lookbook .lb-card.is-open{opacity:1;visibility:visible;transform:none}
.lookbook .lb-cta--plain~.lb-card{position:static;width:min(312px,calc(100vw - 60px));max-height:0;overflow:hidden;padding:0;background:none;box-shadow:none;transform:none;transition:max-height .55s,opacity .35s,visibility .55s}
.lookbook .lb-cta--plain~.lb-card.is-open{max-height:60vh}
.lookbook .lb-card__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:34px}
.lookbook .lb-card__title{margin:0;line-height:1}
.lookbook .lb-card__close{position:relative;width:22px;height:22px;margin:-6px -4px -6px 0;padding:0;background:none;border:0;cursor:pointer;-webkit-appearance:none;appearance:none}
.lookbook .lb-card__close::before{content:"";position:absolute;top:50%;right:5px;width:11px;height:1px;background:var(--txt)}
.lookbook .lb-card__close:hover{opacity:.5}
.lookbook .lb-card__row{display:grid;grid-template-columns:1fr auto;align-items:baseline;column-gap:24px}
.lookbook .lb-card__row+.lb-card__row{margin-top:7px}
.lookbook .lb-card__name,.lookbook .lb-card__price{letter-spacing:1px;line-height:1.35;transition:opacity .3s}
.lookbook .lb-card__price{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.lookbook .lb-card__row:hover .lb-card__name{opacity:.55}
.lookbook .lb-card__soon-title,.lookbook .lb-card__noted-title{display:none;margin:18px 0 7px;color:var(--muted);font-size:.85em;font-weight:500;letter-spacing:1px;line-height:1.2;text-transform:uppercase}
.lookbook .has-soon .lb-card__soon-title,.lookbook .has-noted .lb-card__noted-title{display:block}
.lookbook .lb-card__row--soon,.lookbook .lb-card__row--noted{color:var(--muted)}
.lookbook .lb-card__row--noted:hover .lb-card__name{opacity:1}
@media (max-width:767px){.lookbook .lb-card__head{margin-bottom:18px}}

@media (prefers-reduced-motion:reduce){.lookbook .line{animation:none}.lookbook *{transition-duration:.01ms!important}.lookbook .esc-drift{transform:none!important}}