:root{
  --night:#0d1226;
  --night-2:#161d3c;
  --card:#1c2650;
  --card-line:#2d3868;
  --gold:#d9a441;
  --gold-soft:#f0cd8a;
  --ember:#c1502e;
  --paper:#f4ecde;
  --paper-dim:#cfc9ba;
  --muted:#8b93b8;
  --danger:#e07a5f;
}

*{box-sizing:border-box;}
html{color-scheme:dark;}
body{
  margin:0;
  background:var(--night);
  color:var(--paper);
  font-family:"Karla",system-ui,sans-serif;
  -webkit-font-smoothing:antialiased;
}

.sky{
  position:fixed;
  inset:0;
  overflow:hidden;
  pointer-events:none;
  z-index:0;
}
.spark{
  position:absolute;
  width:2px;
  height:2px;
  border-radius:50%;
  background:var(--gold-soft);
  opacity:.55;
  animation:drift 14s ease-in-out infinite;
}
@keyframes drift{
  0%,100%{ transform:translateY(0) translateX(0); opacity:.25; }
  50%{ transform:translateY(-18px) translateX(6px); opacity:.7; }
}
@media (prefers-reduced-motion: reduce){
  .spark{ animation:none; }
}

main{
  position:relative;
  z-index:1;
  max-width:460px;
  margin:0 auto;
  padding:0 24px 72px;
}

a{ color:var(--gold-soft); }

.eyebrow{
  font-family:"Barlow Semi Condensed",sans-serif;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  font-size:.78rem;
  color:var(--gold-soft);
  margin:0 0 10px;
}

h1{
  font-family:"Fraunces",serif;
  font-weight:600;
  font-size:clamp(2.1rem, 9vw, 2.55rem);
  line-height:1.06;
  letter-spacing:-.01em;
  margin:0 0 6px;
  text-wrap:balance;
  color:var(--paper);
}
h1 em{
  font-style:italic;
  font-weight:500;
  color:var(--gold);
}

h2{
  font-family:"Fraunces",serif;
  font-style:italic;
  font-weight:500;
  font-size:1.5rem;
  margin:0 0 18px;
  color:var(--paper);
}

.section-note{
  margin:-10px 0 20px;
  font-size:.86rem;
  color:var(--muted);
}

.hero{ padding:76px 0 8px; }

/* Menú hamburguesa */
.menu-toggle{
  position:fixed;
  top:14px;
  right:14px;
  z-index:30;
  width:44px;
  height:44px;
  border-radius:50%;
  background:rgba(13,18,38,.82);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  border:1px solid var(--card-line);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:4px;
  cursor:pointer;
}
.menu-toggle span{
  display:block;
  width:17px;
  height:1.5px;
  border-radius:2px;
  background:var(--gold-soft);
}
.menu-toggle:focus-visible,
.sheet-close:focus-visible,
.menu-overlay button:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; }

.menu-overlay{
  position:fixed;
  inset:0;
  z-index:40;
  background:var(--night);
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:32px 28px;
  overflow-y:auto;
  animation:fadeIn .2s ease-out;
}
.menu-overlay[hidden]{ display:none; }
.menu-overlay nav{ max-width:460px; width:100%; margin:0 auto; }
.menu-overlay ul{ list-style:none; margin:14px 0 0; padding:0; }
.menu-overlay li + li{ border-top:1px solid var(--card-line); }
.menu-overlay li button{
  display:block;
  width:100%;
  text-align:left;
  background:none;
  border:none;
  padding:22px 0;
  cursor:pointer;
}
.menu-item-label{
  display:block;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.7rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:6px;
}
.menu-item-title{
  display:block;
  font-family:"Fraunces",serif;
  font-style:italic;
  font-weight:500;
  font-size:1.6rem;
  line-height:1.15;
  color:var(--paper);
}
.menu-overlay li button:hover .menu-item-title{ color:var(--gold-soft); }

.sheet{
  position:fixed;
  inset:0;
  z-index:50;
  background:var(--night);
  overflow-y:auto;
  padding:76px 24px 64px;
  animation:sheetIn .26s ease-out;
}
.sheet[hidden]{ display:none; }
.sheet-inner{ max-width:460px; margin:0 auto; }
.sheet-inner h2{ font-size:1.9rem; margin-bottom:26px; }

