/*
Theme Name: Twenty Twenty-Five Child
Template: twentytwentyfive
*/

/* =========================
   Wedding Site Design Tokens
   ========================= */
:root{
  /* Palette (pulled from your photo references) */
  --w-ivory:    #F7F4EE; /* soft paper */
  --w-sand:     #D4C9C2; /* warm neutral */
  --w-stone:    #BEB8AA; /* deeper neutral */
  --w-sage:     #43463A; /* muted green/olive */
  --w-charcoal: #2E2D24; /* dark neutral */
  --w-ink:      #13100F; /* near-black */

  /* Accent */
  --w-blush:    #E8B7A3; /* your RSVP button color */
  --w-gold:     #A29578; /* warm metallic-ish neutral */

  /* Text */
  --w-text:     var(--w-charcoal);
  --w-muted:    rgba(46,45,36,.68);

  /* Lines / shadows */
  --w-line:     rgba(19,16,15,.12);
  --w-shadow:   0 18px 45px rgba(19,16,15,.10);

  /* Radius + spacing */
  --w-r-lg: 18px;
  --w-r-md: 12px;
  --w-r-pill: 999px;

  /* Type (safe defaults; optionally swap later) */
  --w-font-body: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji", "Segoe UI Emoji";
  --w-font-head: ui-serif, Georgia, "Times New Roman", Times, serif;

  --w-max: 980px;
}


/* =========================
   Global Base
   ========================= */
body{
  font-family: var(--w-font-body);
  color: var(--w-text);
  background: linear-gradient(180deg, var(--w-ivory), #fff);
}

a{
  color: var(--w-sage);
  text-decoration-color: rgba(67,70,58,.35);
  text-underline-offset: 3px;
}
a:hover{ text-decoration-color: rgba(67,70,58,.8); }

h1,h2,h3{
  font-family: var(--w-font-head);
  letter-spacing: .2px;
  color: var(--w-text);
}

.wp-site-blocks,
.site,
.site-content{
  background: transparent;
}

.w-container{
  width: min(100% - 36px, var(--w-max));
  margin-inline: auto;
}


/* =========================
   Components
   ========================= */
.w-card{
  background: rgba(247,244,238,.92);
  border: 1px solid var(--w-line);
  border-radius: var(--w-r-lg);
  box-shadow: var(--w-shadow);
  padding: 26px;
}

.w-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  background: var(--w-blush);
  color: var(--w-ink);
  border: 1px solid rgba(19,16,15,.12);
  border-radius: var(--w-r-pill);

  padding: 12px 18px;
  font-weight: 700;
  cursor: pointer;

  transition: transform .08s ease, box-shadow .2s ease, filter .2s ease;
  text-decoration: none;
}
.w-btn:hover{ filter: brightness(1.02); box-shadow: 0 10px 30px rgba(19,16,15,.12); }
.w-btn:active{ transform: translateY(1px); }

.w-field{ margin: 14px 0; }
.w-field label{
  display:block;
  font-weight: 650;
  margin: 0 0 6px;
  color: var(--w-text);
}
.w-input,
.w-textarea{
  width: 100%;
  padding: 12px 14px;
  border-radius: var(--w-r-md);
  border: 1px solid var(--w-line);
  background: #fff;
  font-size: 16px;
  outline: none;
}
.w-input:focus,
.w-textarea:focus{
  border-color: rgba(67,70,58,.55);
  box-shadow: 0 0 0 4px rgba(232,183,163,.22);
}

.w-small{ font-size: 13px; color: var(--w-muted); }
.w-divider{ border-top: 1px solid var(--w-line); margin: 18px 0; }

.w-site-header{
  position: sticky;
  top: 0;
  z-index: 50;
  background: rgba(247,244,238,.86);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--w-line);
}

.w-header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding: 18px 0;
}

.w-brand{
  font-family: var(--w-font-head);
  font-size: 20px;
  letter-spacing: .3px;
  color: var(--w-text);
  text-decoration:none;
}

.w-menu{
  display:flex;
  gap: 18px;
  list-style:none;
  margin:0;
  padding:0;
}

.w-menu a{
  color: #13100F !important;
  text-decoration:none;
  font-weight:600;
  opacity:.9;
}
.w-menu a:hover{ opacity:1; }


/* =========================
   Header / Footer (Classic)
   ========================= */

.w-container{
  width: min(100% - 36px, var(--w-max, 980px));
  margin-inline: auto;
}

