/* Additions on top of the original compiled stylesheet (index-DEstLJ_I.css). Nothing here changes the original look. */
[hidden] { display: none !important; }
.skip-link { position: absolute; left: 12px; top: -64px; z-index: 50; background: var(--ink, #273e32); color: var(--cream, #f7efdd); padding: 12px 16px; border-radius: 4px; text-decoration: none; }
.skip-link:focus { top: 12px; }
.celebration-shell { position: relative; z-index: 1; }

/* countdown (date already on the page) */
.countdown { font-family: var(--font-display), serif; font-style: italic; font-size: 22px; letter-spacing: 0; font-weight: 500; color: var(--cycle-accent, #466247); }

/* "our story" strip: reuses lines already on the page */
.story-strip { width: min(1280px, calc(100% - 96px)); margin: 0 auto; padding: 56px 0 8px; }
.story-strip .eyebrow { margin-bottom: 20px; }
.story-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 0; }
.story-grid figure { margin: 0; background: var(--cycle-card, #fffaf0); color: var(--cycle-cardInk, #273e32); border: 1px solid var(--cycle-line, #d3c6ae); border-radius: 10px; overflow: hidden; box-shadow: 0 14px 34px #283c2417; transition: transform .35s ease, box-shadow .35s ease; }
.story-grid img { display: block; width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.story-grid figcaption { padding: 16px 18px 20px; font-family: var(--font-display), serif; font-size: 24px; line-height: 1.2; }
.story-grid figcaption strong { font-weight: 500; font-style: italic; }
@media (hover: hover) { .story-grid figure:hover { transform: translateY(-4px); } }

/* gentle honeymoon nudge */
.honeymoon-warm { margin: 14px 0 0; font-family: var(--font-display), serif; font-style: italic; font-size: 21px; line-height: 1.45; }
.honeymoon-link { transition: transform .25s ease; }
@media (hover: hover) { .honeymoon-link:hover { transform: translateX(4px); } }
.honeymoon-mark { display: inline-block; animation: twinkle 4.5s ease-in-out infinite; }
@keyframes twinkle { 0%, 100% { opacity: .55; transform: scale(1) rotate(0); } 50% { opacity: 1; transform: scale(1.18) rotate(12deg); } }
.success-honey { max-width: 420px; margin: 18px auto 0; font-size: 15px; line-height: 1.6; }
.success-honey a { text-underline-offset: 3px; }

/* new-photo gallery slots */
.fresh-section { width: min(1280px, calc(100% - 96px)); margin: 0 auto; padding: 24px 0 72px; }
.fresh-note { margin: 0 0 18px; color: var(--cycle-muted, #50604b); font-size: 14px; }
.fresh-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.slot { margin: 0; aspect-ratio: 4 / 5; border-radius: 10px; overflow: hidden; position: relative; }
.slot img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s ease; }
@media (hover: hover) { .slot.filled:hover img { transform: scale(1.04); } }
.slot.empty { display: grid; place-content: center; justify-items: center; gap: 8px; text-align: center; border: 1.5px dashed var(--cycle-line, #d3c6ae); background: color-mix(in srgb, var(--cycle-card, #fffaf0) 70%, transparent); color: var(--cycle-muted, #50604b); }
.slot.empty span { font-size: 22px; }
.slot.empty em { font-family: var(--font-display), serif; font-size: 20px; }

/* scroll reveal (only active when JS runs and motion is allowed) */
.js-reveal .reveal { opacity: 0; transform: translateY(18px); transition: opacity .8s ease, transform .8s ease; }
.js-reveal .reveal.in { opacity: 1; transform: none; }

@media (max-width: 899px) {
  .story-strip, .fresh-section { width: calc(100% - 40px); }
  .story-grid { grid-template-columns: 1fr; }
  .story-grid figure { display: grid; grid-template-columns: 38% 1fr; align-items: center; }
  .story-grid img { aspect-ratio: 1; height: 100%; }
  .fresh-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .honeymoon-mark { animation: none; }
  .story-grid figure, .honeymoon-link, .slot img { transition: none; }
  .js-reveal .reveal { opacity: 1; transform: none; transition: none; }
}