.sheet-close{
  position:fixed;
  z-index:60;
  top:14px;
  right:14px;
  width:44px;
  height:44px;
  border-radius:50%;
  background:rgba(13,18,38,.82);
  border:1px solid var(--card-line);
  color:var(--gold-soft);
  font-size:1.5rem;
  line-height:1;
  cursor:pointer;
}

@keyframes fadeIn{ from{ opacity:0; } to{ opacity:1; } }
@keyframes sheetIn{
  from{ opacity:0; transform:translateY(14px); }
  to{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion: reduce){
  .menu-overlay, .sheet{ animation:none; }
}

body.no-scroll{ overflow:hidden; }
body.no-scroll .menu-toggle{ visibility:hidden; }
.menu-overlay, .sheet{ overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }

.window{ display:block; margin:28px auto 22px; width:132px; height:auto; }
.window .glow{ animation:flicker 3.6s ease-in-out infinite; transform-origin:center; }
@keyframes flicker{
  0%,100%{ opacity:.85; }
  45%{ opacity:1; }
  60%{ opacity:.78; }
}
@media (prefers-reduced-motion: reduce){
  .window .glow{ animation:none; }
}

.lede{ font-size:1.06rem; line-height:1.6; color:var(--paper-dim); margin:0; }

section{ margin-top:52px; }

.countdown{ display:flex; gap:10px; margin-top:40px; }
.count-tile{
  flex:1;
  background:var(--card);
  border:1px solid var(--card-line);
  border-radius:10px;
  padding:14px 4px 12px;
  text-align:center;
}
.count-tile strong{
  display:block;
  font-family:"Fraunces",serif;
  font-weight:600;
  font-size:1.7rem;
  font-variant-numeric:tabular-nums;
  color:var(--gold-soft);
  line-height:1;
}
.count-tile span{
  display:block;
  margin-top:6px;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.68rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}

.dedication{
  border-top:1px solid var(--card-line);
  border-bottom:1px solid var(--card-line);
  padding:34px 0;
}
.dedication blockquote{
  margin:0;
  font-family:"Fraunces",serif;
  font-style:italic;
  font-weight:500;
  font-size:1.32rem;
  line-height:1.5;
  color:var(--paper);
}
.dedication cite{
  display:block;
  margin-top:16px;
  font-style:normal;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.78rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--gold);
}

.timeline{ --tl-col:116px; }
.timeline ol{ list-style:none; margin:0; padding:0; position:relative; }
.timeline ol::before{
  content:"";
  position:absolute;
  left:var(--tl-col);
  top:6px;
  bottom:6px;
  width:1px;
  background:linear-gradient(var(--card-line), transparent);
}
.timeline li{
  display:grid;
  grid-template-columns:var(--tl-col) 1fr;
  gap:14px;
  position:relative;
  padding-bottom:30px;
}
.timeline li:last-child{ padding-bottom:0; }
.timeline time{
  font-family:"Barlow Semi Condensed",sans-serif;
  font-weight:600;
  font-size:.92rem;
  letter-spacing:.03em;
  color:var(--gold-soft);
  padding-top:2px;
  font-variant-numeric:tabular-nums;
  white-space:nowrap;
  text-align:right;
  padding-right:12px;
}
.timeline li::after{
  content:"";
  position:absolute;
  left:calc(var(--tl-col) - 4px);
  top:6px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--night);
  border:2px solid var(--gold);
}
.timeline h3{ margin:0 0 4px; font-family:"Karla",sans-serif; font-weight:700; font-size:1.02rem; color:var(--paper); }
.timeline p{ margin:0; color:var(--paper-dim); font-size:.92rem; line-height:1.55; }

.dishes{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:9px; }
.dishes li{
  font-family:"Barlow Semi Condensed",sans-serif;
  font-weight:500;
  font-size:.86rem;
  letter-spacing:.02em;
  color:var(--paper);
  background:var(--card);
  border:1px solid var(--card-line);
  border-radius:999px;
  padding:8px 16px;
}

