:root{
  --ink-navy: #16223E;
  --ink-navy-deep: #0D1730;
  --wine: #6E2A3B;
  --wine-deep: #4E1D29;
  --gold: #C9A24B;
  --gold-bright: #E7C77A;
  --parchment: #F4ECD8;
  --parchment-edge: #E4D6AE;
  --ink-text: #2B2418;
  --ink-text-soft: #5B4E33;
  --ivory: #F7F3E8;
  --ivory-dim: #C6CADC;
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-body: 'Work Sans', -apple-system, sans-serif;
}

/* ---------- HERO ---------- */
.hero.pedido-hero{
  position: relative;
  min-height: 80vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background: radial-gradient(circle at 50% 20%, #223256 0%, var(--ink-navy) 45%, var(--ink-navy-deep) 100%);
  color: var(--ivory);
  padding: 3rem 1.5rem 4rem;
  overflow:hidden;
  font-family: var(--font-body);
}
.pedido-hero .hero-glow{
  position:absolute; top: 14%; left:50%;
  width: 440px; height: 440px; max-width: 90vw;
  transform: translateX(-50%);
  background: radial-gradient(circle, rgba(201,162,75,0.38) 0%, rgba(201,162,75,0) 70%);
  filter: blur(6px);
  animation: glow-pulse 4.5s ease-in-out infinite;
  pointer-events:none;
}
@keyframes glow-pulse{
  0%, 100%{ opacity:.5; transform: translateX(-50%) scale(1); }
  50%{ opacity:.85; transform: translateX(-50%) scale(1.08); }
}
.pedido-hero .hero-inner{ position:relative; z-index:1; max-width: 640px; margin: 0 auto; display:flex; flex-direction:column; align-items:center; }
.pedido-hero .eyebrow{ font-size: .78rem; letter-spacing: .3em; text-transform: uppercase; color: var(--gold-bright); margin: 0 0 1.75rem; }
.pedido-hero .candle-svg{ width: 56px; height: 94px; margin-bottom: 1.5rem; overflow: visible; }
.pedido-hero .flame-outer{ fill: url(#flameGradient); transform-origin: 30px 30px; animation: flicker 3.2s ease-in-out infinite; }
.pedido-hero .flame-inner{ fill: #FFF3D6; opacity:.85; transform-origin: 30px 34px; animation: flicker 2.6s ease-in-out infinite .2s; }
.pedido-hero .candle-wax{ fill: var(--gold-bright); }
.pedido-hero .candle-body{ fill: var(--parchment-edge); }
@keyframes flicker{
  0%, 100%{ transform: scaleY(1) scaleX(1) rotate(0deg); opacity:1; }
  25%{ transform: scaleY(1.06) scaleX(.95) rotate(-2deg); opacity:.9; }
  50%{ transform: scaleY(.93) scaleX(1.05) rotate(1.5deg); opacity:1; }
  75%{ transform: scaleY(1.04) scaleX(.97) rotate(-1deg); opacity:.94; }
}
.pedido-hero h1{ font-family: var(--font-display); font-weight: 600; font-size: clamp(2.1rem, 5vw, 3.2rem); line-height: 1.2; margin: 0 0 1.25rem; }
.pedido-hero h1 em{ font-style: italic; color: var(--gold-bright); font-weight: 500; }
.pedido-hero .hero-copy{ font-size: 1.05rem; line-height: 1.7; color: var(--ivory-dim); margin: 0 0 2.25rem; max-width: 46ch; }
.pedido-hero .scroll-cue{
  display:inline-flex; align-items:center; gap: .5rem; text-decoration:none; color: var(--ivory);
  font-size: .95rem; font-weight: 500; border: 1px solid rgba(247,243,232,.35);
  padding: .8rem 1.6rem; border-radius: 999px; transition: border-color .2s ease, background .2s ease;
}
.pedido-hero .scroll-cue:hover{ border-color: var(--gold); background: rgba(201,162,75,.12); }

/* ---------- HOW IT WORKS ---------- */
.how.pedido-how{ background: var(--ivory); padding: 4.5rem 1.5rem; font-family: var(--font-body); }
.pedido-how .steps{
  list-style:none; margin:0 auto; padding:0; max-width: 960px;
  display:grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem; text-align:left;
}
.pedido-how .steps li{ border-left: 2px solid var(--parchment-edge); padding-left: 1.25rem; }
.pedido-how .step-num{ display:block; font-family: var(--font-display); font-size: 1.6rem; font-style: italic; color: var(--wine); margin-bottom: .4rem; }
.pedido-how .steps h3{ font-size: 1.02rem; font-weight:600; margin: 0 0 .5rem; color: var(--ink-navy); }
.pedido-how .steps p{ margin:0; font-size:.94rem; line-height:1.6; color: var(--ink-text-soft); }
@media (max-width: 720px){ .pedido-how .steps{ grid-template-columns: 1fr; gap: 2rem; } }

/* ---------- FORM PAGE (contact.tpl) ---------- */
.pedido-oracao-contact{
  background: var(--ink-navy-deep);
  padding: 4rem 1rem;
  font-family: var(--font-body);
}
.pedido-oracao-contact .container{ max-width: 1000px; }

/* Sidebar contact info — wraps snipplets/contact-links.tpl, markup unknown so kept generic */
.pedido-oracao-contact .col-md-4{
  background: rgba(247,243,232,.05);
  border: 1px solid rgba(201,162,75,.35);
  border-radius: 4px;
  padding: 1.75rem;
  color: var(--ivory-dim);
  margin-bottom: 2rem;
}
.pedido-oracao-contact .col-md-4 a{ color: var(--gold-bright); }
.pedido-oracao-contact .col-md-4 .contact-side-title{
  font-family: var(--font-display);
  font-size: 1.3rem;
  font-style: italic;
  color: var(--ivory);
  margin: 0 0 .5rem;
}
.pedido-oracao-contact .col-md-4 p{ color: var(--ivory-dim); font-size: .92rem; line-height: 1.6; }

/* Form column — the "letter card" */
.pedido-oracao-contact .col-md-8{
  background: var(--parchment);
  color: var(--ink-text);
  padding: 2.75rem 2.5rem;
  border-radius: 2px;
  box-shadow: 0 30px 60px rgba(0,0,0,.35);
}

.pedido-oracao-contact .field-hint{
  font-size: .85rem;
  color: var(--ink-text-soft);
  margin: -.75rem 0 1.25rem;
}

/* Generic form field styling — targets standard inputs regardless of the
   exact wrapper markup emitted by snipplets/forms/form-input.tpl */
.pedido-oracao-contact label{
  display:block; font-size: .82rem; font-weight:600; letter-spacing:.02em;
  margin-bottom: .45rem; color: var(--ink-navy);
}
.pedido-oracao-contact input[type="text"],
.pedido-oracao-contact input[type="email"],
.pedido-oracao-contact input[type="tel"],
.pedido-oracao-contact select,
.pedido-oracao-contact textarea{
  width:100%; font-family: var(--font-body); font-size: .96rem; color: var(--ink-text);
  background: #FDFAF2; border: 1px solid var(--parchment-edge);
  padding: .75rem .9rem; border-radius: 2px; margin-bottom: 1.1rem;
  transition: border-color .2s ease, box-shadow .2s ease;
}
.pedido-oracao-contact input:focus,
.pedido-oracao-contact select:focus,
.pedido-oracao-contact textarea:focus{
  border-color: var(--gold); box-shadow: 0 0 0 3px rgba(201,162,75,.18); outline: none;
}
.pedido-oracao-contact textarea{ resize: vertical; min-height: 130px; line-height:1.55; }

/* Submit button */
.pedido-oracao-contact .seal-btn{
  display:inline-flex; align-items:center; justify-content:center; gap: .6rem;
  width: 100%;
  font-family: var(--font-body); font-size: .98rem; font-weight:600; letter-spacing:.02em;
  color: var(--ivory);
  background: linear-gradient(135deg, var(--wine) 0%, var(--wine-deep) 100%);
  border: 1px solid var(--gold);
  padding: .95rem 1.5rem; cursor:pointer; margin-top: .5rem;
  transition: transform .15s ease, box-shadow .2s ease;
}
.pedido-oracao-contact .seal-btn:hover{ box-shadow: 0 8px 20px rgba(110,42,59,.35); transform: translateY(-1px); }

/* Success / error messages */
.pedido-oracao-contact .prayer-success{
  text-align:center; padding: 1.5rem 1rem 2rem; margin-bottom: 1.5rem;
  border: 1px solid var(--parchment-edge); background: #FDFAF2;
}
.pedido-oracao-contact .prayer-success .success-candle{ width:44px; height:74px; margin:0 auto 1.25rem; }
.pedido-oracao-contact .prayer-success h3{ font-family: var(--font-display); font-size: 1.6rem; color: var(--ink-navy); margin: 0 0 .6rem; }
.pedido-oracao-contact .prayer-success p{ font-size: .95rem; color: var(--ink-text-soft); line-height:1.6; margin:0; }

.pedido-oracao-contact .alert-danger{
  background: rgba(110,42,59,.08);
  border: 1px solid var(--wine);
  color: var(--wine-deep);
  padding: 1rem 1.25rem;
  font-size: .9rem;
  margin-bottom: 1.5rem;
}

@media (prefers-reduced-motion: reduce){
  .pedido-hero *, .pedido-hero *::before, .pedido-hero *::after{
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
  }
}
