*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#171717;background:#fff;font-family:Inter,Arial,sans-serif}.site-header{height:124px;background:#fff;position:sticky;top:0;z-index:30;box-shadow:0 1px 0 rgba(0,0,0,.05)}.header-inner{max-width:1320px;height:100%;margin:auto;padding:0 38px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;height:100%;padding:10px 0}.brand img{width:250px;height:102px;object-fit:contain;object-position:left center;display:block}.main-nav{display:flex;align-items:center;gap:34px}.main-nav a{font-size:11px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;color:#111;font-weight:700;position:relative;white-space:nowrap}.main-nav a:not(.contact-btn)::after{content:"";position:absolute;height:2px;background:#179ca0;left:0;right:100%;bottom:-13px;transition:.25s}.main-nav a:hover::after,.main-nav a.active::after{right:0}.contact-btn{background:#179ca0;color:#fff!important;padding:17px 24px;border-radius:2px}.mail-icon{margin-right:10px}.menu-toggle{display:none;background:none;border:0}.hero{height:520px;position:relative;overflow:hidden;background:#111}.hero-image{width:100%;height:100%;object-fit:cover;object-position:center 58%;display:block}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.82) 0%,rgba(0,0,0,.65) 28%,rgba(0,0,0,.22) 57%,rgba(0,0,0,.08) 100%)}.hero-inner{position:absolute;inset:0;max-width:1320px;margin:auto;padding:58px 58px 28px;display:flex;justify-content:space-between;align-items:flex-start}.hero-copy{width:470px;color:#fff}.hero h1{margin:0 0 20px;font-size:54px;line-height:1.13;letter-spacing:.18em;font-weight:700}.hero h1 span{display:block}.teal-dot{color:#18a2a5;margin-left:5px}.accent-line,.small-line{display:block;background:#179ca0}.accent-line{width:50px;height:3px;margin:18px 0 20px}.hero-lead{font-size:21px;line-height:1.35;letter-spacing:.045em;margin:0 0 16px}.hero-text{font-size:14px;line-height:1.55;letter-spacing:.04em;max-width:450px}.outline-btn{font:700 10px/1 Inter,Arial,sans-serif;text-transform:uppercase;letter-spacing:.18em;background:transparent;padding:15px 24px;min-width:240px;border:1px solid;text-decoration:none;display:inline-flex;justify-content:space-between;align-items:center;cursor:pointer;transition:.2s}.outline-btn.light{color:#fff;border-color:rgba(255,255,255,.8);margin-top:6px}.outline-btn.dark{color:#222;border-color:#888}.outline-btn:hover{background:#179ca0;color:#fff;border-color:#179ca0}.hero-meta{align-self:flex-end;color:#fff;font-size:10px;text-transform:uppercase;letter-spacing:.22em;line-height:1.7;text-align:right;padding-right:6px;border-right:2px solid #fff}.showcase{max-width:1440px;margin:auto;padding:30px 42px 34px;display:grid;grid-template-columns:1fr 1fr;gap:0}.showcase-block{min-width:0}.photo-block{padding-right:42px}.video-block{padding-left:42px;border-left:1px solid #d9d9d9}.section-heading h2{font-size:27px;letter-spacing:.19em;margin:0 0 9px;font-weight:700}.small-line{width:38px;height:2px}.eyebrow{font-size:10px;letter-spacing:.2em;color:#555;margin:12px 0 8px}.eyebrow b{padding:0 5px}.intro{font-size:12px;line-height:1.55;color:#6f6f6f;margin:0 0 20px}.home-photo-grid{display:grid;grid-template-columns:.8fr 1.1fr 1.1fr 1fr;height:190px;gap:9px}.photo-card,.masonry button{border:0;padding:0;background:none;overflow:hidden;cursor:zoom-in}.photo-card img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s}.photo-card:hover img,.masonry button:hover img{transform:scale(1.025)}.centered{margin:18px auto 0;display:flex}.video-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.video-card{height:92px;position:relative;overflow:hidden;background:#111;color:#fff;text-decoration:none}.video-card img{width:100%;height:100%;object-fit:cover;display:block;filter:brightness(.78);transition:.25s}.video-card:hover img{filter:brightness(.58);transform:scale(1.02)}.video-card strong{position:absolute;left:8px;right:6px;bottom:7px;font-size:9px;line-height:1.15;font-weight:500;text-shadow:0 1px 4px #000}.play{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:29px;height:29px;border:1.5px solid rgba(255,255,255,.95);border-radius:50%;display:grid;place-items:center;font-size:10px;padding-left:2px}.more-video{display:none}.video-grid.expanded .more-video{display:block}.full-gallery{background:#f5f5f3;padding:65px 28px}.gallery-inner{max-width:1300px;margin:auto}.gallery-title{margin-bottom:26px}.masonry{columns:4 250px;column-gap:12px}.masonry button{display:block;width:100%;margin:0 0 12px;break-inside:avoid}.masonry img{width:100%;height:auto;display:block;transition:transform .35s}.about{max-width:1180px;margin:85px auto;display:grid;grid-template-columns:400px 1fr;gap:80px;align-items:center;padding:0 28px}.about-image{height:490px;overflow:hidden;background:#eee}.about-image img{width:100%;height:100%;object-fit:cover;object-position:center 35%}.kicker{font-size:10px;letter-spacing:.24em;color:#179ca0;font-weight:700}.about h2,.contact h2{font-size:42px;letter-spacing:.12em;line-height:1.08;margin:12px 0}.about h3{font-size:15px;font-weight:600;margin:0 0 26px}.about p{font-family:Manrope,Arial,sans-serif;font-size:15px;line-height:1.75;color:#525252}.contact{background:#161616;color:#fff;padding:74px max(28px,calc((100vw - 1180px)/2));display:grid;grid-template-columns:1fr 1fr;gap:80px}.contact-copy{padding-top:25px}.contact-copy p{font-size:17px;line-height:1.6;max-width:480px;color:#ddd}.contact-cta{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #555;border-bottom:1px solid #555;padding:22px 0;margin:26px 0;text-decoration:none;color:#fff;font-size:18px}.contact-cta span{color:#179ca0}.contact small{color:#888;letter-spacing:.08em}footer{height:130px;display:flex;align-items:center;justify-content:space-between;max-width:1180px;margin:auto;padding:18px 28px;color:#888;font-size:11px}footer img{width:150px;height:85px;object-fit:contain}.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.92);z-index:100;display:none;align-items:center;justify-content:center;padding:40px}.lightbox.open{display:flex}.lightbox img{max-width:94vw;max-height:90vh;object-fit:contain}.lightbox-close{position:absolute;right:22px;top:12px;border:0;background:none;color:#fff;font-size:44px;cursor:pointer}.menu-toggle span{display:block;width:25px;height:2px;background:#111;margin:5px}
@media(max-width:1050px){.site-header{height:100px}.brand img{width:205px;height:84px}.main-nav{gap:18px}.main-nav a{font-size:9px}.contact-btn{padding:14px 17px}.hero{height:500px}.hero-inner{padding:48px 38px 26px}.hero h1{font-size:45px}.showcase{grid-template-columns:1fr}.photo-block{padding:0 0 38px}.video-block{padding:38px 0 0;border-left:0;border-top:1px solid #ddd}.home-photo-grid{height:230px}.about{grid-template-columns:340px 1fr;gap:45px}}
@media(max-width:760px){.site-header{height:92px}.header-inner{padding:0 18px}.brand img{width:190px;height:76px}.menu-toggle{display:block}.main-nav{position:absolute;left:0;right:0;top:92px;background:#fff;padding:22px;display:none;flex-direction:column;align-items:stretch;gap:0;box-shadow:0 8px 15px rgba(0,0,0,.1)}.main-nav.open{display:flex}.main-nav a{padding:13px 0;font-size:11px}.main-nav a::after{display:none}.contact-btn{text-align:center;margin-top:8px}.hero{height:560px}.hero-image{object-position:61% center}.hero-shade{background:linear-gradient(90deg,rgba(0,0,0,.84),rgba(0,0,0,.25))}.hero-inner{padding:54px 24px 22px}.hero-copy{width:92%}.hero h1{font-size:39px;letter-spacing:.13em}.hero-lead{font-size:18px}.hero-meta{display:none}.showcase{padding:34px 18px}.home-photo-grid{grid-template-columns:1fr 1fr;height:auto}.photo-card{height:230px}.video-grid{grid-template-columns:1fr 1fr}.video-card{height:125px}.about{margin:55px auto;grid-template-columns:1fr;padding:0 22px;gap:32px}.about-image{height:430px;max-width:360px}.about h2,.contact h2{font-size:34px}.contact{grid-template-columns:1fr;gap:22px;padding:56px 22px}footer{height:auto;padding:30px 22px;flex-direction:column;align-items:flex-start}.masonry{columns:2 150px}}


/* V5 refinements */
.hero h1 { letter-spacing: .18em; }
.hero h1 > span { white-space: nowrap; }
.teal-dot { margin-left: 0; letter-spacing: 0; }

/* More breathing room below the hero */
.showcase { padding-top: 52px; }
.section-heading { margin-top: 0; }

/* Larger video thumbnails */
.video-grid {
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}
.video-card {
  appearance: none;
  border: 0;
  padding: 0;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  cursor: pointer;
  text-align: left;
  font-family: inherit;
}
.video-card strong {
  left: 12px;
  right: 10px;
  bottom: 10px;
  font-size: 11px;
}
.play {
  width: 42px;
  height: 42px;
  font-size: 13px;
}
.more-video { display: none; }
.video-grid.expanded .more-video { display: block; }

/* Embedded YouTube player */
.video-modal {
  position: fixed;
  inset: 0;
  z-index: 120;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 28px;
  background: rgba(0,0,0,.9);
}
.video-modal.open { display: flex; }
.video-modal-inner {
  width: min(1100px, 94vw);
  position: relative;
}
.video-frame-wrap {
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
}
.video-frame-wrap iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
.video-close {
  position: absolute;
  right: -2px;
  top: -52px;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 42px;
  line-height: 1;
  cursor: pointer;
}

@media(max-width:760px){
  .showcase { padding-top: 42px; }
  .video-grid { grid-template-columns: 1fr; gap: 12px; }
  .video-card strong { font-size: 12px; }
  .hero h1 { letter-spacing: .11em; }
}


/* V6 — corrections demandées */
.hero h1 > span {
  display: block;
}
.hero h1 .teal-dot {
  display: inline !important;
  margin-left: 0 !important;
  letter-spacing: 0 !important;
}

/* Keep a little breathing room between the hero and the following content */
.showcase {
  padding-top: 56px;
}

/* Video player note */
.video-note {
  margin: 10px 2px 0;
  color: rgba(255,255,255,.68);
  font-size: 11px;
  letter-spacing: .08em;
  text-align: right;
}

@media(max-width:760px){
  .hero h1 .teal-dot { display:inline !important; }
  .showcase { padding-top: 44px; }
}


/* V7 — miniatures vidéo harmonisées avec l'identité LFAI */
.hero-inner {
  justify-content: flex-start;
}
.hero-meta {
  display: none !important;
}

.video-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.video-card {
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #101010;
  border: 0;
  border-radius: 0;
  cursor: pointer;
  isolation: isolate;
}

.video-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.9) contrast(1.03) brightness(.9);
  transform: scale(1.015);
  transition: transform .35s ease, filter .35s ease;
}

.video-tint {
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    linear-gradient(180deg, rgba(0,0,0,.18) 0%, rgba(0,0,0,.02) 38%, rgba(0,0,0,.78) 100%),
    linear-gradient(90deg, rgba(13,137,141,.14), transparent 45%);
  pointer-events: none;
}

.video-card:hover img {
  transform: scale(1.05);
  filter: saturate(1) contrast(1.05) brightness(.77);
}

.video-card .play {
  z-index: 4;
  width: 48px;
  height: 48px;
  border: 2px solid rgba(255,255,255,.95);
  background: rgba(0,0,0,.20);
  backdrop-filter: blur(3px);
  transition: .25s ease;
}

.video-card:hover .play {
  background: #179ca0;
  border-color: #179ca0;
  transform: translate(-50%, -50%) scale(1.08);
}

.video-card strong {
  z-index: 4;
  left: 18px;
  right: 18px;
  bottom: 16px;
  font-size: 13px;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: .015em;
  text-shadow: 0 2px 8px rgba(0,0,0,.65);
}

.video-category {
  position: absolute;
  z-index: 4;
  top: 16px;
  left: 18px;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: .22em;
  line-height: 1;
  text-transform: uppercase;
  padding-bottom: 7px;
}

.video-category::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 28px;
  height: 2px;
  background: #179ca0;
}

/* LFAI corner brackets */
.video-corner {
  position: absolute;
  z-index: 3;
  width: 17px;
  height: 17px;
  pointer-events: none;
  opacity: .95;
}
.video-corner.tl { top: 9px; left: 9px; border-top: 2px solid #179ca0; border-left: 2px solid #179ca0; }
.video-corner.tr { top: 9px; right: 9px; border-top: 2px solid #179ca0; border-right: 2px solid #179ca0; }
.video-corner.bl { bottom: 9px; left: 9px; border-bottom: 2px solid #179ca0; border-left: 2px solid #179ca0; }
.video-corner.br { bottom: 9px; right: 9px; border-bottom: 2px solid #179ca0; border-right: 2px solid #179ca0; }

.video-note {
  color: rgba(255,255,255,.72);
  font-size: 11px;
  text-align: center;
  letter-spacing: .04em;
}

/* Hero title: period sits immediately after each word */
.hero h1 > span {
  display: block;
  width: max-content;
}
.hero h1 .teal-dot {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
  letter-spacing: 0 !important;
}

/* More comfortable lower edge under the hero */
.showcase {
  padding-top: 62px;
}

@media(max-width:760px){
  .video-grid { grid-template-columns: 1fr; }
  .video-card strong { font-size: 13px; }
  .video-category { top: 14px; left: 16px; }
  .showcase { padding-top: 48px; }
}

/* V10 — masquer les noms/titres superposés en bas à gauche des miniatures vidéo */
.video-card .title,
.video-card .caption,
.video-card .label,
.video-card .name,
.video-thumb .title,
.video-thumb .caption,
.video-thumb .label,
.video-thumb .name,
.video-item .title,
.video-item .caption,
.video-item .label,
.video-item .name,
.video-tile .title,
.video-tile .caption,
.video-tile .label,
.video-tile .name {
  display: none !important;
}


/* V11 — 8 miniatures photo */
.home-photo-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-auto-rows: 150px;
  height: auto;
  gap: 9px;
}
.home-photo-grid .photo-card {
  height: 150px;
}
.home-photo-grid .photo-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media(max-width:1050px){
  .home-photo-grid { grid-template-columns: repeat(4, minmax(0,1fr)); grid-auto-rows: 140px; }
  .home-photo-grid .photo-card { height:140px; }
}
@media(max-width:760px){
  .home-photo-grid { grid-template-columns: repeat(2, minmax(0,1fr)); grid-auto-rows: 180px; }
  .home-photo-grid .photo-card { height:180px; }
}


/* V12 — textes des sections Photo et Vidéo légèrement agrandis */
.showcase-block .section-heading h2 {
  font-size: 30px;
}
.showcase-block .eyebrow {
  font-size: 11px;
  line-height: 1.5;
}
.showcase-block .intro {
  font-size: 14px;
  line-height: 1.6;
}

@media(max-width:760px){
  .showcase-block .section-heading h2 {
    font-size: 28px;
  }
  .showcase-block .eyebrow {
    font-size: 10px;
  }
  .showcase-block .intro {
    font-size: 13px;
  }
}


/* V13 — suppression réelle des noms de vidéos sur les miniatures */
.video-card > strong,
.video-card strong {
  display: none !important;
}

/* Catégories vidéo : CORPORATE, SÉCURITÉ, INDUSTRIE, etc. plus lisibles */
.video-card .video-category {
  font-size: 12px !important;
  line-height: 1.25;
  font-weight: 700;
  letter-spacing: .11em;
}
@media(max-width:760px){
  .video-card .video-category {
    font-size: 11px !important;
  }
}

/* V21 — navigation dans la galerie photo */
.lightbox-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  z-index:4;
  width:52px;
  height:52px;
  border:1px solid rgba(255,255,255,.55);
  border-radius:50%;
  background:rgba(0,0,0,.38);
  color:#fff;
  font-size:40px;
  line-height:44px;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  backdrop-filter:blur(4px);
}
.lightbox-prev{left:24px;}
.lightbox-next{right:24px;}
@media (max-width:700px){
  .lightbox-nav{
    width:42px;
    height:42px;
    font-size:32px;
    line-height:36px;
    background:rgba(0,0,0,.48);
  }
  .lightbox-prev{left:8px;}
  .lightbox-next{right:8px;}
}

/* V29 — bouton hero mobile : éviter tout débordement du libellé */
@media(max-width:760px){
  .hero .outline-btn{
    min-width:0;
    width:auto;
    max-width:100%;
    padding:14px 16px;
    gap:14px;
    font-size:9px;
    letter-spacing:.13em;
    white-space:nowrap;
  }
  .hero .outline-btn span{
    flex:0 0 auto;
  }
}
@media(max-width:390px){
  .hero .outline-btn{
    font-size:8.5px;
    letter-spacing:.10em;
    padding-left:13px;
    padding-right:13px;
  }
}


/* V30 — hero desktop : conserver tout le contenu et le CTA dans l'image */
@media(min-width:761px){
  .hero{height:620px;}
  .hero-inner{padding-top:46px;padding-bottom:36px;}
  .hero h1{font-size:50px;margin-bottom:14px;}
  .accent-line{margin:14px 0 16px;}
  .hero-lead{margin-bottom:12px;}
  .hero-text{margin-top:0;margin-bottom:12px;}
}

/* V32 — hero desktop distinct, image mobile conservée */
.hero-picture{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
}
.hero-picture .hero-image{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
}

/* V33 — cadrage hero contrôlé sur ordinateur */
@media (min-width:761px){
  .hero{
    height:590px;
  }
  .hero-picture{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    display:block;
  }
  .hero-picture .hero-image{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:58% center;
    display:block;
  }
}

/* Mobile : comportement et cadrage précédents conservés */
@media (max-width:760px){
  .hero-picture{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    display:block;
  }
  .hero-picture .hero-image{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:61% center;
    display:block;
  }
}

/* V34 — desktop : photo entière, ratio conservé, aucun recadrage */
@media (min-width:761px){
  .hero{
    height:auto !important;
    min-height:0;
    position:relative;
    overflow:hidden;
  }
  .hero-picture{
    position:relative !important;
    inset:auto !important;
    display:block;
    width:100%;
    height:auto !important;
    line-height:0;
  }
  .hero-picture .hero-image{
    position:relative;
    width:100%;
    height:auto !important;
    object-fit:contain !important;
    object-position:center !important;
    display:block;
  }
  .hero-shade{
    position:absolute;
    inset:0;
  }
  .hero-inner{
    position:absolute;
    inset:0;
  }
}

/* Mobile : conserver le hero fixe et son cadrage actuel */
@media (max-width:760px){
  .hero{
    height:560px !important;
  }
  .hero-picture{
    position:absolute !important;
    inset:0 !important;
    width:100%;
    height:100% !important;
  }
  .hero-picture .hero-image{
    width:100%;
    height:100% !important;
    object-fit:cover !important;
    object-position:61% center !important;
  }
}

/* V35 — desktop : hero aligné sur la largeur du contenu Photo/Vidéo */
@media (min-width:761px){
  .hero{
    width:min(1180px, calc(100% - 48px));
    margin:24px auto 0;
    height:auto !important;
    min-height:0 !important;
    position:relative;
    overflow:hidden;
  }
  .hero-picture{
    position:relative !important;
    inset:auto !important;
    width:100%;
    height:auto !important;
    display:block;
    line-height:0;
  }
  .hero-picture .hero-image{
    width:100%;
    height:auto !important;
    object-fit:contain !important;
    object-position:center !important;
    display:block;
  }
  .hero-shade,
  .hero-inner{
    position:absolute;
    inset:0;
  }
}
/* Mobile inchangé */
@media (max-width:760px){
  .hero{
    width:100%;
    margin:0;
    height:560px !important;
  }
}

/* V36 — fond noir pleine largeur, photo alignée sur le conteneur principal */
@media (min-width:761px){
  .hero{
    width:100% !important;
    max-width:none !important;
    margin:24px 0 0 !important;
    height:auto !important;
    min-height:0 !important;
    position:relative;
    overflow:hidden;
    background:#000;
  }

  .hero-picture{
    position:relative !important;
    inset:auto !important;
    display:block;
    width:min(1200px, calc(100% - 40px)) !important;
    max-width:1200px;
    height:auto !important;
    margin:0 auto;
    line-height:0;
  }

  .hero-picture .hero-image{
    position:relative;
    display:block;
    width:100%;
    height:auto !important;
    object-fit:contain !important;
    object-position:center !important;
  }

  /* Le noir suit exactement la hauteur créée par la photo */
  .hero-shade{
    position:absolute;
    inset:0;
  }

  /* Texte aligné sur la même largeur que les blocs de contenu */
  .hero-inner{
    position:absolute;
    inset:0;
    width:min(1200px, calc(100% - 40px));
    max-width:1200px;
    margin:0 auto;
  }
}

/* Mobile inchangé */
@media (max-width:760px){
  .hero{
    width:100% !important;
    margin:0 !important;
    height:560px !important;
  }
  .hero-picture{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
  }
}