/* Vortex Yoga Hiking — booking form + thank-you. Brand values read from the live Elementor kit (2026-09-13):
   primary #920A0A (headings, El Messiri 800) · secondary #F6A136 · text #555 (Noto Sans 400) · accent #77B5FB
   buttons #FF8E00 → hover #CC7200, white text · nav bar brown · header art: painted sun over red rocks.
   The theme loads El Messiri, Aref Ruqaa and Noto Sans from Google Fonts on every page; we only reference them. */

.vyh-wrap { --vyh-red:#920A0A; --vyh-orange:#FF8E00; --vyh-orange-dark:#CC7200; --vyh-gold:#F6A136; --vyh-ink:#333333;
  --vyh-text:#555555; --vyh-line:#e8dfd3; --vyh-paper:#fffdf9; --vyh-sand:#fff4e3;
  font-family:"Noto Sans", -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color:var(--vyh-text); font-size:16px; line-height:1.55;
  max-width:760px; margin:0 auto; }
.vyh-wrap *, .vyh-wrap *::before, .vyh-wrap *::after { box-sizing:border-box; }

/* Banner: the header art with the lettering logo centred on it */
.vyh-banner { position:relative; min-height:200px; border-radius:14px 14px 0 0; overflow:hidden;
  background:#3a1d4a url("") center 35% / cover no-repeat; display:flex; align-items:center; justify-content:center; padding:26px 20px; }
.vyh-banner::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(20,8,30,.05) 0%, rgba(20,8,30,.28) 100%); }
.vyh-banner img { position:relative; z-index:1; width:min(330px, 70%); height:auto; filter:drop-shadow(0 6px 14px rgba(0,0,0,.35)); }

.vyh-card { background:var(--vyh-paper); border:1px solid var(--vyh-line); border-top:0; border-radius:0 0 14px 14px; padding:28px 28px 32px; box-shadow:0 10px 30px rgba(60,30,10,.08); }
@media (max-width:600px){ .vyh-card { padding:22px 16px 26px; } .vyh-banner { min-height:160px; } }