/* Cómo llegar */
.directions{
  background:var(--card);
  border:1px solid var(--card-line);
  border-radius:14px;
  padding:22px 20px;
}
.directions .address{
  font-family:"Fraunces",serif;
  font-size:1.1rem;
  color:var(--paper);
  margin:0 0 14px;
  line-height:1.4;
}
.map-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:.82rem;
  color:var(--night);
  background:var(--gold);
  border-radius:999px;
  padding:10px 18px;
  text-decoration:none;
}
.map-link:hover{ background:var(--gold-soft); }

/* Gallery */
.gallery{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:8px;
}
.gallery button{
  padding:0;
  border:1px solid var(--card-line);
  border-radius:8px;
  overflow:hidden;
  background:var(--card);
  aspect-ratio:1;
  cursor:pointer;
}
.gallery img{ width:100%; height:100%; object-fit:cover; display:block; }

.lightbox{
  position:fixed;
  inset:0;
  background:rgba(9,12,26,.92);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  z-index:20;
}
.lightbox img{ max-width:100%; max-height:100%; border-radius:8px; }
.lightbox[hidden]{ display:none; }

.link-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  background:var(--card);
  border:1px solid var(--card-line);
  border-radius:14px;
  padding:20px;
  text-decoration:none;
}
.link-card:hover{ border-color:var(--gold); }
.link-card-title{
  display:block;
  font-family:"Fraunces",serif;
  font-style:italic;
  font-weight:500;
  font-size:1.16rem;
  color:var(--paper);
}
.link-card-count{
  display:block;
  margin-top:6px;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.74rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
}
.link-card-arrow{
  font-size:1.3rem;
  color:var(--gold);
  transition:transform .18s ease-out;
}
.link-card:hover .link-card-arrow{ transform:translateX(4px); }
@media (prefers-reduced-motion: reduce){
  .link-card-arrow{ transition:none; }
}

.page-back{
  position:fixed;
  top:14px;
  left:14px;
  z-index:30;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.78rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--gold-soft);
  text-decoration:none;
  background:rgba(13,18,38,.82);
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  border:1px solid var(--card-line);
  border-radius:999px;
  padding:9px 16px;
}
.page-back:hover{ border-color:var(--gold); }

.field-note{
  margin:8px 0 0;
  font-size:.78rem;
  color:var(--muted);
}

.empty-card{
  background:var(--card);
  border:1px dashed var(--card-line);
  border-radius:14px;
  padding:26px 20px;
  text-align:center;
  color:var(--muted);
  font-size:.92rem;
  line-height:1.6;
}

