@import url(lay2-common.css?v=1);
.lay-ruban{--c1:#111111;--c2:#B3202A;--c3:#D4AF37;--c4:#F5EFE2;--ink:#111111;--serif:"Cinzel","Bodoni Moda",serif;--script:"Cormorant Garamond",Georgia,serif;
  --bg:var(--c4);--fg:var(--ink);--acc:var(--c1);--acc-ink:var(--c3);--ln:color-mix(in srgb,var(--c3) 75%,transparent);--r:2px;--r2:2px}
.lay-ruban{font-family:"Jost",system-ui,sans-serif}
.lay-ruban main{overflow:hidden}
.lay-ruban .l2-btn{letter-spacing:.2em}
.lay-ruban .rb-sc{width:1em;height:1em}

/* porte : ruban */
.lay-ruban .gate{background:radial-gradient(70% 50% at 50% 40%,#262626,var(--c1));color:var(--c4);flex-direction:column;overflow:hidden}
.lay-ruban .rg-frame{position:absolute;inset:14px;border:1px solid var(--c3);box-shadow:inset 0 0 0 5px var(--c1),inset 0 0 0 6px color-mix(in srgb,var(--c3) 50%,transparent);pointer-events:none}
.lay-ruban .rg-in{position:absolute;top:18%;left:0;right:0;text-align:center;padding:0 30px;transition:opacity .8s}
.lay-ruban .rg-s{font-family:var(--serif);font-size:12px;letter-spacing:.34em;text-transform:uppercase;color:var(--c3)}
.lay-ruban .rg-n{font-family:var(--serif);font-weight:600;font-size:clamp(26px,8vw,40px);line-height:1.15;margin-top:12px;text-transform:uppercase;letter-spacing:.04em}
.lay-ruban .rg-f{margin-top:10px;font-size:15px;opacity:.85}
.lay-ruban .rg-rib{position:absolute;left:0;right:0;top:54%;height:56px;transform:translateY(-50%) rotate(-3deg);pointer-events:none}
.lay-ruban .rg-l,.lay-ruban .rg-r{position:absolute;top:0;bottom:0;width:50%;background:linear-gradient(var(--c2),color-mix(in srgb,var(--c2) 70%,#000) 50%,var(--c2));box-shadow:0 8px 16px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,255,255,.12);transition:transform 1.3s cubic-bezier(.5,0,.8,.4) .4s,opacity 1s ease .8s}
.lay-ruban .rg-l{left:0;transform-origin:left center}
.lay-ruban .rg-r{right:0;transform-origin:right center}
.lay-ruban .rg-rib span::after{content:"";position:absolute;left:0;right:0;top:8px;bottom:8px;border-top:1px solid var(--c3);border-bottom:1px solid var(--c3);opacity:.7}
.lay-ruban .rg-cut{position:absolute;left:50%;top:54%;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:50%;border:2px solid var(--c3);background:var(--c1);color:var(--c3);cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:3;font-size:36px;box-shadow:0 0 0 7px rgba(0,0,0,.35);animation:rgpulse 2s ease-in-out infinite;transition:opacity .4s}
@keyframes rgpulse{50%{box-shadow:0 0 0 13px rgba(212,175,55,.2)}}
.lay-ruban .rg-h{position:absolute;bottom:13%;left:0;right:0;text-align:center;font-size:13px;opacity:.75;padding:0 30px}
.lay-ruban .gate.is-open .rg-cut{opacity:0;animation:none}
.lay-ruban .gate.is-open .rg-l{transform:rotate(26deg) translateY(160%);opacity:0}
.lay-ruban .gate.is-open .rg-r{transform:rotate(-26deg) translateY(160%);opacity:0}
.lay-ruban .gate.is-open .rg-in,.lay-ruban .gate.is-open .rg-h{opacity:0}

/* hero */
.lay-ruban .hero{position:relative;background:radial-gradient(80% 50% at 50% 0%,#262626,var(--c1));color:var(--c4);padding:64px 34px 64px;text-align:center}
.lay-ruban .rb-frame{position:absolute;inset:16px;border:1px solid var(--c3);pointer-events:none}
.lay-ruban .rb-frame::after{content:"";position:absolute;inset:5px;border:1px solid color-mix(in srgb,var(--c3) 45%,transparent)}
.lay-ruban .hero-in{position:relative;max-width:520px;margin:0 auto}
.lay-ruban .rb-kind{font-family:var(--serif);font-weight:600;font-size:clamp(24px,7.4vw,44px);letter-spacing:.12em;text-transform:uppercase;line-height:1;background:linear-gradient(135deg,#F7E4A2,#D4AF37 45%,#B78C34 60%,#EBCF84);-webkit-background-clip:text;background-clip:text;color:transparent}
.lay-ruban .rb-intro{margin-top:18px;font-size:12px;letter-spacing:.26em;text-transform:uppercase;opacity:.8;line-height:1.8}
.lay-ruban .rb-title{font-family:var(--serif);font-weight:600;font-size:clamp(26px,8.4vw,42px);line-height:1.2;text-transform:uppercase;letter-spacing:.04em;margin:14px 0 10px}
.lay-ruban .rb-tag{font-family:var(--script);font-style:italic;font-size:21px;color:var(--c3)}
.lay-ruban .rb-date{margin:30px auto 0;display:flex;flex-direction:column;align-items:center;width:200px;padding:20px 10px;border:1px solid var(--c3);position:relative}
.lay-ruban .rb-date::before,.lay-ruban .rb-date::after{content:"";position:absolute;left:50%;width:9px;height:9px;background:var(--c3);transform:translateX(-50%) rotate(45deg)}
.lay-ruban .rb-date::before{top:-5px}.lay-ruban .rb-date::after{bottom:-5px}
.lay-ruban .rb-dn{font-family:var(--serif);font-weight:600;font-size:64px;line-height:1;color:var(--c3)}
.lay-ruban .rb-dm{font-size:13px;letter-spacing:.2em;text-transform:uppercase;margin-top:6px}
.lay-ruban .rb-dw{font-size:13px;opacity:.75;margin-top:4px}
.lay-ruban .rb-ribdiv{display:flex;align-items:center;gap:14px;margin:34px auto 22px;max-width:300px;color:var(--c2);font-size:30px}
.lay-ruban .rb-ribdiv i{flex:1;height:8px;background:var(--c2);box-shadow:0 0 0 1px rgba(255,255,255,.12)}
.lay-ruban .rb-ribdiv .rb-sc{flex:none;width:34px;height:34px;color:var(--c3)}
.lay-ruban .rb-where{font-family:var(--serif);font-size:19px;letter-spacing:.05em;display:flex;flex-direction:column;gap:4px}
.lay-ruban .rb-where small{font-family:"Jost",sans-serif;letter-spacing:0;opacity:.75;font-size:14px}
.lay-ruban .rb-outro{margin-top:22px;font-family:var(--script);font-style:italic;font-size:19px;opacity:.85}

/* sections */
.lay-ruban .blk{max-width:640px;margin:0 auto;padding:54px 24px;text-align:center}
.lay-ruban .blk.wide{max-width:780px}
.lay-ruban .k2{font-family:var(--serif);font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--c2);font-weight:600;margin-bottom:8px}
.lay-ruban .sh{font-family:var(--serif);font-weight:600;font-size:clamp(26px,7.4vw,36px);text-transform:uppercase;letter-spacing:.06em;line-height:1.15;margin-bottom:26px}
.lay-ruban .sh::after{content:"";display:block;width:60px;height:3px;background:var(--c3);margin:14px auto 0}
.lay-ruban .rb-msg{font-size:18px;line-height:1.75}
.lay-ruban .rb-verse{margin-top:22px;font-family:var(--script);font-style:italic;font-size:23px;color:var(--c2);line-height:1.4}
.lay-ruban .rb-tl{gap:0;counter-reset:rb}
.lay-ruban .rb-tl .tl-i{counter-increment:rb;padding:20px 0 20px 0;border-bottom:1px solid var(--ln);grid-template-columns:90px 1fr;position:relative}
.lay-ruban .rb-tl .tl-i:first-child{border-top:3px double var(--c3)}
.lay-ruban .rb-tl .tl-t b{font-family:var(--serif);font-weight:600;font-size:21px;color:var(--c2)}
.lay-ruban .rb-tl .tl-b h3{font-family:var(--serif);font-size:19px;text-transform:uppercase;letter-spacing:.04em;font-weight:600}
.lay-ruban .rb-tl .tl-b .lnk{color:var(--c2)}
.lay-ruban .blk-act{margin-top:28px}
.lay-ruban .rb-box{border:1px solid var(--c1);padding:24px;background:#fff;text-align:left;position:relative;box-shadow:6px 6px 0 var(--c3)}
.lay-ruban .rb-count{background:var(--c1);color:var(--c4);padding:50px 20px;text-align:center}
.lay-ruban .rb-count .k2{color:var(--c3)}
.lay-ruban .rb-cd{max-width:460px;margin:18px auto 0;gap:10px}
.lay-ruban .rb-cd div{border:1px solid var(--c3);padding:14px 2px}
.lay-ruban .rb-cd b{font-family:var(--serif);font-weight:600;font-size:clamp(28px,8vw,40px);color:var(--c3)}
.lay-ruban .rb-cd span{font-size:10px;letter-spacing:.16em;text-transform:uppercase;opacity:.8}
.lay-ruban .rb-gal{gap:10px}
.lay-ruban .rb-gal figure{border:1px solid var(--c3);padding:5px;background:#fff;aspect-ratio:4/3}
.lay-ruban .rb-pass{background:var(--c1);color:var(--c4);padding:28px 22px;border:1px solid var(--c3);box-shadow:inset 0 0 0 5px var(--c1),inset 0 0 0 6px color-mix(in srgb,var(--c3) 50%,transparent);text-align:left}
.lay-ruban .rb-pass .pi{flex-direction:column;align-items:center;text-align:center}
.lay-ruban .rb-pass .pi-qr{width:min(100%,260px);padding:14px}
.lay-ruban .rb-pass .pi-name{font-family:var(--serif);color:var(--c3);text-transform:uppercase;letter-spacing:.04em;font-size:22px}
.lay-ruban .rb-pass .muted,.lay-ruban .rb-pass .lnk{color:var(--c4)}
.lay-ruban .foot{opacity:.75}
.lay-ruban .mus{--acc:var(--c1);--acc-ink:var(--c3)}
