*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#e7ebee;color:#4d5b6f;font:14px/1.85 Arial,sans-serif}main{width:450px;margin-left:auto;background:#f2f3ef;overflow:hidden}main>section,main>footer{position:relative;isolation:isolate;padding:48px 30px 100px;text-align:center;min-height:100svh;background:radial-gradient(ellipse at center,#fffdf5 0,#edf0ef 85%)}.floral-corners{position:absolute;inset:0;pointer-events:none;z-index:1;overflow:hidden}.corner{position:absolute;display:block;width:178px;height:auto;max-width:45%;pointer-events:none}.top-left{top:0;left:0}.top-right{top:0;right:0;transform:scaleX(-1)}.bottom-left{bottom:0;left:0;transform:scaleY(-1)}.bottom-right{bottom:0;right:0;transform:rotate(180deg)}.mihrab{position:relative;z-index:2;color:#fffaf0;max-width:350px;margin:0 auto;border-style:solid;border-color:transparent;border-width:142px 13px 18px;border-image-source:url('/images/ornaments/bunga-klasik/masjid.svg');border-image-slice:280 24 24 24 fill;border-image-repeat:stretch;padding:10px 19px 27px;overflow-wrap:anywhere;filter:drop-shadow(0 12px 15px #43526717)}.mihrab h1,.mihrab h2,.mihrab h3{font-family:Georgia,serif;font-weight:400;line-height:1.2}.mihrab h1{font-size:61px;letter-spacing:-1px;margin:20px 0;line-height:1.02}.mihrab h1 i{display:block;font-size:32px;font-weight:400;color:#dfc895;margin:7px 0}.mihrab h2{font-size:33px;margin:22px 0}.mihrab h3{font-size:30px;margin:22px 0 12px}.mihrab em{font-weight:400;color:#dfc895}.mihrab p{font-size:12px;line-height:1.95;margin:17px 0}.eyebrow{font-size:8px;letter-spacing:2px;color:#eee0c4}.button,button{display:inline-block;padding:13px 20px;border:1px solid #e4cb90;border-radius:6px;background:#d3b478;color:#263849;text-decoration:none;font:12px Arial;cursor:pointer}.button:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #f4dca4;outline-offset:4px}.guest{margin:20px 0;padding:12px 6px;border-block:1px solid #bdab8955}.guest small{display:block;font-size:9px;color:#e6dfd4}.guest strong{display:block;font-size:14px;margin-top:7px}.demo-info{display:block;font-size:9px;color:#d8dce1;margin-top:17px}.cover .date{font-size:11px}.divider{display:block;font-size:35px;color:#d9bc82;margin:22px 0}.draft-countdown{position:relative;z-index:3;color:#4d5b6f;font-size:11px!important}.invitation-countdown{position:relative;z-index:3}.desktop{position:fixed;inset:0 450px 0 0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:40px;background:radial-gradient(ellipse at center,#faf9f3,#dce4e8)}.desktop:before,.desktop:after{content:"";position:absolute;pointer-events:none;width:260px;height:240px;background:url('/images/ornaments/bunga-klasik/ornamen-bunga-klasik.webp') left top/contain no-repeat;opacity:.85}.desktop:before{top:0;left:0}.desktop:after{bottom:0;right:0;transform:rotate(180deg)}.desktop>span{font-size:9px;letter-spacing:2px}.desktop h2{font:clamp(32px,4vw,56px)/1.15 Georgia;margin:20px 0}.desktop em{color:#9d824d;font-weight:400}.desktop-photo{width:150px;height:190px;overflow:hidden;border-radius:85px 85px 6px 6px;border:1px solid #bd9c60;padding:5px}.desktop-photo img{width:100%;height:100%;object-fit:cover;border-radius:inherit}.desktop p{font-size:12px;line-height:1.9}.desktop a{color:inherit;font-size:11px;margin-top:12px}.couple-photo{position:relative;z-index:2;margin:22px auto 25px;width:250px;max-width:100%;aspect-ratio:25/31;border:1px solid #c3a46b;padding:7px;border-radius:140px 140px 8px 8px;background:#fdfbf5}.couple-photo img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}.names .amp{font:31px Georgia;color:#dfc895;display:block}.names article p{font-size:12px}.section-title{position:relative;z-index:2;font:34px/1.2 Georgia;margin:60px 0 28px;color:#4d5b6f}.events .section-title{margin:0 0 16px}.events .mihrab{margin-bottom:0}.events-panel .event-card+.event-card{margin-top:24px;padding-top:24px;border-top:1px solid #bdab8977}.events-panel .event-card h3{margin:10px 0}.events-panel .event-card p{margin:10px 0}.events-panel .event-card>strong{margin-top:12px}.event-card>strong,.event-card>small{display:block}.event-card>strong{font-size:13px;margin-top:20px}.event-card .time{font-size:15px}.section-caption{position:relative;z-index:2;font-size:12px;margin-bottom:26px}.photos{position:relative;z-index:2;display:grid;gap:18px}.photos figure{margin:0;padding:7px;border:1px solid #c4aa77;background:#fffdf5;border-radius:3px}.photos img{display:block;width:100%;height:auto;max-height:490px;object-fit:contain}.gift-intro{margin-bottom:30px}.gift-card{margin-bottom:25px}.gift-card>span,.gift-card>b,.copy-status{display:block}.gift-card>b{font:26px Georgia;margin:22px 0;overflow-wrap:anywhere}.copy-status{font-size:11px;margin-top:12px}.rsvp form{text-align:left;margin-top:22px}.rsvp label{display:block;font-size:11px;margin:12px 0 5px}input,select,textarea{width:100%;font:16px Arial;border:1px solid #aeb8c7;border-radius:5px;background:#fffaf0;color:#394a60;padding:11px}.rsvp form button{margin-top:17px;width:100%}footer .mihrab>a{font-size:11px;color:#eee0c4}.cover-panel{margin-top:10px}main nav{position:fixed;bottom:16px;right:20px;width:410px;z-index:30;display:flex;justify-content:space-around;padding:8px;background:#4d5b6ff2;border:1px solid #c6aa70;border-radius:25px;box-shadow:0 8px 24px #28374622}main nav a{color:#fffaf0;font-size:11px;padding:7px 10px;text-decoration:none}.invitation-locked body{overflow:hidden}.invitation-locked main nav{display:none}@media(max-width:800px){.desktop{display:none}main{width:100%;max-width:500px;margin:auto}main nav{right:50%;transform:translateX(50%);width:calc(100% - 30px);max-width:460px}main>section,main>footer{padding:38px 23px 90px}.corner{width:158px}.mihrab{border-top-width:132px;padding-inline:17px}.cover h1{font-size:55px}.mihrab h2{font-size:30px}.mihrab h3{font-size:28px}}@media(max-width:350px){main>section,main>footer{padding-inline:18px}.mihrab{border-top-width:110px;padding-inline:12px}.mihrab h1{font-size:46px}.mihrab h2{font-size:27px}.corner{width:140px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

