/* ================================================================
   HOME — Styles specifiques
   ================================================================ */

/* ===== HERO WIDE ===== */
.hero-wide {
  position:relative;display:flex;align-items:flex-end;
  overflow:hidden;margin-top:74px;margin-bottom:60px;
  height:calc(100vh - 134px);
}
.hw-img-wrap { position:absolute; inset:0; margin:0 40px; overflow:hidden; border-radius:12px; }
.hw-img { width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block;transition:transform 8s ease;filter:brightness(1.2) contrast(1.1); }
.hero-wide:hover .hw-img { transform:scale(1.03); }
.hw-overlay {
  position:absolute;inset:0;
  background:
    linear-gradient(to top, rgba(23,24,22,0.92) 0%, rgba(23,24,22,0.45) 30%, rgba(23,24,22,0.02) 55%, transparent 100%),
    linear-gradient(to right, rgba(23,24,22,0.88) 0%, rgba(23,24,22,0.55) 35%, transparent 60%);
}
.hw-content {
  position:absolute;bottom:0;left:0;z-index:2;
  max-width:640px;padding:0 80px 40px;
}
.hero-wide .hero-pretitle {
  font-family:'Caveat',cursive;font-size:24px;color:var(--orange);
  margin-bottom:8px;transform:rotate(-0.8deg);display:inline-block;
  opacity:0;animation:fadeUp 0.7s 0.2s forwards;
}
.hero-wide h1 {
  font-size:clamp(38px,5vw,62px);font-weight:700;line-height:1.0;
  letter-spacing:-2px;margin-bottom:18px;
  text-shadow:0 2px 40px rgba(0,0,0,0.4);
  opacity:0;animation:fadeUp 0.7s 0.4s forwards;
}
.hero-wide h1 .accent { color:var(--orange); }
.hw-desc {
  font-size:16px;color:rgba(255,255,255,0.95);max-width:500px;margin-bottom:10px;
  opacity:0;animation:fadeUp 0.7s 0.55s forwards;
}
.hw-quote {
  font-family:'Caveat',cursive;font-size:20px;color:var(--green);
  transform:rotate(-0.5deg);margin-bottom:20px;
  padding-left:0;border-left:none;
  opacity:0;animation:fadeUp 0.7s 0.65s forwards;
  position:relative;
}
.hw-actions {
  display:flex;gap:14px;flex-wrap:wrap;
  opacity:0;animation:fadeUp 0.7s 0.8s forwards;
}
.hw-fig {
  position:absolute;bottom:12px;right:60px;z-index:2;
  font-family:'Caveat',cursive;font-size:16px;color:rgba(255,255,255,0.18);
}

/* ===== MANIFESTO ===== */
.manifesto { padding:100px 0; }
.manifesto-grid {
  display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;
}
.manifesto h2 {
  font-size:clamp(28px,3vw,38px);font-weight:700;line-height:1.3;margin-bottom:20px;
}
.manifesto-text { font-size:17px;color:var(--gray);line-height:1.7; }
.manifesto-text strong { color:var(--white);font-weight:600; }
.manifesto-aside {
  font-family:'Caveat',cursive;font-size:20px;color:var(--blue);
  margin-top:20px;transform:rotate(-0.5deg);opacity:0.7;
}