/* Header */
.w-site-header{
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(247,244,238,.86);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--w-line, rgba(19,16,15,.12));
}

.w-header-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 16px;
  padding: 14px 0;
}

.w-brand{
  display:flex;
  align-items:center;
  gap: 12px;
  text-decoration:none;
  color: var(--w-text, #2E2D24);
}

.w-brand .custom-logo{
  width: auto;
  display:block;
  max-height: 150px;
}

.w-brand-text{
  font-family: var(--w-font-head, ui-serif, Georgia, serif);
  font-size: 20px;
  letter-spacing: .3px;
}

/* Nav */
.w-nav-toggle{
  display:none;
  border: 1px solid var(--w-line, rgba(19,16,15,.12));
  background: #fff;
  border-radius: 999px;
  padding: 10px 14px;
  font-weight: 700;
  cursor: pointer;
}

.w-menu{
  display:flex;
  align-items:center;
  gap: 18px;
  list-style:none;
  margin:0;
  padding:0;
}

.w-menu a{
  color: #13100F !important;
  text-decoration:none;
  font-weight: 650;
  opacity: .9;
}

.w-menu a:hover{ opacity: 1; }

.w-menu .current-menu-item > a,
.w-menu .current_page_item > a{
  opacity: 1;
  text-decoration: underline;
  text-underline-offset: 6px;
  text-decoration-color: rgba(232,183,163,.9);
}

/* Main spacing so content doesn't smash header */
.w-site-main{
  padding-top: 60px;
  padding-bottom: 60px;
}

body.home main.w-site-main,
body.front-page main.w-site-main{
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #0b1f22;
}

body.home main.w-site-main::before,
body.front-page main.w-site-main::before{
  content: "";
  position: absolute;
  inset: -16px;
  z-index: -2;
  background: url("/wp-content/uploads/2026/01/A9_04118-scaled.jpg") center / cover no-repeat;
  filter: blur(4px);
  transform: scale(1.05);
  pointer-events: none;
}

body.home main.w-site-main::after,
body.front-page main.w-site-main::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.00));
  pointer-events: none;
}

.w-hero {
  margin-top: -60px;
}


/* Footer */
.w-site-footer{
  background: rgba(247,244,238,.92);
  border-top: 1px solid var(--w-line, rgba(19,16,15,.12));
  padding: 34px 0;
}

.w-footer-inner{
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  align-items:center;
  gap: 18px;
}

.w-footer-title{
  font-family: var(--w-font-head, ui-serif, Georgia, serif);
  font-size: 18px;
}

.w-footer-logo .custom-logo{
  max-height: 40px;
  width:auto;
}
.w-footer-menu{
  list-style:none;
  display:flex;
  gap: 16px;
  padding:0;
  margin:0;
  justify-content:center;
}

.w-footer-menu a{
  color: #13100F;
  text-decoration:none;
  font-weight: 650;
  opacity:.9;
}
.w-footer-menu a:hover{ opacity:1; }

.w-footer-meta{
  text-align:right;
}

.w-small{ font-size: 13px; color: rgba(46,45,36,.68); }

/* Mobile */
@media (max-width: 860px){
  html,
  body{
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    overflow-x: clip;
  }

  .wp-site-blocks,
  .site,
  .site-content,
  .w-site-main{
    max-width: 100%;
    overflow-x: hidden;
    overflow-x: clip;
  }

  img,
  video,
  canvas,
  svg,
  iframe{
    max-width: 100%;
  }

  .w-nav-toggle{ display:inline-flex; }
  .w-nav{ display:none; width:100%; }
  .w-nav.is-open{ display:block; }

  .w-header-inner{
    flex-wrap: wrap;
  }

  .w-menu{
    flex-direction:column;
    align-items:flex-start;
    gap: 10px;
    padding-top: 10px;
  }

  .w-footer-inner{
    grid-template-columns: 1fr;
    text-align:center;
  }
  .w-footer-meta{ text-align:center; }
  .w-footer-menu{ justify-content:center; flex-wrap:wrap; }
}


/* =========================
   Home Hero – Invitation vibe
   ========================= */

.w-hero{
  padding: 92px 0 46px;
  position: relative;
  overflow: hidden;
}

.w-hero-inner{
  text-align: center;
}

