/* Premium Cocoa */
:root{--bg:#2d2000;--fg:#fff;--accent:#3a6060;--on-accent:#fff;--card:#fff;--head:'Playfair Display',Georgia,serif;--champ:#f3dcb4;--brown:#2d2000;--brown2:#3b2008;--teal:#3a6060;--tealD:#0a2d2d;--bg-ov:rgba(0,0,0,0)}
body{font-family:'Outfit',system-ui,sans-serif;font-weight:400;background:var(--brown);color:#fff}
body.ln-nophoto{background:var(--brown)}
.sec{max-width:560px;margin:0 auto;padding:44px 22px}
.sec h2{font:400 clamp(2.2rem,10vw,3rem)/1.15 'Kaushan Script',cursive;letter-spacing:0;text-transform:none;color:inherit;margin-bottom:22px}
.sec h2::after{display:none}
.ln-g{position:relative}
.ln-g .intro{opacity:1}

/* ----- Cover ----- */
.cover{color:var(--champ);background:linear-gradient(rgba(28,17,5,.58),rgba(28,17,5,.58)),var(--cover-img,none) center/cover no-repeat,var(--brown)}
.ln-title{display:flex;align-items:center;justify-content:center;gap:16px;margin:0 auto}
.ln-vt{writing-mode:vertical-rl;transform:rotate(180deg);font:italic 400 1.45rem/1 'Playfair Display',serif;color:inherit;padding:14px 10px;border:1px solid currentColor;white-space:nowrap}
.cover h1,.ln-hn{display:flex;flex-direction:column;align-items:flex-start;font:800 clamp(2rem,10.5vw,2.9rem)/1.12 'Playfair Display',serif;letter-spacing:.01em;margin:0;text-shadow:0 2px 12px rgba(0,0,0,.45);text-align:left}
.cover h1 span:first-child,.ln-hn span:first-child{border-top:1px solid currentColor;padding-top:6px}
.cover h1 span:last-child,.ln-hn span:last-child{border-bottom:1px solid currentColor;padding-bottom:6px}
.cover h1 .amp,.ln-hn .amp{font:700 2.4rem/1 'Playfair Display',serif;padding:4px 6px}
.cover .to{margin:64px 0 16px;font-size:1rem;color:var(--champ)}.cover .to b{display:block;margin-top:6px;font-weight:600;font-size:1.4rem;color:#fff}
.btn{display:inline-flex;gap:8px;align-items:center;border-radius:999px;font:400 1.1rem/1 'Outfit',sans-serif;letter-spacing:0;text-transform:none;padding:16px 28px;background:var(--teal);color:#fff;box-shadow:none}
.cover .btn{background:transparent;color:var(--champ);border:3px solid var(--champ)}
.btn.alt{background:#fcc93e;color:#2d2000;border:0}
.btn.sm{padding:10px 18px;font-size:.95rem;background:var(--teal)}
.ln-teal{border-radius:8px;padding:10px 16px;font-size:1.05rem;margin-top:8px}

/* ----- Hero ----- */
.ln-hero{position:relative;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:60px 20px 90px;text-align:center;color:#fff;overflow:hidden;background:linear-gradient(rgba(28,17,5,.55),rgba(28,17,5,.6)),var(--cover-img,none) center/cover no-repeat,var(--brown)}
.ln-hero .ln-title{margin-bottom:34px}.ln-hero .ln-vt,.ln-hero .ln-hn{color:#fff}
.ln-std{font:600 clamp(2.4rem,12vw,3.4rem)/1.1 'Outfit',sans-serif;text-shadow:0 3px 12px rgba(0,0,0,.45)}
.ln-chip{display:flex;justify-content:center;font:italic 500 1.35rem/1 'Outfit',sans-serif;filter:drop-shadow(0 4px 8px rgba(0,0,0,.35))}
.ln-chip b{background:#5c2c06;color:#fff;padding:14px 22px 14px 26px;clip-path:polygon(8% 0,100% 0,88% 100%,0 100%)}
.ln-chip span{background:#fff;color:#3f6b6b;padding:14px 22px 14px 14px;margin-left:-10px;clip-path:polygon(10% 0,100% 0,100% 100%,0 100%)}
.ln-hero .countdown{width:min(92vw,420px);gap:0;margin-top:6px;background:rgba(0,0,0,.28);border-top:6px dashed #8a7f78;padding:18px 6px}
.ln-hero .countdown div{flex:1;max-width:none;background:none;border:0;padding:0}
.ln-hero .countdown b{font:600 1.8rem/1.1 'Outfit',sans-serif;color:#fff}.ln-hero .countdown span{font-size:1rem;color:#fff;opacity:1}
.ln-snow i{position:absolute;top:-14px;border-radius:50%;background:rgba(255,255,255,.75);animation:lnSnow linear infinite}
@keyframes lnSnow{to{transform:translate3d(24px,110vh,0)}}

/* ----- Gelombang pemisah ----- */
.ln-wave{position:relative;height:78px;overflow:hidden}
.ln-wave::before{content:"";position:absolute;left:0;right:0;top:0;height:9px;background:repeating-linear-gradient(90deg,#fff 0 14px,#2b1704 14px 22px);z-index:1}
.ln-wave svg{position:absolute;left:0;top:9px;width:100%;height:68px;display:block}

/* ----- Kelompok bagian ----- */
.ln-brown{color:#fff;background:linear-gradient(135deg,#3a2f05 0,#2d2000 26%,#2d2000 68%,#170b00 68.1%)}
.ln-brown .card.quote{padding:10px 0}.ln-brown .quote .q{font:400 1.2rem/1.6 'Outfit',sans-serif;font-style:normal}.ln-brown .qref{color:var(--champ)}
.amp.big{font:400 5rem/1 'Mrs Saint Delafield',cursive;color:#fff;text-shadow:3px 3px 0 rgba(0,0,0,.3);margin:6px 0 18px}
.person{margin-bottom:34px}
.pf{width:min(76vw,330px);aspect-ratio:3/4;border-radius:0;border:0;padding:0;outline:0;margin:0 auto 30px;box-shadow:30px 30px 0 rgba(122,112,96,.9)}
.person:nth-of-type(odd) .pf{box-shadow:-30px 30px 0 rgba(122,112,96,.9)}
.nm{display:inline-block;background:#fff;color:#2d2000;font:400 1.5rem/1.2 'Playfair Display',serif;border-radius:999px;padding:8px 26px;margin-bottom:12px}
.person p{background:rgba(255,255,255,.14);border-radius:14px;padding:10px 14px;margin-top:8px}
.ig{color:var(--champ);border-color:var(--champ)}

.ln-photo{color:#4a3f2a;background:rgba(255,255,255,.66)}
.ln-nophoto .ln-photo{background:#ece5d6}
.ln-when{text-align:center;padding-bottom:20px}
.ln-wreath{width:230px;height:230px;display:block;margin:0 auto 4px}
.ln-thin{font:400 clamp(2.6rem,12vw,3.6rem)/1.1 'Mrs Saint Delafield',cursive!important;color:#4a3f2a}
.ln-when p{margin:14px 0 6px;font-size:1.15rem;font-weight:500}
.dayline{display:none}.ln-photo .intro{font-weight:500}
#acara{padding-top:20px}
#acara .card{position:relative;background:#fff;border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.2);padding:18px 24px 22px 80px;margin-bottom:26px;text-align:center;color:#4a4530;overflow:hidden}
#acara .card h3{position:absolute;left:0;top:0;bottom:0;width:58px;display:flex;align-items:center;justify-content:center;writing-mode:vertical-rl;transform:rotate(180deg);background:var(--brown2);color:#fff;font:600 1.3rem/1 'Outfit',sans-serif;text-transform:uppercase;letter-spacing:.02em;margin:0}
#acara .card:nth-of-type(even){padding:18px 80px 22px 24px}
#acara .card:nth-of-type(even) h3{left:auto;right:0;transform:none}
#acara .card p b{font-weight:600}
#acara .card>p:nth-of-type(1)::before{content:"📅 "}#acara .card>p:nth-of-type(2)::before{content:"🕐 "}
#acara .card>p:nth-of-type(1),#acara .card>p:nth-of-type(2){font-size:1.15rem;font-weight:600;line-height:1.5}
#acara .card>p:nth-of-type(3)::before{content:"";display:block;height:5px;margin:14px 0 20px;background:repeating-linear-gradient(100deg,#c0557a 0 26px,transparent 26px 38px,#58a6d6 38px 64px,transparent 64px 76px);transform:rotate(-2.5deg)}

.ln-story{color:#fff;background:linear-gradient(rgba(24,16,8,.62),rgba(24,16,8,.62))}
.ln-nophoto .ln-story{background:#3a2a10}
.ln-story .sec{position:relative}
.ln-story .sec::before{content:"";position:absolute;left:22px;top:150px;bottom:30px;width:4px;background:#fff;border-radius:2px}
.ln-story .sec h2{font:400 clamp(2.6rem,12vw,3.6rem)/1.1 'Mrs Saint Delafield',cursive;font-weight:400}
.story{display:flex;flex-direction:column;margin:0 0 22px;padding-left:46px;position:relative;text-align:center}
.story h3{order:1;position:relative;background:#3f5170;color:#fff;font:500 1.55rem/1.2 'Outfit',sans-serif;padding:18px 16px;border-radius:999px 0 0 999px;margin:0 -22px 12px 0;box-shadow:0 6px 16px rgba(0,0,0,.25)}
.story h3::before{content:"";position:absolute;left:-44px;top:50%;width:34px;height:34px;margin-top:-17px;border-radius:50%;background:#f3f3f3;border:5px solid #3f5170}
.story:nth-of-type(3n+2) h3{background:#fcc93e}.story:nth-of-type(3n+2) h3::before{border-color:#fcc93e}
.story:nth-of-type(3n) h3{background:#b4476a}.story:nth-of-type(3n) h3::before{border-color:#b4476a}
.story img{order:2;width:100%;max-width:none;max-height:none;aspect-ratio:4/5;object-fit:cover;border-radius:0;border:10px solid #f5f5f5;border-bottom:0;box-shadow:none;margin:0}
.story p{order:3;background:#f5f5f5;color:#222;padding:12px 16px 18px;margin:0;font-size:1.05rem;max-width:none}

.ln-light{color:#4c4428;background:linear-gradient(#e4ecee,#f5f8fb 40%);padding-bottom:10px}
.ln-light .sec h2{color:#4c4428}
.ln-light .sec h2::after{display:block;content:"";width:min(80vw,260px);height:40px;margin:10px auto 0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 40'%3E%3Cg fill='%237f9fa6' opacity='.85'%3E%3Cellipse cx='20' cy='14' rx='9' ry='4.4' transform='rotate%28-35 20 14%29'/%3E%3Cellipse cx='38' cy='26' rx='9' ry='4.4' transform='rotate%2830 38 26%29'/%3E%3Cellipse cx='56' cy='13' rx='9' ry='4.4' transform='rotate%28-30 56 13%29'/%3E%3Cellipse cx='74' cy='26' rx='9' ry='4.4' transform='rotate%2828 74 26%29'/%3E%3Cellipse cx='92' cy='14' rx='9' ry='4.4' transform='rotate%28-28 92 14%29'/%3E%3Cellipse cx='108' cy='25' rx='9' ry='4.4' transform='rotate%2825 108 25%29'/%3E%3C/g%3E%3Cpath d='M8 20H112' stroke='%238c8aa6' stroke-width='1.4' fill='none'/%3E%3Cg transform='translate%28240 0%29 scale%28-1 1%29'%3E%3Cg fill='%237f9fa6' opacity='.85'%3E%3Cellipse cx='20' cy='14' rx='9' ry='4.4' transform='rotate%28-35 20 14%29'/%3E%3Cellipse cx='38' cy='26' rx='9' ry='4.4' transform='rotate%2830 38 26%29'/%3E%3Cellipse cx='56' cy='13' rx='9' ry='4.4' transform='rotate%28-30 56 13%29'/%3E%3Cellipse cx='74' cy='26' rx='9' ry='4.4' transform='rotate%2828 74 26%29'/%3E%3Cellipse cx='92' cy='14' rx='9' ry='4.4' transform='rotate%28-28 92 14%29'/%3E%3Cellipse cx='108' cy='25' rx='9' ry='4.4' transform='rotate%2825 108 25%29'/%3E%3C/g%3E%3Cpath d='M8 20H112' stroke='%238c8aa6' stroke-width='1.4' fill='none'/%3E%3C/g%3E%3C/svg%3E") center/contain no-repeat}
.gal{display:block;columns:2;column-gap:12px}
.gal img,.gal img:first-child,.gal img:last-child:nth-child(even){display:block;width:100%;height:auto;aspect-ratio:auto;max-height:none;object-fit:cover;border:0;border-radius:22px;box-shadow:0 8px 22px rgba(0,0,0,.18);margin:0 0 12px;break-inside:avoid;grid-column:auto}
.gal img:nth-child(3n+1){aspect-ratio:3/4}.gal img:nth-child(3n+2){aspect-ratio:4/5}.gal img:nth-child(3n){aspect-ratio:1}
#live .card{background:#fff;border-radius:22px;box-shadow:0 8px 24px rgba(0,0,0,.12);color:#4c4428}
.card{background:#fff;border:0;border-radius:24px;box-shadow:0 8px 24px rgba(0,0,0,.12);color:#4c4428;padding:20px}
.form{gap:10px}.form label{font-size:1.1rem}
input,select,textarea{border:2px solid #c3d0d8;border-radius:999px;background:#fff;color:#2b2b2b;padding:12px 20px;font-size:1.05rem}
textarea{border-radius:24px;min-height:120px}
.form .btn{width:auto;justify-self:end}
.wish{background:#fff;border-radius:22px;box-shadow:0 6px 18px rgba(0,0,0,.1);color:#4c4428;padding:16px 18px}
.wish .st{background:none;border:1px solid #4c4428;font-weight:400;font-size:.8rem}
.wcount{color:#0a2d2d}
.gcard h3{color:var(--tealD)}.rek{color:#4c4428}
.attn{background:#fff;border-radius:14px;color:#4c4428}
.closing .nm{background:none;color:#4c4428;font:400 clamp(2.2rem,11vw,3rem)/1.1 'Kaushan Script',cursive;padding:0}
.closing h2{font-size:clamp(2rem,9vw,2.6rem)}
footer{color:#4c4428;opacity:.85;padding:24px 20px calc(110px + env(safe-area-inset-bottom))}

/* ----- Dock bulat & tombol melayang ----- */
.dock{width:min(92vw,420px);border-radius:999px;background:rgba(255,255,255,.92);border:0;box-shadow:0 8px 28px rgba(0,0,0,.28);padding:8px 10px;align-items:center}
.dock a{color:var(--tealD);padding:0;height:46px;border-radius:50%;background:none;transition:transform .25s,box-shadow .25s}
.dock a span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.dock a:not(.on):hover{background:rgba(58,96,96,.12)}
.dock a.on{background:#fff;color:var(--tealD);flex:0 0 62px;height:62px;transform:translateY(-12px);box-shadow:0 6px 18px rgba(0,0,0,.25)}
.musicbtn,.asbtn,.ln-top{position:fixed;right:max(8px,env(safe-area-inset-right));width:50px;height:50px;border:0;background:#fff;color:var(--tealD);box-shadow:0 4px 14px rgba(0,0,0,.28);cursor:pointer;z-index:9}
.musicbtn{bottom:calc(206px + env(safe-area-inset-bottom));border-radius:50%;font-size:1.25rem;opacity:1}.musicbtn.off{opacity:.55}.musicbtn:not(.off){animation:none}
.asbtn{bottom:calc(142px + env(safe-area-inset-bottom));border-radius:14px;opacity:.7}.asbtn.on{opacity:1}
.ln-top{display:none;bottom:calc(270px + env(safe-area-inset-bottom));border-radius:14px;flex-direction:column;align-items:center;justify-content:center;font:500 .72rem/1 'Outfit',sans-serif}
body.opened .ln-top{display:flex}
body:not(.opened) .ln-top{display:none}
@media (prefers-reduced-motion:reduce){.ln-snow{display:none}}