/* ===== STEPS / SERVICE CARDS ===== */
.steps { padding:100px 0; }
.steps-header { text-align:center;max-width:680px;margin:0 auto 56px; }
.steps-header h2 { font-size:clamp(28px,3vw,38px);margin-bottom:12px; }
.steps-header p { color:var(--gray);font-size:17px; }
.steps-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:32px;align-items:stretch; }
/* Wrapper <a> : prend la hauteur du grid, et la card .sc l'etire */
.steps-grid > .sc-link { display:flex;flex-direction:column;height:100%; }
.steps-grid > .sc-link > .sc { flex:1;display:flex;flex-direction:column; }
.sc {
  background:var(--black-light);border-radius:12px;
  border:2px solid rgba(255,255,255,0.06);position:relative;
  transition:transform 0.4s cubic-bezier(0.16,1,0.3,1), border-color 0.4s, box-shadow 0.4s, filter 0.4s;
  overflow:hidden;
}
.sc::before {
  content:'';position:absolute;inset:-1px;border-radius:12px;
  background:var(--glow);
  opacity:0;transition:opacity 0.4s ease;pointer-events:none;
  filter:blur(30px);z-index:0;
}
.sc:hover::before { opacity:0.10; }
.sc:hover {
  transform:translateY(-6px);
  border-color:rgba(255,255,255,0.1);
  filter:brightness(1.08);
}
/* Classes explicites (remplacent nth-child cassé par le wrapper <a>) */
.sc-orange { --glow:var(--orange); }
.sc-orange:hover { border-color:rgba(255,128,62,0.35);box-shadow:0 8px 40px rgba(255,128,62,0.14); }
.sc-blue { --glow:var(--blue); }
.sc-blue:hover { border-color:rgba(21,168,254,0.35);box-shadow:0 8px 40px rgba(21,168,254,0.14); }
.sc-green { --glow:var(--green); }
.sc-green:hover { border-color:rgba(104,232,141,0.35);box-shadow:0 8px 40px rgba(104,232,141,0.14); }
.sc-img { height:200px;overflow:hidden;position:relative;border-bottom:5px solid var(--glow); }
.sc-img img { width:100%;height:100%;object-fit:cover;transition:transform 0.6s cubic-bezier(0.16,1,0.3,1),filter 0.4s; }
.sc:hover .sc-img img { transform:scale(1.03);filter:brightness(1.10); }
.sc-img::after {
  content:attr(data-fig);position:absolute;bottom:8px;right:12px;
  font-family:'Caveat',cursive;font-size:16px;color:rgba(255,255,255,0.4);
}
.sc-body { padding:24px; position:relative; z-index:1; flex:1; display:flex; flex-direction:column; }
.sc-phase {
  font-family:'Caveat',cursive;font-size:16px;color:var(--glow);
  margin-bottom:4px;opacity:0.8;
}
.sc h3 { font-size:20px;font-weight:700;margin-bottom:6px; }
.sc-sub {
  font-family:'Caveat',cursive;font-size:16px;color:var(--glow);
  margin-bottom:12px;opacity:0.7;
}
.sc p { color:var(--gray);font-size:16px;line-height:1.7; }
.sc-tags { display:flex;flex-wrap:wrap;gap:8px;margin-top:16px; }
.sc-tag {
  font-size:12px;padding:4px 12px;border-radius:20px;
  border:1px solid rgba(255,255,255,0.12);color:rgba(255,255,255,0.6);
  transition:border-color 0.4s,color 0.4s;
}
.sc:hover .sc-tag { border-color:var(--glow);color:var(--glow); }
.sc-annot {
  font-family:'Caveat',cursive;font-size:16px;color:var(--glow);
  margin-top:14px;opacity:0.6;transform:rotate(-0.5deg);
}
.sc .card-glow {
  position:absolute;width:200px;height:200px;border-radius:50%;
  background:radial-gradient(circle, var(--glow) 0%, transparent 70%);
  opacity:0;transition:opacity 0.4s;pointer-events:none;
  filter:blur(40px);transform:translate(-50%,-50%);z-index:0;
}
.sc:hover .card-glow { opacity:0.14; }

/* ===== TEAM POLAROID (section Les inventeurs, version polaroid) ===== */
.team-polaroid { padding: 100px 0; background: transparent; }
.team-polaroid .manifesto-grid {
  display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 60px; align-items: stretch;
}
.team-polaroid .reveal-left { display: flex; flex-direction: column; justify-content: center; }
.team-polaroid .reveal-right { display: flex; align-items: stretch; }
.team-polaroid h2 {
  font-size: clamp(28px,3vw,38px); font-weight: 700; line-height: 1.3; margin-bottom: 20px;
}
.team-polaroid .manifesto-text {
  font-size: 17px; color: var(--gray); line-height: 1.7; margin-bottom: 28px;
}
.team-polaroid .manifesto-text strong { color: var(--white); font-weight: 600; }
.team-polaroid .team-stats-row { display: flex; gap: 32px; margin-bottom: 28px; }
.team-polaroid .tstat { text-align: left; }
.team-polaroid .tstat-v {
  font-family: 'Caveat', cursive; font-size: 38px; font-weight: 700; line-height: 1;
}
.team-polaroid .tstat:nth-child(1) .tstat-v { color: var(--orange); }
.team-polaroid .tstat:nth-child(2) .tstat-v { color: var(--blue); }
.team-polaroid .tstat:nth-child(3) .tstat-v { color: var(--green); }
.team-polaroid .tstat-l { font-size: 13px; color: rgba(255,255,255,0.5); margin-top: 2px; }
.team-polaroid .team-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.team-polaroid .tilt-frame {
  max-width: 100%; width: 100%; margin-left: auto;
  display: flex; flex-direction: column;
}
.team-polaroid .tilt-frame img {
  width: 100%; height: 100%; flex: 1; object-fit: cover; min-height: 380px;
}

