/* KINITHHTHA V5.6 NEW EDITIONS - DESKTOP/TABLET RESPONSIVE FIX
   Scope: loaded ONLY by /demos/kf-101/ through /demos/kf-105/.
   0-767px uses original approved mobile layouts unchanged.
   No customer state, RSVP, Admin, calendar, or JS changes.
*/

@media (min-width: 768px) {
  body.template-body {
    padding: 18px clamp(12px, 3vw, 54px) 42px;
    background: radial-gradient(circle at 6% 12%, var(--haze), transparent 38%),
                linear-gradient(150deg, var(--cream), #f6f0e8 65%, var(--haze));
  }
  body.template-body .invitation-frame {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    border: 1px solid var(--edge);
    border-radius: 19px;
    padding-bottom: 112px;
    box-shadow: 0 23px 85px #30251e26;
  }
  body.template-body .invitation-frame main { min-width: 0; }
  body.template-body .demo-ribbon { border-radius: 18px 18px 0 0; min-height: 29px; }
  body.template-body .mini-top { padding: 23px 30px; }
  body.template-body .menu-popover { right: 25px; top: 100px; }
  body.template-body .mini-brand { font-size: 11px; }
  body.template-body .mobile-footer {
    width: min(750px, calc(100vw - 80px));
    max-width: 750px;
    height: 72px;
    bottom: 18px;
    padding: 6px 20px;
    border-radius: 22px;
    box-shadow: 0 12px 36px #1b1e1b35;
    border: 1px solid var(--edge);
  }
  body.template-body .mobile-footer a { font-size: 12px; gap: 4px; }
  body.template-body .mobile-footer a svg { width: 22px; height: 22px; }
  body.template-body .hero {
    min-height: 485px;
    height: 485px;
    overflow: hidden;
  }
  body.template-body .hero-image { min-height: 0; height: 100%; }
  body.template-body .hero-image img { width: 100%; height: 100%; object-fit: cover; }
  body.template-body .hero-copy { min-width: 0; }
  body.template-body .hero h1 { font-size: clamp(43px, 5.2vw, 64px)!important; }
  body.template-body .hero .overline { font-size: 11px; }
  body.template-body .hero .hero-date { font-size: 14px; }
  body.template-body .hero .hero-place { font-size: 13px; max-width: 100%; }
  body.template-body .hero .main-cta { font-size: 13px; padding: 13px 25px; }

  /* Keep the FIVE approved hero personalities, scale each for desktop. */
  body.template-body.botanical .hero,
  body.template-body.navy .hero { grid-template-columns: 53% 47%; }
  body.template-body.botanical .hero-copy { padding: 60px 30px 24px; }
  body.template-body.botanical .hero-copy-inner {
    max-width: 460px; margin: 0 auto; min-height: 325px;
    border-radius: 0 140px 140px 0; padding: 32px 16px;
  }
  body.template-body.navy .hero { grid-template-columns: 45% 55%; }
  body.template-body.navy .hero-copy { padding: 70px 38px 25px 56px; }
  body.template-body.navy .hero h1 { font-size: clamp(43px, 4.9vw, 65px)!important; }
  body.template-body.blush .hero {
    display: grid; grid-template-columns: 55% 45%; grid-template-rows: 1fr;
    background: var(--paper);
  }
  body.template-body.blush .hero-image {
    position: relative; grid-column: 1; grid-row: 1;
    height: 100%; width: 100%;
  }
  body.template-body.blush .hero-copy {
    position: relative; grid-column: 2; grid-row: 1; z-index: 3;
    margin: 48px 22px 48px -46px; width: auto;
    padding: 34px 25px; align-self: center;
    border-radius: 145px 145px 22px 22px;
  }
  body.template-body.blush .hero-copy-inner { max-width: 100%; }
  body.template-body.terracotta .hero,
  body.template-body.lavender .hero { display: block; }
  body.template-body.terracotta .hero-image,
  body.template-body.lavender .hero-image {
    position: absolute; inset: 0; width: 100%; height: 100%;
  }
  body.template-body.terracotta .hero-copy {
    position: absolute; top: 0; bottom: 0; left: auto; right: 0;
    width: 54%; height: 100%; min-height: 0;
    padding: 92px 42px 60px;
    background: linear-gradient(to left, rgba(83,39,25,.92),rgba(88,39,27,.70) 72%,transparent);
    display: flex; align-items: center; justify-content: center;
    border: 0; border-radius: 0; box-shadow: none;
  }
  body.template-body.terracotta .hero-copy-inner { max-width: 440px; }
  body.template-body.lavender .hero-copy {
    position: absolute; top: 0; bottom: 0; left: auto; right: 0;
    width: 53%; height: 100%; min-height: 0;
    padding: 92px 42px 60px;
    background: linear-gradient(to left,rgba(56,32,74,.95),rgba(61,40,80,.68) 70%,transparent);
    display: flex; align-items: center; justify-content: center;
    border: 0; border-radius: 0; box-shadow: none;
  }
  body.template-body.lavender .hero-copy-inner { max-width: 440px; }

  body.template-body .countdown-panel { padding: 25px 28px 27px; }
  body.template-body .countdown-grid { max-width: 700px; margin: 15px auto 0; }
  body.template-body .countdown-grid strong { font-size: 39px; }
  body.template-body .countdown-grid span { font-size: 12px; }
  body.template-body .block { margin: 18px clamp(18px, 3vw, 42px); padding: 29px clamp(23px, 3.5vw, 48px); }
  body.template-body .block .panel-eyebrow { font-size: 11px; }
  body.template-body .block h2 { font-size: clamp(28px, 3vw, 38px); }
  body.template-body .block p { line-height: 1.62; }
  body.template-body .section-head { margin-bottom: 23px; }
  body.template-body .section-head h2 { font-size: 35px; }

  /* Gallery: same mosaic layout families but proper landscape-scale tiles. */
  body.template-body .v54-gallery .gallery-mosaic { gap: 10px; }
  body.template-body .v54-gallery.layout-kf-001 .gallery-mosaic { grid-auto-rows: 155px; }
  body.template-body .v54-gallery.layout-kf-002 .gallery-mosaic { grid-auto-rows: 140px; gap: 17px; padding: 25px 21px 32px; }
  body.template-body .v54-gallery.layout-kf-003 .gallery-mosaic { grid-auto-rows: 165px; }
  body.template-body .v54-gallery.layout-kf-004 .gallery-mosaic { grid-auto-rows: 135px; }
  body.template-body .v54-gallery.layout-kf-005 .gallery-mosaic { grid-auto-rows: 180px; gap: 13px; }
  body.template-body .v54-gallery .mosaic-item img { width: 100%; height: 100%; object-fit: cover; }

  /* Wedding details remain VERTICAL, can grow with any custom items. */
  body.template-body .v54-events .detail-list { max-width: 930px; margin-inline: auto; }
  body.template-body .v54-events .detail-item { padding: 20px 23px; gap: 18px; }
  body.template-body .v54-events .detail-content strong { font-size: 19px; }
  /* Agenda is also a vertical timeline; preserve unlimited entries. */
  body.template-body .v54-agenda .agenda-track { max-width: 840px; margin: 23px auto 10px; }
  body.template-body .v54-agenda .agenda-step-body strong { font-size: 19px; }
  body.template-body .v54-agenda .agenda-step-body p { font-size: 14px; }

  body.template-body .v54-location .location-layout {
    display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
    align-items: center; gap: 22px;
  }
  body.template-body .v54-location .map-art { height: 310px; }
  body.template-body .v54-location.layout-kf-002 .location-layout { display: grid; grid-template-columns: 1fr 1.15fr; }
  body.template-body .v54-location.layout-kf-005 .location-layout { display: grid; grid-template-columns: 1fr 1.15fr; padding-bottom: 15px; }
  body.template-body .v54-location.layout-kf-005 .map-art { height: 320px; }

  body.template-body .v54-calendar .calendar-wrap { padding: 20px 18px; }
  body.template-body .v54-calendar .cal-split,
  body.template-body .v54-calendar.layout-kf-005 .moon-cal-card { grid-template-columns: 1fr 1fr; gap: 28px; }
  body.template-body .v54-calendar.layout-kf-005 .date-cell { font-size: 13px; }
  body.template-body .v54-calendar.layout-kf-004 .calendar-wrap { max-width: 480px; }
  body.template-body .v54-calendar .date-cell { font-size: 13px; }
  body.template-body .v54-calendar .day-grid b { font-size: 12px; }
  body.template-body .v54-calendar .calendar-heading { font-size: 21px; }
  body.template-body .v54-calendar .soft-button { font-size: 12px; padding: 11px 10px; }
  body.template-body .v54-calendar .cal-actions { min-width: 0; }
  body.template-body .v54-calendar .blush-calendar-wrap { max-width: 850px; margin-inline: auto; }

  /* Responsive story/message typography and photo compositions. */
  body.template-body .v54-story.layout-kf-001 { min-height: 385px; }
  body.template-body .v54-story.layout-kf-001 .story-copy { padding: 54px 34px; align-self: center; }
  body.template-body .v54-story.layout-kf-001 .story-copy h2 { font-size: 42px; }
  body.template-body .v54-story.layout-kf-001 .story-copy p { font-size: 17px; }
  body.template-body .v54-story.layout-kf-001 .story-portrait { min-height: 385px; }
  body.template-body .v54-story.layout-kf-002 { padding: 39px 30px; }
  body.template-body .v54-story.layout-kf-002 .scrapbook-pictures { max-width: 760px; margin: 12px auto; }
  body.template-body .v54-story.layout-kf-002 .scrapbook-pictures figure { max-width: 390px; }
  body.template-body .v54-story.layout-kf-002 .scrapbook-pictures img { height: 310px; }
  body.template-body .v54-story.layout-kf-003 .editorial-photo { height: 370px; }
  body.template-body .v54-story.layout-kf-003 .editorial-lead { padding: 45px; }
  body.template-body .v54-story.layout-kf-003 .editorial-body { padding: 28px 45px; }
  body.template-body .v54-story.layout-kf-003 .editorial-body p { font-size: 18px; }
  body.template-body .v54-story.layout-kf-004 .heritage-arch { width: min(55%, 370px); height: 380px; }
  body.template-body .v54-story.layout-kf-004 .heritage-prose { max-width: 730px; font-size: 18px; }
  body.template-body .v54-story.layout-kf-005 .moon-collage { max-width: 740px; min-height: 335px; margin: auto; }
  body.template-body .v54-story.layout-kf-005 .moon-collage figure { height: 310px; }
  body.template-body .v54-story.layout-kf-005 .moon-collage figure+figure { height: 250px; }
  body.template-body .v54-story.layout-kf-005 blockquote { max-width: 720px; margin: 22px auto 6px; font-size: 18px; }
  body.template-body .v54-note.layout-kf-001 { min-height: 410px; }
  body.template-body .v54-note.layout-kf-001 .note-copy { min-height: 410px; padding: 70px 55px; max-width: 670px; }
  body.template-body .v54-note.layout-kf-001 .note-copy h2 { font-size: 45px; max-width: 530px; }
  body.template-body .v54-note.layout-kf-001 .note-copy p { font-size: 17px; max-width: 510px; }
  body.template-body .v54-note.layout-kf-002 .letter-portrait img { height: 310px; }
  body.template-body .v54-note.layout-kf-003 blockquote { font-size: 55px; }
  body.template-body .v54-note.layout-kf-004 .note-arch-photo { height: 330px; max-width: 500px; }
  body.template-body .v54-note.layout-kf-005 { min-height: 430px; }
  body.template-body .v54-note.layout-kf-005 .moon-note-writing { min-height: 310px; max-width: 58%; padding: 42px; }
  body.template-body .v54-note.layout-kf-005 .moon-note-photo { height: 290px; width: 40%; }

  body.template-body .v54-dress { padding-block: 39px; }
  body.template-body .v54-contact .contact-row { max-width: 900px; margin-inline: auto; gap: 18px; }
  body.template-body .v54-contact .contact-row>div { padding: 18px; }
  body.template-body .v54-rsvp { padding-block: 40px; }
  body.template-body .v54-rsvp form { max-width: 700px; margin-inline: auto; }
  body.template-body .v55-custom { min-height: 300px; }
  body.template-body .v55-custom img { min-height: 300px; }
  body.template-body .v55-custom .custom-writing { padding: 45px; }
  body.template-body .v55-custom-cinematic { min-height: 410px; }
  body.template-body .v55-custom-cinematic img,
  body.template-body .v55-custom-cinematic .custom-writing { min-height: 410px; }
}

@media (min-width: 1100px) {
  body.template-body .hero { min-height: 600px; height: 600px; }
  body.template-body .hero h1 { font-size: clamp(54px, 5.5vw, 79px)!important; }
  body.template-body.botanical .hero-copy { padding-inline: 48px; }
  body.template-body.blush .hero-copy { margin: 65px 44px 65px -55px; padding: 42px 30px; }
  body.template-body .countdown-panel { padding-block: 34px; }
  body.template-body .block { margin-top: 24px; margin-bottom: 24px; }
}

/* No desktop layout rules below 768px: keep the approved mobile untouched. */