/* Compact mobile slides; retain scrolling for enlarged text and longer custom content. */
@media (max-width:800px) {
  body[data-theme="ornamen-bunga-klasik"] main>section,
  body[data-theme="ornamen-bunga-klasik"] main>footer {
    padding:16px 20px max(82px, calc(72px + env(safe-area-inset-bottom, 0px)));
    align-content:start;
  }
  .mihrab {width:100%;border-width:108px 10px 12px;padding:6px 16px 14px}
  .corner {width:120px}
  .cover-panel {margin-top:0}
  .mihrab h1 {font-size:46px;margin:12px 0}
  .mihrab h1 i {font-size:25px;margin:4px 0}
  .mihrab h2 {font-size:27px;margin:12px 0}
  .mihrab h3 {font-size:24px;margin:10px 0 6px}
  .mihrab p {line-height:1.6;margin:10px 0}
  .guest {margin:12px 0;padding:8px 4px}
  .demo-info {margin-top:10px}
  .divider {font-size:25px;margin:10px 0}
  .button,button {min-height:44px;padding:12px 16px}
  .couple-photo {height:clamp(140px,26dvh,240px);width:auto;max-width:100%;margin:12px auto;padding:4px}
  .names .amp {font-size:24px;line-height:1.2}
  .names article p {margin:6px 0}
  .section-title,.events .section-title {font-size:28px;margin:0 0 12px}
  .section-caption {margin:0 0 14px}
  .events-panel .event-card+.event-card {margin-top:12px;padding-top:12px}
  .events-panel .event-card h3 {margin:6px 0}
  .events-panel .event-card p {margin:6px 0}
  .events-panel .event-card>strong {margin-top:6px}
  .gift-intro {margin-bottom:14px}
  .gift-card {margin-bottom:0;padding-top:14px;border-top:1px solid #bdab8977}
  .gift-card>b {font-size:24px;margin:12px 0}
  .copy-status:empty {display:none}
  .rsvp form {margin-top:12px}
  .rsvp label {margin:7px 0 3px}
  .rsvp input,.rsvp select {height:44px;padding:8px}
  .rsvp textarea {height:60px;min-height:44px;padding:8px}
  .rsvp form button {margin-top:10px}
  #rsvp-status:empty {display:none}
}
@media (max-width:800px) and (max-height:700px) {
  .mihrab {border-top-width:80px;padding-bottom:10px}
  .mihrab h2 {font-size:24px;margin:8px 0}
  .mihrab h3 {font-size:22px}
  .mihrab p {margin:8px 0;line-height:1.5}
  .couple-photo {height:140px;margin:8px auto}
  .rsvp form {margin-top:8px}
  .rsvp label {margin-top:4px}
  .rsvp textarea {height:48px}
  .events-panel .event-card+.event-card {margin-top:8px;padding-top:8px}
}
@media (max-width:800px) and (max-height:700px) {
  .events-panel .event-card {line-height:1.35}
  .events-panel .event-card p {line-height:1.4;margin:4px 0}
  .events-panel .event-card h3 {margin:4px 0}
  .events-panel .event-card>strong {margin-top:4px}
}
@media (max-width:800px) and (max-height:600px) {
  body[data-theme="ornamen-bunga-klasik"] main>section,
  body[data-theme="ornamen-bunga-klasik"] main>footer {padding-top:10px;padding-inline:14px}
  .mihrab {border-top-width:64px;padding-inline:12px}
  .mihrab h1 {font-size:40px;margin:8px 0}
  .mihrab h2 {font-size:22px}
  .mihrab p {margin:6px 0}
  .divider {margin:6px 0}
  .guest {margin:8px 0;padding:6px 4px}
  .events-panel .eyebrow {display:none}
  .events-panel .event-card h3 {font-size:20px}
  .events-panel .event-card+.event-card {margin-top:6px;padding-top:6px}
  .gift-intro {margin-bottom:8px}
  .gift-card {padding-top:8px}
  .gift-card>b {margin:8px 0}
  .rsvp form {display:grid;grid-template-columns:76px minmax(0,1fr);gap:8px;align-items:center}
  .rsvp label {margin:0}
  .rsvp form button,.rsvp #rsvp-status {grid-column:1/-1;margin:0}
}

/* The invitation remains a narrow panel on desktop, so gallery fitting applies at every viewport width. */
  /* Allocate only the space left after the heading, caption and navigation. */
  main>.gallery {display:grid;grid-template-rows:auto auto minmax(0,1fr)}
  .gallery .photos {min-height:0;min-width:0;gap:10px;grid-auto-rows:minmax(0,1fr)}
  .gallery .photos figure {position:relative;height:auto;min-height:0;min-width:0;padding:5px}
  .gallery .photos img {position:absolute;inset:5px;width:calc(100% - 10px);height:calc(100% - 10px);min-height:0;max-height:none;object-fit:contain}

.gallery .section-title {margin:0 0 12px}
.gallery .section-caption {margin:0 0 14px}
/* Keep the gallery heading close to the top on mobile and desktop previews. */
body[data-theme="ornamen-bunga-klasik"] main>.gallery {padding-top:8px}
.gallery .section-title {margin:0 0 8px}
.gallery .section-caption {margin:0 0 10px}
@media (max-width:800px) and (max-height:700px) {
  .rsvp .mihrab h2 {margin:4px 0}
  .rsvp form {margin-top:4px}
  .rsvp textarea {height:44px}
}
@media (max-width:800px) and (max-height:600px) {
  .events-panel .event-card+.event-card {margin-top:4px;padding-top:4px}
}
@media (max-width:800px) and (max-height:700px) {
  .rsvp form button {margin-top:6px}
}
/* Extend each mosque frame through the available slide area. */
  body[data-theme="ornamen-bunga-klasik"] main>section:not(.gallery),
  body[data-theme="ornamen-bunga-klasik"] main>footer {
    display:flex;
    flex-direction:column;
  }
  main>section:not(.gallery)>.mihrab,
  main>footer>.mihrab {
    width:100%;
    flex:1 0 auto;
    margin-block:0;
    align-content:center;
  }
  main>section>.section-title,
  main>section>.invitation-countdown,
  main>footer>.invitation-countdown {flex-shrink:0}