/* Video */
.video-card{
  background:var(--card);
  border:1px solid var(--card-line);
  border-radius:14px;
  overflow:hidden;
}
.video-card video{ width:100%; display:block; background:#000; }
.video-caption{
  padding:14px 16px;
  font-size:.88rem;
  color:var(--paper-dim);
}

/* Suggestions form */
.suggestion-form label{
  display:block;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.74rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
  margin:16px 0 6px;
}
.suggestion-form label:first-of-type{ margin-top:0; }
.suggestion-form input[type="text"],
.suggestion-form textarea{
  width:100%;
  background:var(--card);
  border:1px solid var(--card-line);
  border-radius:10px;
  color:var(--paper);
  font-family:"Karla",sans-serif;
  font-size:1rem;
  padding:14px;
}
.suggestion-form textarea{ min-height:110px; resize:vertical; }
.suggestion-form input[type="text"]:focus,
.suggestion-form textarea:focus{ outline:2px solid var(--gold); outline-offset:2px; }
.suggestion-form button{
  margin-top:12px;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:.84rem;
  color:var(--night);
  background:var(--gold);
  border:none;
  border-radius:999px;
  padding:12px 22px;
  cursor:pointer;
}
.suggestion-form button:hover{ background:var(--gold-soft); }
.suggestion-form button:disabled{ opacity:.6; cursor:default; }
.form-status{ margin-top:12px; font-size:.88rem; }
.form-status.ok{ color:var(--gold-soft); }
.form-status.error{ color:var(--danger); }

.closing{
  margin-top:60px;
  padding-top:36px;
  border-top:1px solid var(--card-line);
  text-align:center;
}
.flame{
  width:14px;
  height:20px;
  margin:0 auto 20px;
  border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;
  background:radial-gradient(circle at 50% 70%, var(--gold-soft), var(--ember) 75%);
  filter:blur(.2px);
  animation:flicker 2.4s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce){ .flame{ animation:none; } }
.closing p{
  font-family:"Fraunces",serif;
  font-style:italic;
  font-weight:500;
  font-size:1.3rem;
  line-height:1.5;
  color:var(--paper);
  margin:0;
}
.closing .admin-link{
  display:inline-block;
  margin-top:28px;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.72rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
  text-decoration:none;
}

/* Admin page */
.admin-shell{ max-width:520px; }
.login-card{
  background:var(--card);
  border:1px solid var(--card-line);
  border-radius:14px;
  padding:28px 24px;
  margin-top:40px;
}
.login-card label{
  display:block;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.76rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
  margin:16px 0 6px;
}
.login-card label:first-of-type{ margin-top:0; }
.login-card input{
  width:100%;
  background:var(--night-2);
  border:1px solid var(--card-line);
  border-radius:8px;
  color:var(--paper);
  font-size:1rem;
  padding:11px 12px;
}
.login-card input:focus{ outline:2px solid var(--gold); outline-offset:2px; }
.login-card button{
  margin-top:20px;
  width:100%;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:.86rem;
  color:var(--night);
  background:var(--gold);
  border:none;
  border-radius:8px;
  padding:13px;
  cursor:pointer;
}
.login-card button:hover{ background:var(--gold-soft); }

.panel-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-top:44px;
}
.logout-btn{
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.76rem;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--muted);
  background:none;
  border:1px solid var(--card-line);
  border-radius:999px;
  padding:8px 14px;
  cursor:pointer;
}
.logout-btn:hover{ color:var(--paper); border-color:var(--gold); }

.suggestion-item{
  background:var(--card);
  border:1px solid var(--card-line);
  border-radius:10px;
  padding:14px 16px;
  margin-bottom:10px;
}
.suggestion-item.unseen{ border-color:var(--gold); }
.suggestion-item p{ margin:0 0 8px; line-height:1.5; }
.suggestion-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-size:.76rem;
  color:var(--muted);
}
.suggestion-meta button{
  background:none;
  border:none;
  color:var(--gold-soft);
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.74rem;
  letter-spacing:.05em;
  text-transform:uppercase;
  cursor:pointer;
  padding:10px 4px;
}

.upload-form{
  background:var(--card);
  border:1px solid var(--card-line);
  border-radius:14px;
  padding:20px;
  margin-bottom:20px;
}
.upload-form label{
  display:block;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-size:.76rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--muted);
  margin:14px 0 6px;
}
.upload-form label:first-of-type{ margin-top:0; }
.upload-form select,
.upload-form input[type="text"]{
  width:100%;
  background:var(--night-2);
  border:1px solid var(--card-line);
  border-radius:8px;
  color:var(--paper);
  font-size:1rem;
  padding:10px 12px;
}
.upload-form input[type="file"]{ color:var(--paper-dim); font-size:.88rem; }
.upload-form button{
  margin-top:16px;
  font-family:"Barlow Semi Condensed",sans-serif;
  font-weight:600;
  letter-spacing:.04em;
  text-transform:uppercase;
  font-size:.82rem;
  color:var(--night);
  background:var(--gold);
  border:none;
  border-radius:999px;
  padding:11px 20px;
  cursor:pointer;
}
.upload-form button:disabled{ opacity:.6; cursor:default; }

.media-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:10px;
}
.media-tile{
  position:relative;
  border:1px solid var(--card-line);
  border-radius:8px;
  overflow:hidden;
  background:var(--night-2);
  aspect-ratio:1;
}
.media-tile img,
.media-tile video{ width:100%; height:100%; object-fit:cover; }
.media-tile .delete-btn{
  position:absolute;
  top:6px;
  right:6px;
  background:rgba(13,18,38,.8);
  color:var(--paper);
  border:1px solid var(--card-line);
  border-radius:6px;
  font-size:.74rem;
  padding:8px 12px;
  cursor:pointer;
}

.muted{ color:var(--muted); font-size:.88rem; }