/* ===== TEAM (ancien hero panoramique, gardé pour compat) ===== */
.team { padding: 0; }
.team-hero { position: relative; overflow: hidden; }
.team-img-wrap { position: relative; margin: 0 40px; overflow: hidden; border-radius: 12px; }
.team-hero-img {
  width: 100%; height: auto; display: block;
  transition: transform 8s ease;
  filter: brightness(1.2) contrast(1.1);
}
.team-hero:hover .team-hero-img { transform: scale(1.03); }
.team-overlay {
  position: absolute; inset: 0;
  background:
    linear-gradient(to top, rgba(23,24,22,0.95) 0%, rgba(23,24,22,0.7) 40%, rgba(23,24,22,0.15) 70%, rgba(23,24,22,0.1) 100%),
    linear-gradient(to right, rgba(23,24,22,0.5) 0%, transparent 40%);
}
.team-inner {
  position: absolute; bottom: 0; left: 0; right: 0; z-index: 2;
  padding: 0 80px 48px;
}
.team-inner h2 {
  font-size: clamp(28px,3vw,38px); font-weight: 700; line-height: 1.3;
  margin-bottom: 12px; text-shadow: 0 2px 20px rgba(0,0,0,0.3);
}
.team-desc {
  font-size: 17px; color: rgba(255,255,255,0.75);
  max-width: 560px; margin-bottom: 24px; line-height: 1.7;
}
.team-stats-row { display: flex; gap: 32px; margin-bottom: 28px; }
.tstat { text-align: left; }
.tstat-v {
  font-family: 'Caveat', cursive; font-size: 38px; font-weight: 700; line-height: 1;
}
.tstat:nth-child(1) .tstat-v { color: var(--orange); }
.tstat:nth-child(2) .tstat-v { color: var(--blue); }
.tstat:nth-child(3) .tstat-v { color: var(--green); }
.tstat-l { font-size: 12px; color: rgba(255,255,255,0.5); margin-top: 2px; }
.team-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.team-fig {
  position: absolute; bottom: 16px; right: 60px; z-index: 2;
  font-family: 'Caveat', cursive; font-size: 16px; color: rgba(255,255,255,0.18);
}

/* ===== PORTFOLIO ===== */
.portfolio { padding:100px 0; }
.portfolio .steps-header h2 { font-size:clamp(28px,3vw,38px); }
.portfolio-wrap { position: relative; overflow: hidden; }
.portfolio-scroll {
  display:flex;gap:20px;overflow-x:auto;padding:0 40px 16px;
  scroll-snap-type:x mandatory;scrollbar-width:none;
}
.portfolio-scroll::-webkit-scrollbar { display:none; }
.pc {
  flex-shrink:0;width:300px;scroll-snap-align:start;
  border-radius:12px;overflow:hidden;background:var(--black-light);
  border:2px solid rgba(255,255,255,0.06);
  transition:transform 0.4s cubic-bezier(0.16,1,0.3,1),border-color 0.4s,box-shadow 0.4s;
}
.pc:hover {
  transform:translateY(-8px);
  border-color:rgba(255,128,62,0.4);
  box-shadow:0 20px 40px rgba(0,0,0,0.3), 0 8px 40px rgba(255,128,62,0.12);
  filter:brightness(1.08);
}
.pc-img { height:210px;overflow:hidden;position:relative; }
.pc-img img {
  width:100%;height:100%;object-fit:cover;
  transition:transform 0.6s cubic-bezier(0.16,1,0.3,1),filter 0.4s;
}
.pc:hover .pc-img img { transform:scale(1.03);filter:brightness(1.12); }
.pc-img::after {
  content:attr(data-fig);position:absolute;bottom:8px;right:12px;
  font-family:'Caveat',cursive;font-size:16px;color:rgba(255,255,255,0.4);
}
.pc-info { padding:18px; }
.pc-tag {
  font-family:'Caveat',cursive;font-size:16px;color:var(--blue);margin-bottom:4px;
  transition:color 0.4s;
}
.pc:hover .pc-tag { color:var(--orange); }
.pc-info h4 { font-size:17px;font-weight:700;line-height:1.3; }
.scroll-arr {
  position: absolute; top: 50%; z-index: 10;
  width: 44px; height: 44px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,0.15);
  background: rgba(23,24,22,0.85); backdrop-filter: blur(8px);
  color: var(--white); font-size: 22px; cursor: pointer;
  transition: all 0.4s; display: flex; align-items: center; justify-content: center;
  transform: translateY(-50%);
}
.scroll-arr:hover {
  background: var(--orange); border-color: var(--orange); color: var(--black);
}
.scroll-arr-left { left: 12px; }
.scroll-arr-right { right: 12px; }

/* ===== HOME RESPONSIVE ===== */
@media (max-width:900px) {
  .hw-img-wrap { margin:0 20px; }
  .hero-wide { height:calc(100vh - 114px); }
  .hw-content { padding:0 40px 32px; }
  .team-img-wrap { margin:0 20px; }
  .team-inner { padding:0 40px 36px; }
  .manifesto-grid { grid-template-columns:1fr;gap:36px; }
  .team-polaroid { padding:60px 0; }
  .team-polaroid .manifesto-grid { grid-template-columns:1fr;gap:40px; }
  .team-polaroid .tilt-frame img { min-height:280px; }
  .steps-grid { grid-template-columns:1fr;max-width:440px;margin:0 auto; }
  .sc-img { height:160px; }
}
@media (max-width:600px) {
  .hw-img-wrap { margin:0 12px; }
  .hero-wide { height:calc(100vh - 100px); }
  .hw-content { padding:0 28px 24px; }
  .team-img-wrap { margin:0 12px; }
  .team-inner { padding:0 28px 28px; }
  .hero-wide h1 { font-size:34px; }
  .hw-actions,.cta-actions { flex-direction:column; }
  .team-inner { padding-bottom: 28px; }
  .team-stats-row { gap: 16px; }
  .tstat-v { font-size: 28px; }
  .team-actions { flex-direction: column; }
  .team-actions .btn { width: 100%; justify-content: center; }
  .team-fig { display: none; }
}