
  :root{
    --ink:#1E1147;
    --violet:#6C3FE0;
    --blue-violet:#5B5FEF;
    --pink:#FF6FA8;
    --pink-soft:#FFD4E7;
    --lavender:#F4F0FF;
    --paper:#FDFBFF;
    --line:rgba(30,17,71,0.12);
    --ink-soft:rgba(30,17,71,0.68);
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Manrope', sans-serif;
    color:var(--ink);
    background:var(--paper);
    line-height:1.6;
    overflow-x:hidden;
  }
  h1,h2,h3,.brand{ font-family:'Space Grotesk', sans-serif; }
  a{ color:inherit; text-decoration:none; }
  img,svg{ display:block; max-width:100%; }
  .wrap{ max-width:1120px; margin:0 auto; padding:0 28px; }

  /* ---------- NAV ---------- */
  header{
    position:sticky; top:0; z-index:50;
    background:rgba(253,251,255,0.86);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  nav.wrap{ display:flex; align-items:center; justify-content:space-between; height:76px; }
  .brand{ display:flex; align-items:center; gap:12px; font-weight:700; font-size:1.15rem; }
  .brand .mark{ width:44px; height:44px; border-radius:50%; object-fit:cover; object-position:center 35%; flex-shrink:0; }
  .nav-links{ display:flex; gap:36px; font-weight:600; font-size:0.95rem; }
  .nav-links a{ position:relative; padding:6px 0; }
  .nav-links a::after{
    content:''; position:absolute; left:0; bottom:0; height:2px; width:0;
    background:var(--pink); transition:width .25s ease;
  }
  .nav-links a:hover::after{ width:100%; }
  .nav-cta{
    background:var(--ink); color:#fff; padding:10px 20px; border-radius:999px;
    font-weight:600; font-size:0.9rem;
  }
  .burger{ display:none; width:26px; height:20px; position:relative; cursor:pointer; }
  .burger span{ position:absolute; left:0; width:100%; height:2px; background:var(--ink); }
  .burger span:nth-child(1){ top:0; }
  .burger span:nth-child(2){ top:9px; }
  .burger span:nth-child(3){ top:18px; }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    background:radial-gradient(120% 140% at 15% 0%, #3A2470 0%, var(--ink) 55%, #150B33 100%);
    color:#fff;
    padding:96px 0 280px;
    overflow:hidden;
  }
  .hero-grid{
    display:grid; grid-template-columns:1.75fr 0.8fr; gap:6px; align-items:center;
    position:relative; z-index:2;
  }
  .kicker{
    display:inline-flex; align-items:center; gap:8px;
    background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.18);
    padding:7px 16px; border-radius:999px; font-size:0.85rem; font-weight:600;
    color:var(--pink-soft); margin-bottom:18px;
  }
  .kicker .dot{ width:7px; height:7px; border-radius:50%; background:var(--pink); }
  .hero h1{
    font-size:clamp(2rem, 3.6vw, 3.1rem); line-height:1.05; font-weight:700; letter-spacing:-0.01em;
    margin-bottom:16px;
  }
  .hero h1 em{ font-style:normal; color:var(--pink-soft); }
  .hero p{ font-size:1.05rem; color:rgba(255,255,255,0.78); max-width:600px; margin-bottom:26px; }
  .hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }
  .btn-primary{
    background:var(--pink); color:var(--ink); padding:14px 28px; border-radius:999px;
    font-weight:700; font-size:0.98rem; box-shadow:0 12px 30px -10px rgba(255,111,168,0.6);
  }
  .btn-ghost{
    border:1px solid rgba(255,255,255,0.3); color:#fff; padding:14px 26px; border-radius:999px;
    font-weight:600; font-size:0.98rem;
  }
  .hero-figure{ position:relative; margin-left:-34px; }
  .hero-mascot{ width:100%; max-width:520px; margin:0 auto; display:block; }
  .hero-contact{
    text-align:center; margin-top:14px; font-size:0.95rem;
    color:rgba(255,255,255,0.75); display:flex; align-items:center; justify-content:center; gap:10px;
    flex-wrap:wrap;
  }
  .hero-contact a{ color:var(--pink-soft); font-weight:600; }
  .hero-contact a:hover{ text-decoration:underline; }
  .hero-contact .dot-sep{ color:rgba(255,255,255,0.4); }
  .blob-bg{ position:absolute; inset:-10% -20% auto auto; z-index:0; opacity:0.5; }

  /* ---------- GALERIE PATCHWORK ---------- */
  .patchwork{
    position:relative;
    margin-top:-260px;
    padding:75px 5vw 10px;
    background:linear-gradient(180deg,
      rgba(21,11,51,0) 0%,
      rgba(58,36,112,0.5) 14%,
      rgba(91,63,160,0.8) 30%,
      rgba(177,153,238,0.92) 50%,
      var(--paper) 78%);
    overflow:visible;
  }
  .patchwork-inner{
    position:relative; z-index:2;
    max-width:1180px; margin:0 auto;
    display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:center;
    gap:14px 10px;
  }
  .pcard{
    background:#fff; padding:8px 8px 22px; border-radius:6px;
    box-shadow:0 18px 34px -14px rgba(20,10,50,0.45);
  }
  .pcard img{ display:block; border-radius:2px; }
  .pw-l{ width:260px; }
  .pw-l img{ width:100%; height:190px; object-fit:cover; }
  .pw-m{ width:200px; margin-top:26px; }
  .pw-m img{ width:100%; height:150px; object-fit:cover; }
  .pw-s{ width:160px; margin-top:44px; }
  .pw-s img{ width:100%; height:120px; object-fit:cover; }

  .patchwork-overlay{
    position:absolute; z-index:6;
    left:50%; top:250px; width:0; height:0;
    pointer-events:none;
  }
  .patchwork-overlay .pcard{ position:absolute; top:0; pointer-events:auto; }
  .patchwork-overlay .pcard.ov-left{ left:-295px; transform:translate(-50%,-38%) rotate(-7deg); }
  .patchwork-overlay .pcard.ov-center{ left:0; transform:translate(-50%,-50%) rotate(4deg); }
  .patchwork-overlay .pcard.ov-right{ left:295px; transform:translate(-50%,-28%) rotate(-3deg); }

  /* ---------- SECTION HEADS ---------- */
  .section{ padding:110px 0; }
  .section-head{ max-width:600px; margin-bottom:64px; }
  .section-head .label{ color:var(--violet); font-weight:700; font-size:0.95rem; margin-bottom:14px; display:block; }
  .section-head h2{ font-size:clamp(1.8rem, 3vw, 2.4rem); line-height:1.18; font-weight:700; }
  .section-head p{ color:var(--ink-soft); margin-top:16px; font-size:1.05rem; }

  /* ---------- SERVICES ---------- */
  .service{
    display:grid; grid-template-columns:0.95fr 1.05fr; gap:64px; align-items:center;
    padding:56px 0; border-top:1px solid var(--line);
  }
  .service:last-child{ border-bottom:1px solid var(--line); }
  .service.reverse .service-visual{ order:2; }
  .service.reverse .service-text{ order:1; }
  .service-text .tag{
    display:inline-block; font-weight:700; font-size:0.82rem; padding:5px 14px;
    border-radius:999px; margin-bottom:18px;
  }
  .service-text h3{ font-size:1.7rem; margin-bottom:16px; font-weight:700; }
  .service-text p{ color:var(--ink-soft); font-size:1.02rem; margin-bottom:20px; }
  .service-text ul{ list-style:none; }
  .service-text li{
    position:relative; padding-left:24px; margin-bottom:10px; font-size:0.98rem; color:var(--ink);
  }
  .service-text li::before{
    content:''; position:absolute; left:0; top:9px; width:9px; height:9px; border-radius:50%;
  }
  .service-visual{ position:relative; border-radius:24px; padding:32px; min-height:280px; display:flex; align-items:center; justify-content:center; }

  /* Web design visual: browser mock */
  .browser-mock{ width:100%; background:#fff; border-radius:16px; box-shadow:0 30px 60px -30px rgba(30,17,71,0.35); overflow:hidden; }
  .browser-bar{ display:flex; gap:6px; padding:12px 14px; background:#EFEAFB; }
  .browser-bar span{ width:9px; height:9px; border-radius:50%; background:#D8CDF5; }
  .browser-body{ padding:20px; }
  .browser-body .line{ height:10px; border-radius:5px; margin-bottom:10px; background:var(--lavender); }
  .browser-body .blocks{ display:flex; gap:10px; margin-top:16px; }
  .browser-body .blocks div{ flex:1; height:56px; border-radius:10px; }

  /* App visual: phone mock */
  .phone-mock{
    width:180px; height:340px; background:var(--ink); border-radius:32px; padding:10px;
    box-shadow:0 30px 60px -25px rgba(30,17,71,0.4);
  }
  .phone-screen{ width:100%; height:100%; border-radius:24px; background:linear-gradient(180deg,#EFEAFB, #fff); padding:18px 14px; }
  .phone-screen .app-icon{ width:38px; height:38px; border-radius:11px; margin-bottom:14px; }
  .phone-screen .row{ height:12px; border-radius:6px; background:#E4DAF7; margin-bottom:8px; }
  .phone-screen .row.short{ width:60%; }
  .phone-screen .card{ margin-top:16px; height:70px; border-radius:14px; }

  /* 3D visual */
  .print-mock{ position:relative; width:220px; height:220px; }
  .print-layer{
    position:absolute; left:50%; transform:translateX(-50%);
    border-radius:14px;
  }

  /* ---------- ABOUT ---------- */
  .about{ background:var(--lavender); }
  .about-grid{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:60px; align-items:center; }
  .about-card{
    background:#fff; border-radius:24px; padding:36px; box-shadow:0 30px 70px -40px rgba(30,17,71,0.3);
  }
  .about-mascot{ width:100%; max-width:220px; margin:0 auto; display:block; }
  .stat-row{ display:flex; gap:36px; margin-top:28px; }
  .stat{ }
  .stat .num{ font-family:'Space Grotesk'; font-size:2.2rem; font-weight:700; color:var(--violet); }
  .stat .lbl{ font-size:0.88rem; color:var(--ink-soft); }
  .about-text h2{ font-size:clamp(1.8rem,3vw,2.3rem); margin-bottom:20px; font-weight:700; }
  .about-text p{ color:var(--ink-soft); margin-bottom:16px; font-size:1.05rem; }
  .chip-row{ display:flex; flex-wrap:wrap; gap:10px; margin-top:22px; }
  .chip{
    background:#fff; border:1px solid var(--line); padding:8px 16px; border-radius:999px;
    font-size:0.85rem; font-weight:600; color:var(--violet);
  }

  /* ---------- CONTACT ---------- */
  .contact{
    background:linear-gradient(160deg, var(--ink), #2A1863 60%, var(--violet));
    color:#fff; border-radius:32px; margin:0 28px; padding:72px 48px;
    position:relative; overflow:hidden;
  }
  .contact-inner{ max-width:1064px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:56px; position:relative; z-index:2; }
  .contact h2{ font-size:clamp(1.8rem,3vw,2.3rem); margin-bottom:18px; }
  .contact p.lead{ color:rgba(255,255,255,0.75); margin-bottom:32px; max-width:420px; }
  .info-item{ display:flex; gap:16px; align-items:flex-start; margin-bottom:22px; }
  .info-item .ico{
    width:42px; height:42px; border-radius:12px; background:rgba(255,255,255,0.1);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
  }
  .info-item .txt .h{ font-weight:700; font-size:0.98rem; margin-bottom:2px; }
  .info-item .txt .s{ color:rgba(255,255,255,0.7); font-size:0.95rem; }
  .contact-card{
    background:rgba(255,255,255,0.06); border:1px solid rgba(255,255,255,0.15);
    border-radius:20px; padding:32px;
  }
  .contact-card h3{ font-size:1.15rem; margin-bottom:18px; }
  .contact-card .big-link{
    display:block; font-family:'Space Grotesk'; font-size:1.6rem; font-weight:700; color:var(--pink-soft);
    margin-bottom:6px;
  }
  .contact-card .small{ color:rgba(255,255,255,0.65); font-size:0.9rem; margin-bottom:22px; }

  footer{ text-align:center; padding:40px 20px 50px; color:var(--ink-soft); font-size:0.88rem; }

  /* ---------- INTRO : GALAXIE + FENETRE QUI GROSSIT ---------- */
  body.locked{ overflow:hidden; height:100vh; }
  .intro{
    position:fixed; inset:0; z-index:9999;
    background:radial-gradient(ellipse at 50% 42%, #1B1140 0%, #05030f 72%);
    display:flex; align-items:center; justify-content:center;
    overflow:hidden;
    transition:opacity .15s ease;
  }
  .intro.hidden{ opacity:0; pointer-events:none; }
  .stars{ position:absolute; inset:0; }
  .galaxy-bg{
    position:absolute; inset:-2%; z-index:0;
    background-size:cover; background-position:center;
    filter:saturate(1.1);
  }
  .star{ position:absolute; background:#fff; border-radius:50%; }
  @keyframes twinkle{ 0%,100%{ opacity:.25; } 50%{ opacity:1; } }
  .site-window{
    position:absolute; top:50%; left:50%; width:100vw; height:100vh;
    background:radial-gradient(120% 140% at 15% 0%, #3A2470 0%, var(--ink) 55%, #150B33 100%);
    overflow:hidden;
    box-shadow:0 0 60px 30px rgba(108,63,224,0.35);
    transform:translate(-50%,-50%) scale(0.015);
    transform-origin:center center;
    transition:transform 3s linear;
  }
  .site-window-inner{ position:absolute; inset:0; overflow:hidden; }
  .intro.grow .site-window{
    transform:translate(-50%,-50%) scale(1);
  }

  @media (max-width: 880px){
    .nav-links{ display:none; }
    .nav-cta{ display:none; }
    .burger{ display:block; }
    .hero{ padding-bottom:130px; }
    .hero-grid{ grid-template-columns:1fr; }
    .hero-figure{ order:-1; margin-left:0; margin-bottom:10px; }
    .patchwork{ margin-top:-110px; padding-top:30px; }
    .patchwork-inner{ gap:10px; }
    .pw-l, .pw-m, .pw-s{ width:calc(50% - 5px); margin-top:0; }
    .pw-l img, .pw-m img, .pw-s img{ height:120px; }
    .patchwork-overlay{ top:auto; position:relative; left:auto; width:100%; margin-top:18px; display:flex; justify-content:center; align-items:center; height:110px; }
    .patchwork-overlay .pcard{ position:absolute; width:110px; }
    .patchwork-overlay .pcard img{ height:80px; }
    .patchwork-overlay .pcard.ov-left{ left:50%; transform:translate(-125%,-50%) rotate(-7deg); }
    .patchwork-overlay .pcard.ov-center{ left:50%; top:50%; transform:translate(-50%,-50%) rotate(4deg); z-index:2; }
    .patchwork-overlay .pcard.ov-right{ left:50%; transform:translate(25%,-50%) rotate(-3deg); }
    .service, .service.reverse{ grid-template-columns:1fr; }
    .service .service-visual, .service.reverse .service-visual{ order:-1; }
    .about-grid{ grid-template-columns:1fr; }
    .contact-inner{ grid-template-columns:1fr; }
    .contact{ margin:0 14px; padding:52px 24px; }
    .section{ padding:76px 0; }
  }

html{scroll-padding-top:100px} a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #6C3FE0;outline-offset:5px}
.burger{border:0;background:transparent;flex-shrink:0}.nav-links{gap:22px}.nav-links a[aria-current=page]{color:var(--violet)}
.service-link{display:inline-block;margin-top:24px;color:var(--violet);font-weight:800;text-decoration:underline;text-underline-offset:5px}
.activity-nav{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.activity-nav a{border:1px solid var(--line);padding:10px 16px;border-radius:24px;font-weight:700;background:white}
.detail-hero{padding:38px 0 72px;background:var(--ink);color:white}.crumb{font-size:.9rem;color:var(--pink-soft);margin-bottom:40px}.crumb a{text-decoration:underline}
.detail-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:56px;align-items:center}.detail-hero h1{font-size:clamp(2.2rem,4.4vw,3.5rem);line-height:1.1;letter-spacing:-.03em;margin:18px 0 24px}.detail-hero p{color:#e0d9f0;font-size:1.08rem;margin-bottom:28px}.detail-hero .btn-primary,.detail-hero .btn-ghost{display:inline-block}
.detail-picture{background:var(--lavender);padding:18px;border-radius:18px;transform:rotate(2deg)}.detail-picture img{width:100%;max-height:340px;object-fit:contain;border-radius:8px}.detail-picture figcaption{color:var(--ink);font-size:.9rem;margin-top:14px}
.detail-section{padding:72px 0}.detail-section h2{font-size:clamp(1.7rem,3vw,2.3rem);line-height:1.2;margin-bottom:22px}.detail-section .intro-text{max-width:760px;color:var(--ink-soft);margin-bottom:32px}
.detail-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.detail-card{padding:28px;border:1px solid var(--line);border-radius:16px;background:white}.detail-card h3{font-size:1.15rem;margin-bottom:12px}.detail-card p{color:var(--ink-soft)}.soft-section{background:var(--lavender)}
.steps{list-style:none;counter-reset:step;display:grid;grid-template-columns:repeat(3,1fr);gap:30px}.steps li{counter-increment:step}.steps li:before{content:'0' counter(step);display:block;font-family:'Space Grotesk',sans-serif;color:var(--violet);font-size:2rem;font-weight:700;margin-bottom:10px}.steps h3{margin-bottom:10px}.steps p{color:var(--ink-soft)}
.faq-list{max-width:820px}.faq-list details{border-bottom:1px solid var(--line);padding:20px 0}.faq-list summary{font-weight:700;cursor:pointer;font-size:1.05rem}.faq-list p{padding:14px 0 0;color:var(--ink-soft)}.detail-contact{background:var(--ink);color:white;border-radius:24px;padding:44px}.detail-contact p{max-width:720px;margin-bottom:24px;color:#e0d9f0}.detail-contact a{overflow-wrap:anywhere}.detail-contact .btn-primary{display:inline-block}.contact-email{display:inline-block;margin-top:18px;text-decoration:underline}.site-footer-links{display:flex;justify-content:center;gap:20px;flex-wrap:wrap;margin-bottom:16px}.site-footer-links a{text-decoration:underline}
@media(max-width:880px){.detail-grid{grid-template-columns:1fr;gap:32px}.detail-picture{max-width:520px;transform:none}.detail-cards,.steps{grid-template-columns:1fr}.detail-hero{padding-bottom:44px}.detail-section{padding:48px 0}.detail-contact{padding:28px 22px}.nav-links.is-open{display:flex;position:absolute;top:76px;left:0;right:0;background:white;flex-direction:column;padding:20px 28px;gap:16px;border-bottom:1px solid var(--line)}.hero-contact a{overflow-wrap:anywhere}.contact .s{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}

/* Patchworks des pages activités */
.hero-collage{position:relative;isolation:isolate;width:100%;height:440px;max-width:470px;margin:0 auto}
.collage-card{position:absolute;width:64%;padding:9px 9px 12px;background:#fff;border-radius:7px;box-shadow:0 16px 32px rgba(8,3,27,.32);border:1px solid rgba(30,17,71,.08)}
.collage-card img{width:100%;height:168px;object-fit:contain;background:#f4f0ff;border-radius:3px}
.collage-card figcaption{font-size:.875rem;line-height:1.3;color:var(--ink);font-weight:600;padding-top:9px}
.collage-card-1{left:1%;top:12px;transform:rotate(-9deg);z-index:1}
.collage-card-2{right:0;top:92px;transform:rotate(7deg);z-index:2}
.collage-card-3{left:2%;top:226px;transform:rotate(-5deg);z-index:3;width:56%}
.collage-card-4{right:0;top:280px;transform:rotate(9deg);z-index:4;width:49%}
.collage-card-3 img{height:138px}.collage-card-4 img{height:108px}
.collage-mascot{left:4%;top:246px;width:40%;transform:rotate(-9deg);background:#ffd4e7}.collage-mascot img{height:116px;background:transparent}
@media(max-width:880px){.hero-collage{max-width:460px;height:455px;margin-top:8px}.detail-grid{gap:32px}}
@media(max-width:480px){.hero-collage{height:380px;max-width:340px}.collage-card{padding:6px 6px 9px}.collage-card img{height:126px}.collage-card figcaption{font-size:.8rem}.collage-card-1{left:3%;top:14px}.collage-card-2{right:2%;top:88px}.collage-card-3{left:3%;top:195px}.collage-card-3 img{height:108px}.collage-card-4{right:2%;top:253px}.collage-card-4 img{height:86px}.collage-mascot{top:229px}.collage-mascot img{height:86px}}

/* Légendes intégrées aux tirages, dégagées des superpositions. */
.hero-collage{height:470px}
.collage-card{display:flex;flex-direction:column}
.collage-card figcaption{font-size:.875rem;line-height:1.4;padding:9px 2px 0}
.collage-card-1 figcaption,.collage-card-2 figcaption{order:-1;padding:0 2px 9px}
.collage-card-3{width:46%;top:245px;left:1%}
.collage-card-4{top:295px;right:0;width:46%}
@media(max-width:880px){.hero-collage{height:470px}}
@media(max-width:480px){.hero-collage{height:410px}.collage-card figcaption{font-size:.875rem}.collage-card-3{width:46%;left:2%;top:219px}.collage-card-4{width:46%;right:1%;top:271px}.collage-card-3 img{height:108px}}

/* Galerie d’accueil : chaque réalisation possède sa place. */
.home-gallery{margin-top:-210px;padding:44px 28px 32px;overflow:visible}
.home-gallery-inner{position:relative;z-index:2;max-width:1160px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:26px 20px}
.home-photo{flex:0 0 calc((100% - 60px)/4);min-width:0;margin:0;padding:8px 8px 12px;background:white;border-radius:6px;box-shadow:0 12px 25px -12px rgba(30,17,71,.45);transform:rotate(var(--tilt))}
.home-photo:nth-child(-n+5){flex-basis:calc((100% - 80px)/5)}
.home-photo img{width:100%;height:155px;object-fit:contain;border-radius:3px;background:#f5f2fa}
.home-photo figcaption{font-size:.875rem;line-height:1.4;margin-top:10px;color:var(--ink);font-weight:600;overflow-wrap:anywhere}
.home-photo:nth-child(even){margin-top:8px}
@media(max-width:880px){.home-gallery{margin-top:-100px;padding:28px 24px}.home-gallery-inner{gap:24px 18px}.home-photo,.home-photo:nth-child(-n+5){flex-basis:calc((100% - 36px)/3)}.home-photo img{height:145px}}
@media(max-width:580px){.home-gallery{padding:24px 20px}.home-gallery-inner{gap:22px 14px}.home-photo,.home-photo:nth-child(-n+5){flex-basis:calc((100% - 14px)/2);padding:6px 6px 10px}.home-photo img{height:125px}.home-photo figcaption{font-size:.875rem}.home-photo:nth-child(even){margin-top:6px}}

@media(max-width:580px){.about-grid>*{min-width:0}.about-card{padding:24px 18px}.stat-row{gap:14px;justify-content:space-between}.stat{min-width:0;flex:1}.stat .num{font-size:1.8rem}}
/* Un patchwork plus libre, avec chevauchements limités aux bords. */
.home-gallery-inner{gap:12px 0;align-items:center;padding:18px 10px 28px}
.home-photo,.home-photo:nth-child(-n+5){flex:0 0 22%;margin:0 -3px;padding:8px 8px 12px;transform:rotate(var(--tilt));position:relative}
.home-photo:nth-child(4n+1){flex-basis:27%;transform:rotate(-6deg);z-index:2}
.home-photo:nth-child(4n+2){flex-basis:21%;transform:translateY(12px) rotate(5deg);z-index:3}
.home-photo:nth-child(4n+3){flex-basis:24%;transform:translateY(-8px) rotate(-3deg);z-index:1}
.home-photo:nth-child(4n){flex-basis:26%;transform:translateY(10px) rotate(6deg);z-index:2}
.home-photo img{height:150px}.home-photo:nth-child(4n+1) img{height:185px}.home-photo:nth-child(4n) img{height:170px}
.home-photo:last-child{flex-basis:25%;transform:translateY(-4px) rotate(-5deg)}
@media(max-width:880px){.home-gallery-inner{padding:18px 4px 24px;gap:20px 0}.home-photo,.home-photo:nth-child(-n+5),.home-photo:last-child{flex-basis:32%;margin:0 -1px}.home-photo img,.home-photo:nth-child(4n+1) img,.home-photo:nth-child(4n) img{height:145px}}
@media(max-width:580px){.home-gallery{padding:24px 22px}.home-gallery-inner{gap:22px 0;padding:18px 0 24px}.home-photo,.home-photo:nth-child(-n+5),.home-photo:last-child{flex-basis:50%;margin:0 -2px;padding:6px 6px 10px}.home-photo:nth-child(odd){transform:rotate(-5deg);z-index:2}.home-photo:nth-child(even){transform:translateY(16px) rotate(4deg);z-index:1}.home-photo img,.home-photo:nth-child(4n) img{height:120px}.home-photo:nth-child(4n+1) img{height:145px}.home-photo:last-child{flex-basis:58%;transform:rotate(-4deg)}.home-photo figcaption{font-size:.875rem;line-height:1.4}}

@media(max-width:880px){.home-gallery .home-photo:nth-child(n){flex-basis:32%}}
@media(max-width:580px){.home-gallery .home-photo:nth-child(n){flex-basis:50%}.home-gallery .home-photo:last-child{flex-basis:58%}}
/* Photos jetées sur une table : composition libre, indépendante des rangées. */
.home-gallery-inner{display:block;position:relative;height:730px;max-width:1120px;padding:0;margin:0 auto}
.home-gallery .home-photo:nth-child(n){position:absolute;flex:none;margin:0;padding:8px 8px 15px;width:24%;transform:rotate(var(--angle));left:var(--x);top:var(--y);z-index:var(--z);box-shadow:0 12px 22px -7px rgba(19,8,47,.48)}
.home-gallery .home-photo img{height:160px;object-fit:contain}
.home-gallery .home-photo:nth-child(1){--x:1%;--y:20px;--angle:-14deg;--z:2;width:26%}
.home-gallery .home-photo:nth-child(2){--x:23%;--y:75px;--angle:10deg;--z:4;width:22%}
.home-gallery .home-photo:nth-child(3){--x:44%;--y:4px;--angle:-7deg;--z:2;width:27%}
.home-gallery .home-photo:nth-child(4){--x:72%;--y:62px;--angle:16deg;--z:3;width:23%}
.home-gallery .home-photo:nth-child(5){--x:7%;--y:245px;--angle:7deg;--z:5;width:25%}
.home-gallery .home-photo:nth-child(6){--x:32%;--y:207px;--angle:-17deg;--z:6;width:23%}
.home-gallery .home-photo:nth-child(7){--x:57%;--y:206px;--angle:9deg;--z:5;width:22%}
.home-gallery .home-photo:nth-child(8){--x:77%;--y:287px;--angle:-12deg;--z:6;width:22%}
.home-gallery .home-photo:nth-child(9){--x:0%;--y:439px;--angle:-11deg;--z:7;width:25%}
.home-gallery .home-photo:nth-child(10){--x:24%;--y:425px;--angle:15deg;--z:8;width:20%}
.home-gallery .home-photo:nth-child(11){--x:44%;--y:445px;--angle:-8deg;--z:7;width:26%}
.home-gallery .home-photo:nth-child(12){--x:70%;--y:486px;--angle:13deg;--z:9;width:22%}
.home-gallery .home-photo:nth-child(13){--x:48%;--y:600px;--angle:18deg;--z:10;width:19%}
.home-gallery .home-photo:nth-child(13) img{height:110px}
@media(max-width:880px){.home-gallery-inner{height:650px}.home-gallery .home-photo img{height:130px}.home-gallery .home-photo:nth-child(13){--y:520px}.home-gallery .home-photo:nth-child(12){--y:440px}}
@media(max-width:580px){
.home-gallery{padding:24px 26px 38px}.home-gallery-inner{height:1220px}
.home-gallery .home-photo:nth-child(n){width:56%;padding:6px 6px 12px}.home-gallery .home-photo img{height:123px}
.home-gallery .home-photo:nth-child(1){--x:0%;--y:18px;--angle:-13deg;--z:2}
.home-gallery .home-photo:nth-child(2){--x:45%;--y:69px;--angle:14deg;--z:3;width:51%}
.home-gallery .home-photo:nth-child(3){--x:4%;--y:196px;--angle:8deg;--z:5;width:61%}
.home-gallery .home-photo:nth-child(4){--x:48%;--y:251px;--angle:-12deg;--z:6;width:49%}
.home-gallery .home-photo:nth-child(5){--x:0%;--y:381px;--angle:-16deg;--z:7}
.home-gallery .home-photo:nth-child(6){--x:43%;--y:418px;--angle:9deg;--z:8}
.home-gallery .home-photo:nth-child(7){--x:3%;--y:555px;--angle:11deg;--z:10;width:51%}
.home-gallery .home-photo:nth-child(8){--x:43%;--y:597px;--angle:-8deg;--z:9;width:57%}
.home-gallery .home-photo:nth-child(9){--x:0%;--y:735px;--angle:-10deg;--z:12;width:60%}
.home-gallery .home-photo:nth-child(10){--x:49%;--y:783px;--angle:16deg;--z:13;width:48%}
.home-gallery .home-photo:nth-child(11){--x:3%;--y:908px;--angle:12deg;--z:14;width:57%}
.home-gallery .home-photo:nth-child(12){--x:44%;--y:972px;--angle:-13deg;--z:15;width:55%}
.home-gallery .home-photo:nth-child(13){--x:8%;--y:1070px;--angle:-7deg;--z:16;width:49%}.home-gallery .home-photo:nth-child(13) img{height:115px}
}