.vyh-card h2, .vyh-card h3 { font-family:"El Messiri", "Noto Sans", sans-serif; font-weight:800; color:var(--vyh-red); line-height:1.15; margin:0 0 8px; }
.vyh-card h2 { font-size:1.9rem; }
.vyh-card h3 { font-size:1.15rem; margin-top:26px; padding-bottom:6px; border-bottom:2px solid var(--vyh-sand); }
.vyh-lead { margin:0 0 18px; color:var(--vyh-ink); }
.vyh-muted { color:#7a7a7a; font-size:.92rem; }

.vyh-grid { display:grid; grid-template-columns:1fr 1fr; gap:14px 18px; }
@media (max-width:600px){ .vyh-grid { grid-template-columns:1fr; } }
.vyh-field { display:flex; flex-direction:column; gap:6px; }
.vyh-field.vyh-full { grid-column:1 / -1; }
.vyh-field label { font-weight:600; color:var(--vyh-ink); font-size:.95rem; }
.vyh-field label small { font-weight:400; color:#8a8a8a; }
.vyh-field input[type=text], .vyh-field input[type=email], .vyh-field input[type=tel], .vyh-field input[type=date],
.vyh-field input[type=number], .vyh-field select, .vyh-field textarea {
  font:inherit; color:var(--vyh-ink); background:#fff; border:1.5px solid #d9cfc2; border-radius:8px; padding:11px 12px; width:100%; min-height:46px; }
.vyh-field textarea { min-height:110px; resize:vertical; }
.vyh-field input:focus, .vyh-field select:focus, .vyh-field textarea:focus { outline:none; border-color:var(--vyh-orange); box-shadow:0 0 0 3px rgba(255,142,0,.18); }

.vyh-choices { display:flex; flex-direction:column; gap:8px; }
.vyh-check, .vyh-radio { display:flex; align-items:flex-start; gap:10px; font-weight:400; color:var(--vyh-text); cursor:pointer; }
.vyh-check input, .vyh-radio input { width:18px; height:18px; margin-top:3px; accent-color:var(--vyh-orange); flex:0 0 auto; }
.vyh-addons { display:grid; grid-template-columns:1fr 1fr; gap:8px 16px; }
@media (max-width:600px){ .vyh-addons { grid-template-columns:1fr; } }

.vyh-actions { margin-top:22px; display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; }
/* Selectors carry ".vyh-wrap" so they outrank Elementor's kit rules (".elementor-kit-NNNN button", 0,1,1)
   that otherwise repaint <button> elements transparent inside the theme. */
.vyh-wrap .vyh-btn, .vyh-wrap button.vyh-btn, .vyh-wrap a.vyh-btn { font-family:"Noto Sans", sans-serif; font-weight:600; font-size:1.02rem; letter-spacing:.01em; color:#fff; background:var(--vyh-orange);
  border:0; border-radius:6px; padding:13px 26px; cursor:pointer; text-decoration:none; display:inline-flex; align-items:center; gap:10px; line-height:1.2; text-transform:none;
  transition:background .15s ease, transform .05s ease; }
.vyh-wrap .vyh-btn:hover, .vyh-wrap .vyh-btn:focus, .vyh-wrap button.vyh-btn:hover, .vyh-wrap button.vyh-btn:focus { background:var(--vyh-orange-dark); color:#fff; }
.vyh-wrap .vyh-btn:active { transform:translateY(1px); }
.vyh-wrap .vyh-btn svg { width:18px; height:18px; fill:currentColor; }
.vyh-wrap .vyh-btn.vyh-ghost, .vyh-wrap a.vyh-btn.vyh-ghost { background:transparent; color:var(--vyh-red); border:2px solid var(--vyh-red); padding:11px 22px; }
.vyh-wrap .vyh-btn.vyh-ghost:hover, .vyh-wrap a.vyh-btn.vyh-ghost:hover { background:var(--vyh-red); color:#fff; }
.vyh-call { color:var(--vyh-ink); }
.vyh-call a { color:var(--vyh-red); font-weight:700; text-decoration:none; white-space:nowrap; }
.vyh-call a:hover { text-decoration:underline; }

.vyh-note { margin-top:18px; padding:12px 14px; background:var(--vyh-sand); border-left:4px solid var(--vyh-gold); border-radius:6px; font-size:.95rem; color:var(--vyh-ink); }
.vyh-error { margin:0 0 16px; padding:12px 14px; background:#fdecec; border-left:4px solid var(--vyh-red); border-radius:6px; color:#6b0f0f; font-weight:600; }

/* Honeypot: off-screen, not display:none (bots skip display:none) */
.vyh-hp { position:absolute !important; left:-9999px !important; top:-9999px !important; width:1px; height:1px; overflow:hidden; opacity:0; }

/* Thank-you */
.vyh-steps { list-style:none; margin:14px 0 0; padding:0; counter-reset:step; display:grid; gap:12px; }
.vyh-steps li { position:relative; padding-left:48px; min-height:36px; color:var(--vyh-ink); }
.vyh-steps li::before { counter-increment:step; content:counter(step); position:absolute; left:0; top:0; width:34px; height:34px; border-radius:50%;
  background:var(--vyh-orange); color:#fff; font-weight:800; display:flex; align-items:center; justify-content:center; font-family:"El Messiri", sans-serif; font-size:1.1rem; }
.vyh-summary { display:grid; grid-template-columns:max-content 1fr; gap:6px 18px; margin:16px 0 0; padding:14px 16px; background:#fff; border:1px solid var(--vyh-line); border-radius:8px; }
.vyh-summary dt { font-weight:600; color:var(--vyh-ink); }
.vyh-summary dd { margin:0; }
.vyh-ref { font-family:"El Messiri", sans-serif; font-weight:800; color:var(--vyh-red); letter-spacing:.04em; }

/* Quiz */
.vyh-quiz [hidden] { display:none !important; } /* backstop: a theme reset on fieldset/div display would otherwise show all six questions at once */
.vyh-quiz .vyh-progress { height:6px; background:var(--vyh-sand); border-radius:3px; overflow:hidden; margin:2px 0 6px; }
.vyh-quiz .vyh-progress-bar { display:block; height:100%; background:var(--vyh-orange); transition:width .25s ease; }
.vyh-quiz .vyh-progress-label { margin:0 0 6px; }
.vyh-quiz fieldset.vyh-q { border:0; padding:0; margin:0 0 10px; }
.vyh-quiz legend { padding:0; width:100%; }
.vyh-quiz legend h3 { margin-top:6px; border:0; padding:0; font-size:1.35rem; }
.vyh-quiz .vyh-choices { gap:10px; }
.vyh-wrap button.vyh-choice { display:flex; flex-direction:column; align-items:flex-start; gap:2px; width:100%; text-align:left; font:inherit; color:var(--vyh-ink); text-transform:none; line-height:1.4;
  background:#fff; border:1.5px solid #d9cfc2; border-radius:10px; padding:12px 14px; cursor:pointer; transition:border-color .15s ease, background .15s ease, transform .05s ease; }
.vyh-wrap .vyh-choice strong { font-weight:700; }
.vyh-wrap .vyh-choice span { color:var(--vyh-text); font-size:.92rem; }
.vyh-wrap button.vyh-choice:hover, .vyh-wrap button.vyh-choice:focus { border-color:var(--vyh-orange); background:var(--vyh-sand); color:var(--vyh-ink); outline:none; }
.vyh-wrap button.vyh-choice:focus-visible { box-shadow:0 0 0 3px rgba(255,142,0,.25); }
.vyh-wrap button.vyh-choice.is-picked { border-color:var(--vyh-red); background:#fff4f2; }
.vyh-wrap button.vyh-choice:active { transform:translateY(1px); }
.vyh-wrap button.vyh-linkbtn { background:none; border:0; padding:0; font:inherit; color:var(--vyh-red); text-decoration:underline; cursor:pointer; text-transform:none; }
.vyh-eyebrow { margin:0 0 4px; text-transform:uppercase; letter-spacing:.14em; font-size:.72rem; font-weight:700; color:var(--vyh-orange-dark); }
.vyh-result-price { margin:0 0 10px; font-weight:700; color:var(--vyh-ink); }
.vyh-result-points { margin:0 0 6px; padding-left:20px; color:var(--vyh-ink); }
.vyh-result-points li { margin:4px 0; }
@media (prefers-reduced-motion: reduce) { .vyh-quiz .vyh-progress-bar, .vyh-choice, .vyh-btn { transition:none; } }