/* Soft glow / “aurora” behind hero */
.w-hero::before,
.w-hero::after{
  content:"";
  position:absolute;
  inset:-20%;
  background:
    radial-gradient(600px 420px at 30% 20%, rgba(215,166,161,.22), transparent 60%),
    radial-gradient(520px 380px at 70% 25%, rgba(215,166,161,.15), transparent 62%);
  filter: blur(2px);
  pointer-events:none;
  animation: w-aurora-drift 14s ease-in-out infinite alternate;
  opacity: .85;
}
.w-hero::after{
  animation-duration: 18s;
  opacity: .55;
}

@keyframes w-aurora-drift{
  from { transform: translate3d(-12px, -8px, 0) scale(1.02); }
  to   { transform: translate3d(12px, 10px, 0) scale(1.05); }
}

/* Eyebrow */
.w-eyebrow{
  margin: 0 0 14px;
  letter-spacing: .22em;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 12px;
  color: var(--w-text-dim, rgb(0 0 0 / 65%));
}

/* Title layout */
.w-hero-title{
  margin: 0 0 10px;
  line-height: 1.02;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  flex-wrap: wrap;
  padding: 0 10px;
}

/* Script-ish feel without importing fonts */
.w-title-script{
  font-family: ui-serif, "Georgia", serif;
  font-weight: 600;
  font-size: clamp(44px, 6vw, 78px);
  letter-spacing: .02em;
  color: rgba(247,244,238,.92);
  text-shadow:
    0 10px 40px rgba(0,0,0,.28);
}

/* Ampersand as a “gold” shimmer accent */
.w-title-amp{
  font-family: ui-serif, "Georgia", serif;
  font-size: clamp(28px, 4vw, 44px);
  font-weight: 700;
  letter-spacing: .06em;
  background: linear-gradient(90deg,
    rgba(247,244,238,.7) 0%,
    rgba(232,183,163,.95) 35%,
    rgba(247,244,238,.72) 70%,
    rgba(232,183,163,.92) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  filter: drop-shadow(0 10px 26px rgba(0,0,0,.22));
  position: relative;
}

/* Sub */
.w-hero-sub{
  margin: 0 auto 22px;
  max-width: 46ch;
  font-size: 16px;
  color: var(--w-text, rgba(247,244,238,.88));
  opacity: .92;
}

/* Sparkle accents (subtle) */
.w-hero-title::before,
.w-hero-title::after{
  content:"✦";
  position:absolute;
  font-size: 14px;
  color: rgba(232,183,163,.85);
  opacity: .0;
  transform: translateY(8px) scale(.9);
  animation: w-sparkle 3.6s ease-in-out infinite;
  pointer-events:none;
}
.w-hero-title::before{
  left: 12%;
  top: 18%;
  animation-delay: .6s;
}
.w-hero-title::after{
  right: 14%;
  top: 62%;
  animation-delay: 1.4s;
}

@keyframes w-sparkle{
  0%, 55% { opacity: 0; transform: translateY(8px) scale(.9); filter: blur(.4px); }
  70%     { opacity: .75; transform: translateY(0) scale(1.05); filter: blur(0); }
  100%    { opacity: 0; transform: translateY(-8px) scale(.9); filter: blur(.6px); }
}

/* =========================
   Entrance animations
   ========================= */

.w-anim{
  opacity: 0;
  transform: translateY(14px);
  animation: w-reveal .85s cubic-bezier(.2,.85,.2,1) forwards;
}

.w-anim-eyebrow{ animation-delay: .05s; }
.w-anim-title{ animation-delay: .18s; transform: translateY(18px) scale(.985); }
.w-anim-sub{ animation-delay: .34s; }

@keyframes w-reveal{
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Gentle “breathing” on title after reveal */
.w-anim-title{
  animation-name: w-reveal, w-float;
  animation-duration: .9s, 5.5s;
  animation-delay: .18s, 1.2s;
  animation-fill-mode: forwards, both;
  animation-timing-function: cubic-bezier(.2,.85,.2,1), ease-in-out;
  animation-iteration-count: 1, infinite;
}
@keyframes w-float{
  0%,100%{ transform: translateY(0) scale(1); }
  50%    { transform: translateY(-6px) scale(1.01); }
}

/* Reduced motion accessibility */
@media (prefers-reduced-motion: reduce){
  .w-anim{ animation: none !important; opacity: 1; transform: none; }
  .w-hero::before, .w-hero::after{ animation: none !important; }
  .w-hero-title::before, .w-hero-title::after{ animation: none !important; opacity: .35; }
}