:root{--bg:#fbfaf7;--ink:#171717;--muted:#77716b;--line:#e8e1d8;--paper:#fffefa}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Montserrat,system-ui,sans-serif;letter-spacing:.04em}
.nav{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem clamp(1rem,4vw,4rem);background:rgba(251,250,247,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.brand{text-transform:uppercase;font-family:Playfair Display,serif;font-size:1.15rem;letter-spacing:.35em}.brand span,.script,h2 span,h3{font-family:Parisienne,cursive;text-transform:none;letter-spacing:0;font-weight:400}
.links{display:flex;gap:1rem;flex-wrap:wrap}.links a,a{color:var(--ink);font-weight:700;text-decoration:none}
.hero{min-height:88vh;display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(1.5rem,5vw,5rem);width:min(1180px,92vw);margin:0 auto;padding:4rem 0}
.photo{min-height:620px;background:center/cover;box-shadow:0 28px 90px rgba(0,0,0,.13)}.hero-card{text-align:center}
.kicker,h2{text-transform:uppercase;letter-spacing:.36em;font-size:clamp(1.8rem,4vw,3.3rem);font-family:Playfair Display,serif;margin:.2rem 0 1.5rem}
h1{font-family:Parisienne,cursive;font-size:clamp(4rem,10vw,8rem);font-weight:400;letter-spacing:0;line-height:.84;margin:0 0 1rem}
.hero-text,.center{text-align:center}.date-line{margin:2rem 0 1rem;text-transform:uppercase;font-weight:800;letter-spacing:.28em}
.countdown{display:flex;justify-content:center;gap:.7rem;flex-wrap:wrap;margin:1rem 0 1.6rem}.countdown span{border:1px solid var(--line);padding:.8rem;min-width:86px;background:#fff}.countdown b{display:block;font-size:1.25rem}
.btn{border:1px solid var(--ink);padding:.95rem 1.3rem;background:var(--ink);color:#fff;text-transform:uppercase;font-weight:800;letter-spacing:.16em;cursor:pointer;display:inline-flex;justify-content:center}
main{width:min(980px,92vw);margin:0 auto 4rem;display:grid;gap:2rem}.admin-main{width:min(1180px,94vw)}
.card{background:var(--paper);border:1px solid var(--line);padding:clamp(1.4rem,4vw,4rem);box-shadow:0 18px 58px rgba(0,0,0,.06)}.card h2{text-align:center}
.intro,.note{max-width:760px;margin:0 auto 2.5rem;text-transform:uppercase;line-height:1.8}.locations{display:grid;grid-template-columns:1fr 1fr;gap:2rem;text-align:center;margin:2rem 0}.locations article{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:2rem 1rem}
h3{font-size:2.6rem;margin:.2rem 0}.locations p{text-transform:uppercase;line-height:1.8}
.timeline{position:relative;width:min(720px,100%);margin:2rem auto 0;display:grid;gap:1.4rem}.timeline:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:#111}
.dot{position:relative;width:50%;padding:0 2.2rem 0;text-align:left}.dot:before{content:"";position:absolute;top:.5rem;width:18px;height:18px;border-radius:50%;background:#111}
.dot.left{justify-self:start;text-align:right}.dot.right{justify-self:end}.dot.left:before{right:-9px}.dot.right:before{left:-9px}
.dot b{display:block;font-family:Parisienne,cursive;font-size:2.5rem;font-weight:400;letter-spacing:0}.dot span{font-family:Playfair Display,serif;font-size:1.45rem;text-transform:uppercase;letter-spacing:.18em;font-weight:700}
.dress{text-align:center}.dress p{text-transform:uppercase;line-height:1.9;max-width:720px;margin:0 auto 2rem}.palette{display:flex;justify-content:center;gap:.6rem;margin:1.5rem auto}.palette i{display:block;width:56px;height:68px;border-radius:30px 30px 0 0;background:var(--c);box-shadow:inset 0 -10px 0 rgba(255,255,255,.55)}
.script{font-family:Parisienne,cursive!important;text-transform:none!important;font-size:2.4rem;letter-spacing:0}
.form{display:grid;gap:1rem;max-width:720px;margin:0 auto}.split{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
label{display:grid;gap:.4rem;font-weight:800;text-transform:uppercase;font-size:.82rem}input,select,textarea{border:1px solid var(--line);padding:1rem;background:#fff;font:inherit;letter-spacing:.04em;width:100%}
.upload{display:flex;justify-content:center;align-items:center;gap:1rem;flex-wrap:wrap}.muted{color:var(--muted)}footer{text-align:center;padding:3rem;font-family:Parisienne,cursive;font-size:2rem}
.toast{position:fixed;top:86px;left:50%;transform:translateX(-50%);z-index:20;background:#111;color:white;padding:.9rem 1.2rem;font-weight:800}.toast.inline{position:static;transform:none;margin-bottom:1rem}
.admin-body{display:grid;place-items:center;min-height:100vh}.login-card{width:min(460px,92vw)}
.admin-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.full{grid-column:1/-1}.check{display:flex;align-items:center;gap:.7rem}.check input{width:auto}
.module-list{display:grid;gap:.8rem}.module-row{display:grid;grid-template-columns:1fr auto auto auto;gap:.7rem;align-items:center;border:1px solid var(--line);padding:.9rem;background:#fff}.module-row button{padding:.8rem;border:1px solid var(--line);background:#fff;cursor:pointer;font-weight:900}
.color-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.7rem}.sticky-save{position:sticky;bottom:1rem;z-index:9;width:100%;margin:1rem 0}
.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;min-width:900px;font-size:.9rem}th,td{border-bottom:1px solid var(--line);padding:.8rem;text-align:left;vertical-align:top}.file-list{columns:2;line-height:1.9}
@media(max-width:850px){.hero{grid-template-columns:1fr;padding-top:1.5rem}.photo{min-height:420px}.locations,.split,.admin-grid{grid-template-columns:1fr}.brand{letter-spacing:.16em}.nav{align-items:flex-start;flex-direction:column}.module-row{grid-template-columns:1fr 1fr 48px 48px}.color-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.timeline:before{left:10px}.dot,.dot.left,.dot.right{width:100%;justify-self:stretch;text-align:left;padding-left:2.3rem;padding-right:0}.dot.left:before,.dot.right:before{left:1px;right:auto}.dot b{font-size:2rem}.dot span{font-size:1.1rem}}


/* v2 fixes */
.brand span{font-family:inherit}
.brand .main{font-family:Playfair Display,serif;text-transform:uppercase;letter-spacing:.45em}
.brand .script-small{font-family:Parisienne,cursive;text-transform:none;letter-spacing:0;font-size:1.25rem;font-weight:400}
.photo{display:none}
.photo-wrap{height:min(72vh,690px);min-height:470px;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid var(--line);box-shadow:0 28px 90px rgba(0,0,0,.10)}
.hero-img{width:100%;height:100%;object-fit:contain;object-position:center;background:#fff}
.mixed-title{margin:.2rem 0 1.5rem;text-align:center;line-height:1.05}
.mixed-title .main{font-family:Playfair Display,serif!important;text-transform:uppercase!important;letter-spacing:.42em!important;font-size:clamp(1.8rem,4vw,3.6rem)!important;font-weight:700!important}
.mixed-title .script{font-family:Parisienne,cursive!important;text-transform:none!important;letter-spacing:0!important;font-size:clamp(2.4rem,5vw,4.6rem)!important;font-weight:400!important}
.mixed-title.small .main{font-size:clamp(1.5rem,3vw,2.8rem)!important}
.mixed-title.small .script{font-size:clamp(2.1rem,4vw,4rem)!important}
@media(max-width:900px){
  .photo-wrap{height:auto;min-height:0}
  .hero-img{height:auto;max-height:70vh}
}


/* =========================================================
   HANDY-BROWSER-VERSION
   Optimiert für Smartphone, Gäste-Link und QR-Code-Nutzung
   ========================================================= */

@media (max-width: 760px) {
  html, body {
    width: 100%;
    overflow-x: hidden;
  }

  body {
    letter-spacing: .025em;
    background: #fbfaf7;
  }

  .nav {
    position: sticky;
    top: 0;
    padding: .75rem .9rem;
    gap: .55rem;
    align-items: center;
    flex-direction: column;
  }

  .brand {
    justify-content: center;
    width: 100%;
  }

  .brand .main {
    font-size: .95rem;
    letter-spacing: .35em;
  }

  .brand .script-small {
    font-size: 1.15rem;
  }

  .links {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    gap: .45rem;
    overflow-x: auto;
    padding: .25rem .05rem .15rem;
    scrollbar-width: none;
  }

  .links::-webkit-scrollbar {
    display: none;
  }

  .links a {
    flex: 0 0 auto;
    font-size: .78rem;
    padding: .48rem .62rem;
    border: 1px solid var(--line);
    background: #fffefa;
    border-radius: 999px;
    white-space: nowrap;
  }

  .hero {
    width: 100%;
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 0;
    padding: 0;
  }

  .photo-wrap {
    width: 100%;
    height: auto;
    min-height: 0;
    border: 0;
    box-shadow: none;
    background: #fff;
  }

  .hero-img {
    display: block;
    width: 100%;
    height: auto;
    max-height: none;
    object-fit: contain;
  }

  .hero-card {
    padding: 1.6rem 1.15rem 2.2rem;
    background: #fffefa;
    border-bottom: 1px solid var(--line);
  }

  .mixed-title {
    margin: 0 0 1rem;
  }

  .mixed-title .main {
    font-size: 1.45rem !important;
    letter-spacing: .32em !important;
  }

  .mixed-title .script {
    display: inline-block;
    font-size: 2.55rem !important;
    line-height: .9;
  }

  .mixed-title.small .main {
    font-size: 1.25rem !important;
  }

  .mixed-title.small .script {
    font-size: 2.25rem !important;
  }

  h1 {
    font-size: clamp(3.7rem, 18vw, 5.8rem);
    line-height: .84;
    margin: .2rem 0 1rem;
  }

  .hero-text {
    font-size: .95rem;
    line-height: 1.65;
    max-width: 92%;
    margin: 0 auto;
  }

  .date-line {
    margin: 1.5rem auto .8rem;
    font-size: .78rem;
    letter-spacing: .18em;
    line-height: 1.6;
  }

  .countdown {
    gap: .45rem;
    margin: .9rem auto 1.25rem;
  }

  .countdown span {
    min-width: 68px;
    padding: .62rem .5rem;
    font-size: .72rem;
  }

  .countdown b {
    font-size: 1.05rem;
  }

  .btn {
    width: 100%;
    padding: 1.05rem 1rem;
    font-size: .82rem;
    letter-spacing: .13em;
  }

  main {
    width: 100%;
    margin: 0 auto 2rem;
    gap: 1rem;
    padding: 0 .85rem;
  }

  .card {
    padding: 1.55rem 1rem;
    box-shadow: none;
    border-left: 0;
    border-right: 0;
  }

  .intro, .note {
    font-size: .82rem;
    line-height: 1.75;
    margin-bottom: 1.5rem;
  }

  .locations {
    grid-template-columns: 1fr;
    gap: 1rem;
    margin: 1.2rem 0;
  }

  .locations article {
    padding: 1.3rem .75rem;
  }

  h3 {
    font-size: 2.2rem;
  }

  .locations b {
    display: block;
    font-size: .85rem;
    margin-bottom: .6rem;
  }

  .locations p {
    font-size: .78rem;
    line-height: 1.65;
    margin: .65rem auto;
  }

  .locations a {
    display: inline-flex;
    justify-content: center;
    width: 100%;
    padding: .9rem;
    border: 1px solid var(--ink);
    margin-top: .5rem;
    text-transform: uppercase;
    font-size: .78rem;
  }

  .timeline {
    width: 100%;
    margin-top: 1.2rem;
    gap: 1rem;
  }

  .timeline:before {
    left: 12px;
  }

  .dot,
  .dot.left,
  .dot.right {
    width: 100%;
    justify-self: stretch;
    text-align: left;
    padding-left: 2.5rem;
    padding-right: 0;
  }

  .dot.left:before,
  .dot.right:before {
    left: 3px;
    right: auto;
  }

  .dot b {
    font-size: 2.05rem;
    line-height: .9;
  }

  .dot span {
    font-size: 1.02rem;
    letter-spacing: .14em;
  }

  .dress p {
    font-size: .82rem;
    line-height: 1.8;
  }

  .palette {
    flex-wrap: wrap;
    gap: .45rem;
  }

  .palette i {
    width: 42px;
    height: 54px;
  }

  .script-line {
    font-size: 2rem !important;
  }

  .form {
    max-width: 100%;
    gap: .85rem;
  }

  .split {
    grid-template-columns: 1fr;
    gap: .85rem;
  }

  label {
    font-size: .75rem;
    letter-spacing: .08em;
  }

  input, select, textarea {
    min-height: 48px;
    font-size: 1rem;
    padding: .95rem;
    border-radius: 0;
  }

  textarea {
    min-height: 110px;
  }

  .upload {
    display: grid;
    gap: .8rem;
  }

  .upload input {
    background: #fff;
  }

  footer {
    padding: 2rem 1rem;
    font-size: 1.85rem;
  }

  .toast {
    top: 118px;
    width: calc(100% - 1.5rem);
    border-radius: 0;
    font-size: .82rem;
    line-height: 1.45;
  }
}

/* extra kleine Smartphones */
@media (max-width: 390px) {
  .brand .main {
    letter-spacing: .25em;
  }

  h1 {
    font-size: 3.6rem;
  }

  .mixed-title .main {
    font-size: 1.25rem !important;
    letter-spacing: .24em !important;
  }

  .mixed-title .script {
    font-size: 2.25rem !important;
  }

  .countdown span {
    min-width: 62px;
  }
}

/* Admin auf Handy bedienbarer machen */
@media (max-width: 760px) {
  .admin-main {
    width: 100%;
    padding: 0 .85rem;
  }

  .admin-grid {
    grid-template-columns: 1fr;
  }

  .module-row {
    grid-template-columns: 1fr 1fr 44px 44px;
    gap: .5rem;
    padding: .75rem;
  }

  .module-row div {
    grid-column: 1 / -1;
  }

  .module-row button {
    min-height: 44px;
  }

  .color-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sticky-save {
    bottom: .5rem;
    border-radius: 0;
  }

  .table-wrap {
    margin: 0 -1rem;
  }
}


/* =========================================================
   FINAL MOBILE POLISH
   Sticky Gäste-Menü, kompakter Countdown, RSVP-Hinweis,
   Palette in einer Reihe, Admin-Link ausgeblendet.
   ========================================================= */

.nav {
  position: sticky !important;
  top: 0 !important;
  z-index: 9999 !important;
  background: rgba(251,250,247,.94) !important;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.hero-img {
  border-radius: 0 0 22px 22px;
}

.rsvp-note {
  max-width: 760px;
  margin: -1rem auto 1.7rem;
  text-align: center;
  font-size: .86rem;
  line-height: 1.7;
  color: var(--muted);
  text-transform: uppercase;
  letter-spacing: .08em;
}

@media (max-width: 760px) {
  .nav {
    position: sticky !important;
    top: 0 !important;
    z-index: 9999 !important;
  }

  .links {
    position: sticky;
    top: 0;
  }

  .links a[href="/admin"] {
    display: none !important;
  }

  .hero-img {
    border-radius: 0 0 20px 20px;
  }

  .countdown {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr);
    gap: .35rem !important;
    width: 100%;
    max-width: 360px;
  }

  .countdown span {
    min-width: 0 !important;
    padding: .52rem .25rem !important;
    font-size: .65rem !important;
  }

  .countdown b {
    font-size: .95rem !important;
  }

  .palette {
    flex-wrap: nowrap !important;
    gap: .34rem !important;
    overflow: visible !important;
    width: 100%;
  }

  .palette i {
    width: calc((100vw - 2.4rem) / 7) !important;
    max-width: 42px;
    min-width: 34px;
    height: 54px !important;
  }

  .rsvp-note {
    margin: -1rem auto 1.4rem;
    font-size: .72rem;
    line-height: 1.65;
    max-width: 92%;
  }

  input,
  select {
    min-height: 55px !important;
    height: 55px !important;
  }

  textarea {
    min-height: 95px !important;
  }

  .form {
    gap: .75rem !important;
  }

  .card {
    scroll-margin-top: 145px;
  }
}

@media (max-width: 390px) {
  .palette i {
    width: calc((100vw - 2.2rem) / 7) !important;
    min-width: 30px;
    height: 49px !important;
  }

  .countdown span {
    font-size: .6rem !important;
  }

  .countdown b {
    font-size: .88rem !important;
  }
}


/* v2: Begleitpersonen-Felder und Admin-Löschen */
.guest-list {
  display: grid;
  gap: .65rem;
}

.guest-row {
  display: grid;
  grid-template-columns: 1fr 48px;
  gap: .5rem;
  align-items: center;
}

.guest-row button,
.danger-btn,
.secondary-btn {
  border: 1px solid var(--ink);
  background: #fffefa;
  color: var(--ink);
  font-weight: 800;
  cursor: pointer;
}

.guest-row button {
  height: 55px;
  font-size: 1.4rem;
}

.secondary-btn {
  background: #fffefa !important;
  color: var(--ink) !important;
  margin-top: .2rem;
}

.danger-btn {
  padding: .55rem .75rem;
  border-color: #7b2b21;
  color: #7b2b21;
  background: #fff7f5;
  text-transform: uppercase;
  letter-spacing: .08em;
}

@media (max-width: 760px) {
  .guest-row {
    grid-template-columns: 1fr 46px;
  }
  .secondary-btn, .danger-btn {
    width: 100%;
  }
}