/* ═══ AMME — Landing Teasing ═══ */

.teasing-root{position:relative;width:100vw;height:100vh;overflow:hidden;font-family:var(--font-sans);color:var(--white)}
.teasing-bg{position:absolute;inset:0;background:url('https://amme-restaurant.fr/wp-content/uploads/2026/04/amme_restaurant_2-scaled.jpg') center/cover no-repeat;transform:scale(1.05);transition:transform 12s cubic-bezier(0.16,1,0.3,1)}
.teasing-bg.ready{transform:scale(1)}
.teasing-grad{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 30%,rgba(26,23,20,0.5),rgba(26,23,20,0.8) 65%,rgba(26,23,20,0.95))}
.teasing-vig{position:absolute;inset:0;box-shadow:inset 0 0 200px 60px rgba(0,0,0,0.4);pointer-events:none}

.teasing-top{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:2rem 3rem;z-index:10;clip-path:inset(100% 0 0 0);transition:clip-path 1s var(--ease-expo) 0.3s}
.teasing-top.vis{clip-path:inset(0)}
.teasing-by{font-weight:200;font-size:0.7rem;letter-spacing:0.3em;text-transform:uppercase;color:var(--taupe)}
.teasing-ig{font-weight:300;font-size:0.7rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--taupe);display:flex;align-items:center;gap:0.5rem;transition:color 0.3s}
.teasing-ig:hover{color:var(--white)}
.teasing-ig svg{width:14px;height:14px}

.teasing-content{position:relative;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:2rem;text-align:center}
.teasing-bar{width:1px;height:48px;background:var(--gold);margin:0 auto 2.5rem;transform:scaleY(0);transform-origin:top;transition:transform 1s var(--ease-expo) 0.6s}
.teasing-bar.vis{transform:scaleY(1)}

.teasing-title{font-family:var(--font-serif);font-weight:300;font-size:clamp(3.5rem,10vw,7rem);letter-spacing:0.35em;text-transform:uppercase;text-indent:0.35em;line-height:1;color:var(--white);clip-path:inset(100% 0 0 0);transition:clip-path 1.2s var(--ease-expo) 0.8s}
.teasing-title.vis{clip-path:inset(0)}
.teasing-sub{font-weight:200;font-size:clamp(0.65rem,1.2vw,0.8rem);letter-spacing:0.35em;text-transform:uppercase;color:var(--white);margin-top:1rem;clip-path:inset(100% 0 0 0);transition:clip-path 1s var(--ease-expo) 1.2s}
.teasing-sub.vis{clip-path:inset(0)}
.teasing-opening{font-weight:200;font-size:0.72rem;letter-spacing:0.35em;text-transform:uppercase;color:var(--taupe);margin:2.5rem 0;clip-path:inset(100% 0 0 0);transition:clip-path 0.8s ease 1.5s}
.teasing-opening.vis{clip-path:inset(0)}

.teasing-email{clip-path:inset(100% 0 0 0);transition:clip-path 0.8s ease 1.7s}
.teasing-email.vis{clip-path:inset(0)}
.teasing-email-label{font-weight:300;font-size:0.72rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--taupe);margin-bottom:1rem}
.teasing-email-form{display:flex;align-items:center;border-bottom:1px solid var(--taupe);padding-bottom:0.5rem;max-width:380px;margin:0 auto;transition:border-color 0.4s}
.teasing-email-form:focus-within{border-color:var(--gold)}
.teasing-email-input{flex:1;background:none;border:none;outline:none;font-family:var(--font-sans);font-weight:300;font-size:0.85rem;color:var(--white);letter-spacing:0.05em;padding:0.5rem 0}
.teasing-email-input::placeholder{color:var(--taupe);opacity:0.6}
.teasing-email-btn{padding:0.5rem;display:flex;align-items:center;opacity:0.5;transition:transform 0.3s,opacity 0.3s}
.teasing-email-btn:hover{transform:translateX(3px);opacity:1}
.teasing-email-btn svg{width:20px;height:20px;stroke:var(--gold);fill:none;stroke-width:1.5}
.teasing-success{font-family:var(--font-serif);font-style:italic;font-size:1rem;color:var(--gold);letter-spacing:0.05em;animation:teasing-fadeUp 0.8s ease forwards}
@keyframes teasing-fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

.teasing-bottom{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;padding:2rem 3rem;z-index:10;clip-path:inset(100% 0 0 0);transition:clip-path 0.8s ease 2s}
.teasing-bottom.vis{clip-path:inset(0)}
.teasing-addr{font-weight:200;font-size:0.65rem;letter-spacing:0.25em;text-transform:uppercase;color:var(--taupe);opacity:0.6;text-align:center}

@media(max-width:768px){
  .teasing-top{padding:1.5rem;flex-direction:column;gap:0.5rem}
  .teasing-content{padding:1.5rem}
  .teasing-title{letter-spacing:0.25em;text-indent:0.25em}
  .teasing-email-form{max-width:300px}
  .teasing-bottom{padding:1.5rem}
}