/* ==========================================================================
   Youm 3orsi — black & gold booking platform (RTL)
   ========================================================================== */
:root {
  --bg: #0c0a07; --bg2: #130f0a; --card: #19140d; --card2: #211a11;
  --line: rgba(217, 173, 92, .2); --line2: rgba(217, 173, 92, .38);
  --gold: #d9ad5c; --gold-hi: #f3d692; --gold-lo: #a8772f;
  --g-grad: linear-gradient(135deg, #f7df9f 0%, #d9ad5c 48%, #b0802f 100%);
  --text: #efe4cf; --muted: #b3a385; --dim: #7f735e;
  --ivory: #fbf6ec; --ivory2: #f3eadb; --ink: #2a2116; --ink2: #5b4c36;
  --ok: #4bbf86; --bad: #e0675e; --wait: #e2b04f;
  --r: 16px;
  --font: 'Tajawal', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --head: 'El Messiri', 'Tajawal', serif;
  --brand: 'Playfair Display', Georgia, serif;
  --script: 'Aref Ruqaa', 'El Messiri', serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body { font-family: var(--font); background: var(--bg); color: var(--text); font-size: 15.5px; line-height: 1.7; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; }
[hidden] { display: none !important; }
.container { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 18px; }
.container.narrow { max-width: 900px; }
.center { text-align: center; }
.muted { color: var(--muted); }
.ic { flex-shrink: 0; }
.full { grid-column: 1 / -1; }

/* ---------- buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 9px; height: 46px; padding: 0 24px; border-radius: 12px; font-weight: 700; font-size: 15px; border: 1px solid transparent; transition: .25s; white-space: nowrap; }
.btn-gold { background: var(--g-grad); color: #2b1e0b; box-shadow: 0 8px 22px rgba(217, 173, 92, .22), inset 0 1px 0 rgba(255, 255, 255, .45); }
.btn-gold:hover { filter: brightness(1.07); transform: translateY(-1px); box-shadow: 0 12px 28px rgba(217, 173, 92, .32), inset 0 1px 0 rgba(255,255,255,.45); }
.btn-ghost { border-color: var(--line2); color: var(--gold-hi); background: rgba(217, 173, 92, .04); }
.btn-ghost:hover { background: rgba(217, 173, 92, .12); border-color: var(--gold); }
.btn-wa { background: #1faa59; color: #fff; }
.btn-wa:hover { background: #1c9a51; }
.btn-lg { height: 54px; padding: 0 32px; font-size: 16.5px; border-radius: 14px; }
.btn-sm { height: 40px; padding: 0 16px; font-size: 14px; border-radius: 10px; }
.btn-block { width: 100%; }
.btn:disabled { opacity: .55; cursor: wait; transform: none; }
.btn.loading { position: relative; color: transparent !important; }
.btn.loading::after { content: ''; position: absolute; width: 22px; height: 22px; border: 3px solid rgba(43,30,11,.35); border-top-color: #2b1e0b; border-radius: 50%; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.icon-btn { width: 44px; height: 44px; display: inline-flex; align-items: center; justify-content: center; border-radius: 12px; color: var(--gold-hi); }

/* ---------- header ---------- */
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(12, 10, 7, .82); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom: 1px solid var(--line); transition: .3s; }
.page-home .site-header { position: fixed; inset-inline: 0; background: linear-gradient(180deg, rgba(8,6,4,.85), rgba(8,6,4,.35)); border-bottom-color: rgba(217,173,92,.15); }
.page-home .site-header.scrolled { background: rgba(12, 10, 7, .92); }
.hdr { display: flex; align-items: center; gap: 26px; min-height: 76px; }
.menu-btn { display: none; }
.logo { display: inline-flex; align-items: center; gap: 12px; flex-shrink: 0; }
.logo img { height: 52px; width: auto; }
.logo-text { font-family: var(--brand); font-size: 31px; font-weight: 700; line-height: 1; background: var(--g-grad); -webkit-background-clip: text; background-clip: text; color: transparent; direction: ltr; letter-spacing: .3px; }
.logo-sm .logo-text { font-size: 22px; }
.logo-sm .logo-mark { width: 38px; height: 30px; }
.main-nav { display: flex; align-items: center; gap: 34px; margin-inline-start: auto; margin-inline-end: auto; }
.main-nav > a { position: relative; font-weight: 500; font-size: 15.5px; color: #e9dcc2; padding: 6px 0; transition: color .2s; }
.main-nav > a:hover, .main-nav > a.on { color: var(--gold-hi); }
.main-nav > a.on::after { content: ''; position: absolute; inset-inline: 10%; bottom: -4px; height: 2px; border-radius: 2px; background: var(--g-grad); }
.main-nav > a.on::before { content: ''; position: absolute; left: 50%; bottom: -7px; width: 6px; height: 6px; margin-left: -3px; border-radius: 50%; background: var(--gold-hi); }
.hdr-acc { display: flex; align-items: center; gap: 16px; }
.nav-overlay { position: fixed; inset: 0; background: rgba(0,0,0,.6); z-index: 90; opacity: 0; visibility: hidden; transition: .25s; }
.nav-overlay.show { opacity: 1; visibility: visible; }

/* ---------- hero ---------- */
.hero { position: relative; min-height: 680px; display: flex; align-items: flex-end; overflow: hidden; isolation: isolate; }
.hero-bg { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.1); z-index: -3; filter: saturate(1.1); }
.hero-photo { position: absolute; inset-block: 0; inset-inline-start: 8%; width: 58%; background-size: cover; background-position: center top; z-index: -2; -webkit-mask-image: linear-gradient(to left, transparent 0, #000 22%, #000 78%, transparent 100%); mask-image: linear-gradient(to left, transparent 0, #000 22%, #000 78%, transparent 100%); }
.hero-shade { position: absolute; inset: 0; z-index: -1; background:
  radial-gradient(ellipse at 22% 45%, rgba(10,7,4,.78) 0, rgba(10,7,4,.35) 45%, transparent 70%),
  linear-gradient(180deg, rgba(10,7,4,.45) 0, transparent 30%, transparent 62%, var(--bg) 100%); }
.hero-in { display: grid; grid-template-columns: 1fr 1fr; align-items: end; gap: 40px; padding-top: 120px; padding-bottom: 54px; }
.hero-book { align-self: end; }
.hb-card { max-width: 380px; padding: 26px 28px; border-radius: 22px; background: rgba(14, 10, 6, .62); border: 1px solid var(--line2); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); box-shadow: 0 24px 60px rgba(0,0,0,.45); }
.hb-card h2 { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-family: var(--head); font-size: 25px; color: #fff; margin-bottom: 6px; }
.hb-card h2 .ic { color: var(--gold); }
.hb-card p { color: #dccfb4; margin-bottom: 18px; font-size: 14.5px; }
.hero-brand { text-align: center; display: flex; flex-direction: column; align-items: center; gap: 4px; padding-bottom: 6px; }
.emblem svg { width: 150px; height: 122px; filter: drop-shadow(0 6px 18px rgba(217,173,92,.35)); }
.brand-title { font-family: var(--brand); font-size: 82px; line-height: 1; font-weight: 700; background: var(--g-grad); -webkit-background-clip: text; background-clip: text; color: transparent; direction: ltr; filter: drop-shadow(0 4px 14px rgba(0,0,0,.5)); }
.brand-rule { display: flex; align-items: center; gap: 10px; color: var(--gold); margin: 6px 0 10px; }
.brand-rule i { display: block; width: 130px; height: 1.5px; background: linear-gradient(90deg, transparent, var(--gold)); }
.brand-rule i:last-child { background: linear-gradient(-90deg, transparent, var(--gold)); }
.brand-rule .ic { fill: var(--gold); }
.hero-title { font-family: var(--head); font-size: 29px; font-weight: 700; color: #fff; text-shadow: 0 3px 14px rgba(0,0,0,.6); }
.hero-sub { font-size: 19px; color: #e6d8bc; margin-bottom: 22px; }
.hero-feats { list-style: none; display: flex; justify-content: center; }
.hero-feats li { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 0 22px; font-size: 13.5px; font-weight: 700; color: #f2e6cd; }
.hero-feats li + li { border-inline-start: 1px solid rgba(217,173,92,.35); }
.hero-feats .ic { color: var(--gold); stroke-width: 1.4; }

/* ---------- section titles ---------- */
.sec-title { text-align: center; margin-bottom: 28px; }
.sec-title span { display: inline-block; color: var(--gold); font-weight: 700; font-size: 14px; letter-spacing: .5px; margin-bottom: 4px; }
.sec-title span::before, .sec-title span::after { content: '◆'; font-size: 8px; margin: 0 10px; vertical-align: middle; opacity: .8; }
.sec-title h2 { font-family: var(--head); font-size: 32px; color: #fff; font-weight: 700; }

/* ---------- event cards ---------- */
.events { padding: 40px 0 34px; background: linear-gradient(180deg, var(--bg) 0, #120e09 100%); }
.ev-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 16px; }
.ev-card { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; border-radius: 18px; overflow: hidden; background: var(--card); border: 1px solid var(--line); padding: 0 12px 18px; transition: .3s; }
.ev-card:hover { transform: translateY(-5px); border-color: var(--gold); box-shadow: 0 18px 40px rgba(0,0,0,.45), 0 0 0 1px rgba(217,173,92,.25); }
.ev-img { display: block; width: calc(100% + 24px); aspect-ratio: 1.45; background: radial-gradient(circle at 50% 40%, #3a2a14, #18120b 70%); background-size: cover; background-position: center; position: relative; transition: transform .6s; }
.ev-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 30%, rgba(25,20,13,.75) 78%, var(--card) 100%); }
.ev-card:hover .ev-img { transform: scale(1.05); }
.ev-ic { position: relative; z-index: 1; margin-top: -30px; width: 58px; height: 58px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgba(20,15,9,.88); border: 1.5px solid var(--gold); color: var(--gold-hi); box-shadow: 0 6px 18px rgba(0,0,0,.5); }
.ev-card strong { font-family: var(--head); font-size: 19px; color: #fff; margin-top: 10px; line-height: 1.4; }
.ev-card small { color: var(--muted); font-size: 12.5px; line-height: 1.5; min-height: 38px; }

/* ---------- steps band (ivory) ---------- */
.steps-band { padding: 26px 0 54px; background: #120e09; }
.steps-box { display: grid; grid-template-columns: 1.15fr 3fr 1.15fr; align-items: center; gap: 20px; padding: 30px 34px; border-radius: 26px; background: linear-gradient(135deg, #fdf8ef, #f4ead9); color: var(--ink); box-shadow: 0 20px 50px rgba(0,0,0,.35); }
.steps-head h2 { font-family: var(--head); font-size: 30px; color: var(--ink); }
.steps-head p { color: var(--ink2); font-size: 16.5px; }
.steps { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); }
.steps li { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 0 12px; gap: 3px; }
.steps li + li { border-inline-start: 1px solid #e3d5bd; }
.st-ic { position: relative; width: 62px; height: 62px; border-radius: 18px; display: flex; align-items: center; justify-content: center; color: #8c6526; background: #fff; box-shadow: 0 6px 16px rgba(140, 101, 38, .12); margin-bottom: 8px; }
.st-ic b { position: absolute; top: -8px; inset-inline-start: -8px; width: 26px; height: 26px; border-radius: 50%; background: var(--g-grad); color: #2b1e0b; font-size: 13.5px; display: flex; align-items: center; justify-content: center; }
.steps strong { font-size: 16.5px; color: var(--ink); font-weight: 800; }
.steps small { color: #7a6a52; font-size: 13px; }
.script-note { font-family: var(--script); font-size: 27px; line-height: 1.5; color: #4a3a22; text-align: center; transform: rotate(-4deg); }
.script-note .ic { color: #b0802f; vertical-align: middle; }

/* ---------- gallery ---------- */
.gallery-sec { padding: 10px 0 56px; background: #120e09; }
.gal-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 24px; }
.gal-item { position: relative; border-radius: 16px; overflow: hidden; aspect-ratio: 1; border: 1px solid var(--line); }
.gal-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.gal-item:hover img { transform: scale(1.06); }
.gal-item span { position: absolute; inset-inline: 0; bottom: 0; padding: 26px 12px 10px; background: linear-gradient(transparent, rgba(0,0,0,.75)); font-weight: 700; font-size: 14px; }

/* ---------- trust band + footer ---------- */
.trust-band { background: #080604; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.tb-row { display: flex; align-items: center; justify-content: space-between; gap: 30px; min-height: 96px; flex-wrap: wrap; padding-top: 14px; padding-bottom: 14px; }
.tb-items { display: flex; gap: 0; flex-wrap: wrap; }
.tb-item { display: flex; align-items: center; gap: 12px; padding: 0 26px; }
.tb-item + .tb-item { border-inline-start: 1px solid var(--line); }
.tb-item .ic { color: var(--gold); stroke-width: 1.5; }
.tb-item span { display: flex; flex-direction: column; line-height: 1.4; }
.tb-item b { color: var(--gold-hi); font-size: 15px; }
.tb-item small { color: var(--muted); font-size: 12.5px; }
.tb-cta { display: flex; align-items: center; gap: 18px; order: 2; }
.socials { display: flex; gap: 10px; }
.socials a { width: 40px; height: 40px; border-radius: 50%; display: flex; align-items: center; justify-content: center; border: 1px solid var(--line2); color: var(--gold-hi); transition: .2s; }
.socials a:hover { background: var(--gold); color: #1d140a; }
.site-footer { background: #060504; }
.ft-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 70px; flex-wrap: wrap; padding-top: 10px; padding-bottom: 10px; }
.ft-copy { color: var(--dim); font-size: 13px; }
.ft-tag { display: inline-flex; align-items: center; gap: 12px; color: var(--muted); font-size: 13.5px; }
.ft-tag i { display: block; width: 60px; height: 1px; background: var(--gold-lo); }
.wa-float { position: fixed; bottom: 22px; inset-inline-start: 22px; z-index: 60; width: 56px; height: 56px; border-radius: 50%; background: #1faa59; color: #fff; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px rgba(0,0,0,.4); transition: .2s; }
.wa-float:hover { transform: scale(1.06); }

/* ---------- inner pages ---------- */
.page-head, .book-hero { position: relative; padding: 46px 0 34px; text-align: center; background: radial-gradient(ellipse at 50% 0, rgba(217,173,92,.16), transparent 65%), url('../img/seed/hero-blur.webp') center/cover; border-bottom: 1px solid var(--line); isolation: isolate; }
.page-head::before, .book-hero::before { content: ''; position: absolute; inset: 0; background: rgba(12,10,7,.78); z-index: -1; }
.page-head h1, .book-hero h1 { font-family: var(--head); font-size: 36px; color: #fff; }
.page-head h1 .ic { color: var(--gold); vertical-align: middle; }
.page-head p, .book-hero p { color: #d7c9ad; max-width: 640px; margin: 4px auto 0; }
.page-box { padding-top: 34px; padding-bottom: 60px; }
.card { background: var(--card); border: 1px solid var(--line); border-radius: var(--r); padding: 28px; }
.empty-card { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 50px 20px; }
.empty-card > .ic { color: var(--gold); }
.empty-card h3 { font-family: var(--head); font-size: 22px; color: #fff; }
.alert { display: flex; gap: 12px; align-items: flex-start; padding: 14px 18px; border-radius: 14px; margin-bottom: 18px; font-size: 14.5px; }
.alert ul { padding-inline-start: 18px; margin-top: 4px; }
.alert-error { background: rgba(224, 103, 94, .12); border: 1px solid rgba(224, 103, 94, .4); color: #ffc9c3; }
.alert-error .ic { color: var(--bad); }
.chips { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 26px; }
.chip { padding: 7px 18px; border-radius: 30px; border: 1px solid var(--line2); color: var(--text); font-size: 14px; font-weight: 600; }
.chip.on, .chip:hover { background: var(--g-grad); color: #2b1e0b; border-color: transparent; }
.gal-grid.big { grid-template-columns: repeat(3, 1fr); }

/* forms */
.fld { display: flex; flex-direction: column; gap: 7px; }
.fld > span { font-size: 14px; font-weight: 700; color: #e6d8bc; display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.fld > span em { font-style: normal; font-weight: 400; color: var(--dim); font-size: 12.5px; }
.fld > span .ic { color: var(--gold); }
input[type=text], input[type=tel], input[type=email], input[type=password], input[type=number], input[type=date], select, textarea {
  width: 100%; min-height: 52px; padding: 12px 16px; border-radius: 13px; border: 1px solid #3a2f1f; background: #120e09; color: var(--text); outline: none; transition: .2s; font-size: 15.5px; }
textarea { min-height: 96px; resize: vertical; line-height: 1.7; }
select { appearance: none; -webkit-appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23d9ad5c' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: left 16px center; padding-left: 40px; cursor: pointer; }
select:disabled { opacity: .5; cursor: not-allowed; }
select option { background: #1a150e; color: var(--text); }
input:focus, select:focus, textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 4px rgba(217, 173, 92, .14); background: #16110b; }
input::placeholder, textarea::placeholder { color: #6e6352; }
.form-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; }

/* auth */
.auth-ic { width: 66px; height: 66px; margin: 0 auto 10px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgba(217,173,92,.1); border: 1px solid var(--line2); color: var(--gold-hi); }

/* account */
.bk-list { display: flex; flex-direction: column; gap: 12px; }
.bk-item { display: grid; grid-template-columns: 84px 1fr auto; align-items: center; gap: 18px; padding: 16px 18px; border-radius: 18px; background: var(--card); border: 1px solid var(--line); transition: .2s; }
.bk-item:hover { border-color: var(--gold); transform: translateY(-2px); }
.bk-date { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 80px; border-radius: 14px; background: var(--g-grad); color: #2b1e0b; line-height: 1.15; }
.bk-date b { font-family: var(--brand); font-size: 32px; }
.bk-date small { font-size: 12px; font-weight: 700; }
.bk-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.bk-info strong { font-size: 17px; color: #fff; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.bk-info small { color: var(--muted); font-size: 13.5px; display: inline-flex; align-items: center; gap: 5px; }
.code { font-family: monospace; font-size: 12.5px; color: var(--gold); background: rgba(217,173,92,.1); padding: 1px 8px; border-radius: 6px; }
.bk-side { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; }
.bk-open { display: inline-flex; align-items: center; gap: 5px; color: var(--gold-hi); font-weight: 700; font-size: 13.5px; }
.status { display: inline-flex; align-items: center; padding: 3px 12px; border-radius: 30px; font-size: 12.5px; font-weight: 700; white-space: nowrap; }
.st-pending { background: rgba(226, 176, 79, .15); color: #f0c56c; border: 1px solid rgba(226,176,79,.4); }
.st-confirmed { background: rgba(75, 191, 134, .14); color: #6fd6a1; border: 1px solid rgba(75,191,134,.4); }
.st-done { background: rgba(120, 150, 220, .14); color: #a9c0f3; border: 1px solid rgba(120,150,220,.4); }
.st-cancelled { background: rgba(224, 103, 94, .13); color: #f19a92; border: 1px solid rgba(224,103,94,.4); }

/* prices */
.price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.price-card { display: flex; flex-direction: column; gap: 14px; padding: 24px; border-radius: 22px; background: linear-gradient(180deg, var(--card2), var(--card)); border: 1px solid var(--line); }
.price-card header { display: flex; align-items: center; gap: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.price-card h2 { font-family: var(--head); font-size: 22px; color: #fff; line-height: 1.3; }
.price-card header small { color: var(--muted); font-size: 13px; }
.price-card ul { list-style: none; display: flex; flex-direction: column; gap: 4px; flex: 1; }
.price-card li { display: flex; justify-content: space-between; gap: 10px; padding: 8px 0; border-bottom: 1px dashed rgba(217,173,92,.14); font-size: 14.5px; }
.price-card li span { display: inline-flex; align-items: center; gap: 8px; }
.price-card li .ic { color: var(--gold); }
.price-card li b { color: var(--gold-hi); white-space: nowrap; }
.ch-ic { width: 50px; height: 50px; flex-shrink: 0; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; background: rgba(217,173,92,.1); border: 1px solid var(--line2); color: var(--gold-hi); }

/* contact */
.contact-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 30px; }
.ct-card { display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; padding: 26px 18px; border-radius: 20px; background: var(--card); border: 1px solid var(--line); transition: .2s; }
a.ct-card:hover { border-color: var(--gold); transform: translateY(-3px); }
.ct-ic { width: 62px; height: 62px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgba(217,173,92,.1); color: var(--gold-hi); margin-bottom: 4px; }
.ct-ic.wa { background: rgba(31,170,89,.15); color: #3fd27f; }
.ct-card b { font-size: 17px; color: #fff; }
.ct-card small { color: var(--muted); font-size: 14.5px; }
.cta-box { text-align: center; padding: 40px 20px; border-radius: 24px; border: 1px solid var(--line2); background: radial-gradient(ellipse at 50% 0, rgba(217,173,92,.16), transparent 70%), var(--card); }
.cta-box h2 { font-family: var(--head); font-size: 28px; color: #fff; }
.cta-box p { color: var(--muted); margin-bottom: 18px; }

/* ==========================================================================
   Booking wizard
   ========================================================================== */
.book-hero { padding: 38px 0 30px; }
.book-hero h1 { font-size: 32px; }
.book-wrap { padding-top: 26px; padding-bottom: 60px; }
.stepper { list-style: none; display: grid; grid-template-columns: repeat(6, 1fr); gap: 8px; margin-bottom: 24px; counter-reset: s; }
.stepper li { position: relative; display: flex; flex-direction: column; align-items: center; gap: 7px; cursor: pointer; text-align: center; }
.stepper li::before { content: ''; position: absolute; top: 23px; inset-inline-start: 50%; width: calc(100% + 8px); height: 2px; background: #2c2417; z-index: 0; }
.stepper li:last-child::before { display: none; }
.stepper li.done::before { background: var(--gold); }
.stepper span { position: relative; z-index: 1; width: 48px; height: 48px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #17120c; border: 1.5px solid #3a2f1f; color: var(--dim); transition: .3s; }
.stepper b { font-size: 13.5px; font-weight: 700; color: var(--dim); transition: .3s; }
.stepper li.on span { background: var(--g-grad); color: #2b1e0b; border-color: transparent; box-shadow: 0 0 0 6px rgba(217,173,92,.15); transform: scale(1.08); }
.stepper li.on b { color: var(--gold-hi); }
.stepper li.done span { border-color: var(--gold); color: var(--gold); background: #1e170e; }
.stepper li.done b { color: #d9c9a8; }
.book-grid { display: grid; grid-template-columns: 1fr 340px; gap: 24px; align-items: start; }
.wizard { padding: 30px; border-radius: 24px; background: linear-gradient(180deg, #1b150e, #15100a); border: 1px solid var(--line); box-shadow: 0 24px 60px rgba(0,0,0,.35); min-width: 0; }
.step { border: 0; min-width: 0; animation: stepIn .45s ease both; }
@keyframes stepIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
.step.shake { animation: shake .4s; }
@keyframes shake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
.step legend { display: flex; align-items: center; gap: 12px; font-family: var(--head); font-size: 25px; font-weight: 700; color: #fff; margin-bottom: 6px; }
.lg-n { width: 36px; height: 36px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center; background: var(--g-grad); color: #2b1e0b; font-family: var(--brand); font-size: 18px; }
.step-hint { color: var(--muted); margin-bottom: 20px; font-size: 14.5px; }
.step legend + .choice-grid, .step legend + .form-2, .step legend + .deposit-box { margin-top: 18px; }
.date-row { display: grid; grid-template-columns: 1fr 1.5fr 1fr; gap: 14px; }
.date-row select { min-height: 62px; font-size: 18px; font-weight: 700; text-align: center; text-align-last: center; }
.date-status { display: flex; flex-direction: column; align-items: center; gap: 2px; margin-top: 18px; padding: 16px; border-radius: 16px; text-align: center; font-weight: 700; }
.date-status b { font-family: var(--head); font-size: 22px; }
.date-status span { font-size: 14px; }
.date-status.ok { background: rgba(75,191,134,.1); border: 1px solid rgba(75,191,134,.45); color: #7fe0ae; }
.date-status.ok b { color: #fff; }
.date-status.bad { background: rgba(224,103,94,.1); border: 1px solid rgba(224,103,94,.45); color: #f6a39b; }
.date-status.wait { background: rgba(226,176,79,.08); border: 1px dashed rgba(226,176,79,.45); color: #f0c56c; }

.choice-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; margin-bottom: 20px; }
.choice { position: relative; cursor: pointer; }
.choice input { position: absolute; opacity: 0; pointer-events: none; }
.ch-box { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 124px; padding: 16px 10px; border-radius: 18px; text-align: center; background: #120e09; border: 1.5px solid #33291b; transition: .25s; overflow: hidden; }
.ch-box b { font-size: 15px; color: #efe2c8; line-height: 1.4; }
.choice:hover .ch-box { border-color: var(--line2); transform: translateY(-2px); }
.choice input:checked + .ch-box { border-color: var(--gold); background: linear-gradient(180deg, rgba(217,173,92,.16), rgba(217,173,92,.04)); box-shadow: 0 10px 28px rgba(217,173,92,.14); }
.choice input:checked + .ch-box .ch-ic { background: var(--g-grad); color: #2b1e0b; border-color: transparent; }
.choice input:focus-visible + .ch-box { outline: 2px solid var(--gold); outline-offset: 2px; }
.ch-tick { position: absolute; top: 10px; inset-inline-end: 10px; width: 24px; height: 24px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--gold); color: #2b1e0b; opacity: 0; transform: scale(.5); transition: .25s; font-style: normal; }
.choice input:checked + .ch-box .ch-tick { opacity: 1; transform: none; }
.ev-choice .ch-box { min-height: 140px; justify-content: flex-end; padding-bottom: 14px; }
.ev-choice .ch-box::before { content: ''; position: absolute; inset: 0; background-image: linear-gradient(180deg, rgba(18,14,9,.15) 0, rgba(18,14,9,.92) 72%), var(--img, none); background-size: cover; background-position: center; opacity: .9; transition: .4s; z-index: 0; }
.ev-choice .ch-box > :not(.ch-tick) { position: relative; z-index: 1; }
.ev-choice .ch-tick { z-index: 2; }
.ev-choice .ch-box .ch-ic { width: 46px; height: 46px; background: rgba(15,11,7,.8); }
.ev-choice .ch-box b { font-family: var(--head); font-size: 16.5px; color: #fff; }
.events-pick { grid-template-columns: repeat(3, 1fr); }
.svc-title { font-family: var(--head); font-size: 20px; color: #fff; margin-bottom: 14px; display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.svc-title span { color: var(--gold-hi); }
.svc-title small { font-family: var(--font); font-size: 13px; color: var(--muted); font-weight: 400; }
.svc-list { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.svc { position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; padding: 13px 14px; padding-inline-end: 44px; border-radius: 16px; background: #120e09; border: 1.5px solid #33291b; cursor: pointer; transition: .2s; }
.svc:hover { border-color: var(--line2); }
.svc input { position: absolute; opacity: 0; pointer-events: none; }
.svc-ic { width: 44px; height: 44px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: rgba(217,173,92,.08); color: var(--gold); transition: .2s; }
.svc-txt { display: flex; flex-direction: column; min-width: 0; line-height: 1.45; }
.svc-txt b { font-size: 14.5px; color: #f0e4cb; }
.svc-txt small { font-size: 12px; color: var(--dim); }
.svc-price { font-weight: 800; color: var(--gold-hi); font-size: 14.5px; white-space: nowrap; }
.svc-check { position: absolute; top: 50%; inset-inline-end: 12px; margin-top: -12px; width: 24px; height: 24px; border-radius: 7px; border: 1.5px solid #4a3c27; display: flex; align-items: center; justify-content: center; color: transparent; transition: .2s; font-style: normal; }
.svc.on { border-color: var(--gold); background: linear-gradient(90deg, rgba(217,173,92,.13), rgba(217,173,92,.03)); }
.svc.on .svc-ic { background: var(--g-grad); color: #2b1e0b; }
.svc.on .svc-check { background: var(--gold); border-color: var(--gold); color: #2b1e0b; }
.svc-total { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; padding: 14px 18px; border-radius: 14px; background: rgba(217,173,92,.08); border: 1px dashed var(--line2); font-weight: 700; }
.svc-total b { font-size: 20px; color: var(--gold-hi); }
.empty { color: var(--muted); }

.deposit-box { display: grid; grid-template-columns: 1fr 1.3fr 1fr; gap: 12px; margin-bottom: 24px; }
.deposit-box > div { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 2px; padding: 16px 10px; border-radius: 16px; background: #120e09; border: 1px solid #33291b; }
.deposit-box span { color: var(--muted); font-size: 13.5px; font-weight: 600; }
.deposit-box b { font-size: 19px; color: #fff; }
.deposit-box .dep-main { background: var(--g-grad); border: 0; box-shadow: 0 12px 30px rgba(217,173,92,.22); }
.deposit-box .dep-main span, .deposit-box .dep-main small { color: #4a3612; }
.deposit-box .dep-main b { font-size: 28px; color: #22170a; font-weight: 800; }
.deposit-box small { font-size: 12px; font-weight: 700; }
.pay-list { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }
.pay-opt { position: relative; display: block; border-radius: 16px; background: #120e09; border: 1.5px solid #33291b; cursor: pointer; transition: .2s; overflow: hidden; }
.pay-opt input { position: absolute; opacity: 0; pointer-events: none; }
.po-head { position: relative; display: flex; align-items: center; gap: 14px; padding: 14px 16px; }
.po-head b { font-size: 16px; color: #f0e4cb; }
.po-head .ch-tick { top: 50%; margin-top: -12px; inset-inline-end: 16px; }
.po-body { display: none; padding: 0 18px 16px; margin-inline-start: 64px; }
.po-details { display: block; padding: 14px 16px; border-radius: 12px; background: rgba(217,173,92,.07); border: 1px dashed var(--line2); color: #f3e7cf; font-size: 15px; line-height: 1.9; direction: rtl; unicode-bidi: plaintext; white-space: normal; word-break: break-word; }
.copy-btn { display: inline-flex; align-items: center; gap: 6px; margin-top: 10px; padding: 6px 14px; border-radius: 9px; border: 1px solid var(--line2); color: var(--gold-hi); font-size: 13px; font-weight: 700; }
.copy-btn:hover { background: rgba(217,173,92,.12); }
.pay-opt:has(input:checked) { border-color: var(--gold); background: linear-gradient(180deg, rgba(217,173,92,.1), rgba(217,173,92,.02)); }
.pay-opt:has(input:checked) .po-body { display: block; animation: stepIn .35s both; }
.pay-opt:has(input:checked) .ch-tick { opacity: 1; transform: none; }
.pay-opt:has(input:checked) .ch-ic { background: var(--g-grad); color: #2b1e0b; border-color: transparent; }
.proof-wrap { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; align-items: stretch; margin-bottom: 18px; }
.upload { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 16px; border-radius: 16px; border: 2px dashed var(--line2); background: rgba(217,173,92,.04); cursor: pointer; text-align: center; transition: .2s; min-height: 120px; }
.upload input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.upload:hover { border-color: var(--gold); background: rgba(217,173,92,.08); }
.upload.has { border-style: solid; border-color: var(--ok); background: rgba(75,191,134,.08); }
.up-ic { color: var(--gold); }
.upload.has .up-ic { color: var(--ok); }
.upload b { font-size: 14.5px; color: #f0e4cb; word-break: break-all; }
.upload small { color: var(--dim); font-size: 12px; }
.agree { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border-radius: 14px; background: #120e09; border: 1px solid #33291b; cursor: pointer; font-size: 14.5px; }
.agree input { width: 22px; height: 22px; accent-color: var(--gold); flex-shrink: 0; margin-top: 2px; }
.small-note { display: flex; gap: 8px; margin-top: 12px; color: var(--dim); font-size: 13px; }
.small-note .ic { color: var(--gold-lo); margin-top: 3px; }
.wz-nav { display: flex; align-items: center; gap: 12px; margin-top: 28px; padding-top: 20px; border-top: 1px solid var(--line); }
.wz-count { color: var(--dim); font-size: 13.5px; margin-inline-end: auto; }
.wz-nav #prevBtn + .wz-count { margin-inline-start: 0; }
.wz-nav .btn-gold { min-width: 160px; }

.summary { position: sticky; top: 96px; padding: 24px; border-radius: 24px; background: linear-gradient(180deg, #1d160e, #140f09); border: 1px solid var(--line2); box-shadow: 0 24px 60px rgba(0,0,0,.35); }
.summary h3 { display: flex; align-items: center; gap: 10px; font-family: var(--head); font-size: 21px; color: #fff; padding-bottom: 14px; margin-bottom: 12px; border-bottom: 1px solid var(--line); }
.summary h3 .ic { color: var(--gold); }
.summary dl > div { display: flex; flex-direction: column; padding: 8px 0; border-bottom: 1px dashed rgba(217,173,92,.12); }
.summary dt { display: flex; align-items: center; gap: 7px; color: var(--dim); font-size: 12.5px; font-weight: 700; }
.summary dt .ic { color: var(--gold-lo); }
.summary dd { color: #f0e4cb; font-size: 14.5px; font-weight: 600; }
.s-svcs { list-style: none; margin: 10px 0 6px; display: flex; flex-direction: column; gap: 6px; }
.s-svcs li { display: flex; justify-content: space-between; gap: 10px; font-size: 13.5px; color: #e2d4b7; }
.s-svcs li b { color: var(--gold-hi); white-space: nowrap; }
.s-total, .s-dep { display: flex; justify-content: space-between; align-items: center; padding-top: 12px; margin-top: 8px; border-top: 1px solid var(--line); font-weight: 700; }
.s-total b { font-size: 22px; color: #fff; }
.s-dep { border-top: 0; margin-top: 0; padding: 10px 14px; border-radius: 12px; background: rgba(217,173,92,.1); color: var(--gold-hi); }
.s-dep b { font-size: 18px; }
.toast { position: fixed; bottom: 26px; left: 50%; transform: translate(-50%, 30px); z-index: 400; max-width: calc(100% - 32px); padding: 13px 22px; border-radius: 14px; background: #2a1d10; border: 1px solid var(--gold); color: #fff; font-weight: 700; box-shadow: 0 16px 40px rgba(0,0,0,.5); opacity: 0; visibility: hidden; transition: .3s; text-align: center; }
.toast.show { opacity: 1; visibility: visible; transform: translate(-50%, 0); }

/* ==========================================================================
   Receipt (ivory paper — looks good downloaded and printed)
   ========================================================================== */
.receipt-page { padding: 34px 0 60px; background: radial-gradient(ellipse at 50% 0, rgba(217,173,92,.12), transparent 60%); }
.done-banner { display: flex; align-items: center; gap: 18px; padding: 20px 24px; border-radius: 20px; margin-bottom: 20px; background: linear-gradient(90deg, rgba(75,191,134,.16), rgba(75,191,134,.04)); border: 1px solid rgba(75,191,134,.45); }
.db-ic { width: 60px; height: 60px; flex-shrink: 0; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: var(--ok); color: #fff; box-shadow: 0 0 0 8px rgba(75,191,134,.15); }
.db-ic .ic { stroke-width: 3; }
.done-banner h1 { font-family: var(--head); font-size: 25px; color: #fff; }
.done-banner p { color: #cfe9db; font-size: 14.5px; }
.rc-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 20px; }
.receipt { position: relative; background: #fffdf8; color: var(--ink); border-radius: 22px; padding: 34px 36px 28px; box-shadow: 0 30px 80px rgba(0,0,0,.5); overflow: hidden; }
.receipt::before { content: ''; position: absolute; inset: 10px; border: 1.5px solid #e6d3ad; border-radius: 16px; pointer-events: none; }
.receipt::after { content: ''; position: absolute; top: 0; inset-inline: 0; height: 6px; background: var(--g-grad); }
.rc-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 18px; border-bottom: 1.5px dashed #e2cfa8; flex-wrap: wrap; }
.rc-brand { display: flex; align-items: center; gap: 12px; }
.rc-brand > div { display: flex; flex-direction: column; line-height: 1.2; }
.rc-brand b { font-family: var(--brand); font-size: 28px; color: #9a6c25; direction: ltr; text-align: right; }
.rc-brand small { color: #8a7a60; font-size: 12.5px; }
.rc-title { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; text-align: end; }
.rc-title > span:first-child { font-family: var(--head); font-size: 22px; font-weight: 700; color: var(--ink); }
.rc-title > b { font-family: monospace; font-size: 18px; letter-spacing: 1px; color: #7a561d; background: #f7ecd6; padding: 2px 12px; border-radius: 8px; }
.receipt .st-pending { background: #fff3d8; color: #9a6a0b; border-color: #efd28f; }
.receipt .st-confirmed { background: #e2f6ea; color: #1d7a4a; border-color: #a7dfbe; }
.receipt .st-done { background: #e7edfb; color: #3858a6; border-color: #bfcdf1; }
.receipt .st-cancelled { background: #fde8e6; color: #b13a30; border-color: #f2b9b3; }
.rc-meta { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding: 10px 0 4px; color: #8a7a60; font-size: 13px; }
.rc-meta span { display: inline-flex; align-items: center; gap: 6px; }
.rc-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 26px; }
.rc-sec { padding-top: 18px; }
.rc-sec h3 { display: flex; align-items: center; gap: 8px; font-family: var(--head); font-size: 17px; color: #7a561d; margin-bottom: 8px; }
.rc-sec dl > div { display: flex; justify-content: space-between; gap: 14px; padding: 7px 0; border-bottom: 1px solid #f0e6d3; font-size: 14.5px; }
.rc-sec dt { color: #8a7a60; flex-shrink: 0; }
.rc-sec dd { font-weight: 700; color: var(--ink); text-align: end; }
.rc-date { color: #7a561d !important; }
.rc-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.rc-table th { text-align: start; background: #f7efe0; color: #7a6a52; font-weight: 700; font-size: 13px; padding: 9px 12px; }
.rc-table th:first-child { border-radius: 0 10px 10px 0; width: 40px; }
.rc-table th:last-child { border-radius: 10px 0 0 10px; text-align: end; }
.rc-table td { padding: 10px 12px; border-bottom: 1px solid #f0e6d3; }
.rc-table td:last-child { text-align: end; font-weight: 700; white-space: nowrap; }
.rc-table td:first-child { color: #a8977a; }
.rc-table tfoot td { border: 0; padding: 8px 12px; font-weight: 700; }
.rc-table tfoot tr:first-child td { border-top: 1.5px solid #e2cfa8; padding-top: 12px; font-size: 16px; }
.rc-table tfoot tr.paid td { color: #1d7a4a; }
.rc-table tfoot tr.rest td { background: #f7ecd6; color: #6b4a17; font-size: 16px; }
.rc-table tfoot tr.rest td:first-child { border-radius: 0 10px 10px 0; }
.rc-table tfoot tr.rest td:last-child { border-radius: 10px 0 0 10px; }
.rc-pay p { font-size: 14.5px; }
.rc-notes { margin-top: 6px; color: #5b4c36; }
.rc-foot { display: flex; align-items: center; gap: 20px; margin-top: 22px; padding-top: 18px; border-top: 1.5px dashed #e2cfa8; }
.rc-qr { flex-shrink: 0; padding: 6px; background: #fff; border: 1px solid #eadcc0; border-radius: 10px; min-width: 110px; min-height: 110px; display: flex; align-items: center; justify-content: center; }
.rc-qr img, .rc-qr canvas { display: block; }
.rc-note { font-size: 13px; color: #7a6a52; line-height: 1.8; }
.rc-thanks { margin-top: 6px; font-family: var(--head); font-size: 16px; color: #7a561d; display: inline-flex; align-items: center; gap: 6px; }
.rc-links { display: flex; justify-content: center; gap: 10px; margin-top: 22px; flex-wrap: wrap; }

@media print {
  body { background: #fff; }
  .site-header, .trust-band, .site-footer, .wa-float, .rc-actions, .rc-links, .done-banner, .nav-overlay { display: none !important; }
  .receipt-page { padding: 0; background: none; }
  .receipt { box-shadow: none; border-radius: 0; padding: 20px; }
  @page { margin: 10mm; }
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width: 1180px) {
  .ev-grid { grid-template-columns: repeat(3, 1fr); }
  .main-nav { gap: 22px; }
  .brand-title { font-size: 66px; }
  .steps-box { grid-template-columns: 1fr; text-align: center; }
  .steps-head { text-align: center; }
  .script-note { transform: none; }
  .price-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 980px) {
  .menu-btn { display: inline-flex; }
  .hdr { gap: 12px; min-height: 66px; }
  .logo-text { font-size: 25px; }
  .logo .logo-mark { width: 42px; height: 34px; }
  .main-nav { position: fixed; top: 0; bottom: 0; inset-inline-start: 0; z-index: 100; width: 300px; max-width: 86%; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 80px 22px 24px; background: #0f0c08; border-inline-end: 1px solid var(--line); transform: translateX(100%); transition: transform .3s; overflow-y: auto; }
  .main-nav.open { transform: none; }
  .main-nav > a { padding: 14px 4px; border-bottom: 1px solid var(--line); font-size: 16.5px; }
  .main-nav > a.on::after, .main-nav > a.on::before { display: none; }
  .hdr-acc { margin-inline-start: auto; gap: 10px; }
  .hero { min-height: 0; }
  .hero-photo { inset-inline: 0; width: 100%; height: 62%; -webkit-mask-image: linear-gradient(to bottom, #000 55%, transparent 100%); mask-image: linear-gradient(to bottom, #000 55%, transparent 100%); }
  .hero-shade { background: linear-gradient(180deg, rgba(10,7,4,.35) 0, rgba(10,7,4,.1) 25%, rgba(10,7,4,.75) 55%, var(--bg) 92%); }
  .hero-in { grid-template-columns: 1fr; padding-top: 250px; gap: 26px; }
  .hero-brand { order: -1; }
  .hb-card { max-width: none; }
  .book-grid { grid-template-columns: 1fr; }
  .summary { position: static; order: 2; padding: 18px; }
  .summary dl { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
  .gal-grid { grid-template-columns: repeat(3, 1fr); }
  .tb-row { justify-content: center; }
  .tb-cta { order: 0; }
  .tb-items { justify-content: center; row-gap: 14px; }
}
@media (max-width: 720px) {
  body { font-size: 15px; }
  .brand-title { font-size: 50px; }
  .emblem svg { width: 110px; height: 90px; }
  .brand-rule i { width: 70px; }
  .hero-title { font-size: 21px; }
  .hero-sub { font-size: 16px; margin-bottom: 14px; }
  .hero-feats li { padding: 0 10px; font-size: 12px; }
  .hero-feats .ic { width: 24px; height: 24px; }
  .hero-in { padding-top: 300px; padding-bottom: 34px; }
  .hero-photo { height: 430px; }
  .emblem { display: none; }
  .hide-xs { display: none; }
  .sec-title h2 { font-size: 24px; }
  .ev-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .ev-card strong { font-size: 16.5px; }
  .ev-ic { width: 50px; height: 50px; margin-top: -26px; }
  .steps { grid-template-columns: repeat(2, 1fr); row-gap: 22px; }
  .steps li:nth-child(3) { border-inline-start: 0; }
  .steps-box { padding: 26px 18px; }
  .script-note { font-size: 22px; }
  .gal-grid, .gal-grid.big { grid-template-columns: repeat(2, 1fr); }
  .price-grid { grid-template-columns: 1fr; }
  .form-2 { grid-template-columns: 1fr; }
  .page-head h1, .book-hero h1 { font-size: 26px; }
  .wizard { padding: 20px 16px; border-radius: 20px; }
  .step legend { font-size: 20px; }
  .stepper { gap: 2px; }
  .stepper span { width: 38px; height: 38px; }
  .stepper span .ic { width: 17px; height: 17px; }
  .stepper li::before { top: 18px; }
  .stepper b { font-size: 11px; }
  .date-row { grid-template-columns: 1fr 1.4fr 1fr; gap: 8px; }
  .date-row select { font-size: 15.5px; padding: 10px 8px; padding-left: 26px; background-position: left 8px center; min-height: 56px; }
  .events-pick { grid-template-columns: repeat(2, 1fr); }
  .choice-grid { grid-template-columns: repeat(2, 1fr); }
  .ch-box { min-height: 108px; }
  .svc-list { grid-template-columns: 1fr; }
  .deposit-box { grid-template-columns: 1fr 1fr; }
  .deposit-box .dep-main { grid-column: 1 / -1; order: -1; }
  .po-body { margin-inline-start: 0; }
  .proof-wrap { grid-template-columns: 1fr; }
  .wz-nav { position: sticky; bottom: 0; z-index: 5; margin: 22px -16px -20px; padding: 14px 16px; background: rgba(21,16,10,.96); border-radius: 0 0 20px 20px; backdrop-filter: blur(8px); flex-wrap: wrap; }
  .wz-count { display: none; }
  .wz-nav .btn { flex: 1; min-width: 0; padding: 0 12px; }
  .wz-nav #submitBtn { font-size: 14px; }
  .summary dl { grid-template-columns: 1fr; }
  .bk-item { grid-template-columns: 66px 1fr; gap: 12px; padding: 14px; }
  .bk-date { height: 66px; }
  .bk-date b { font-size: 25px; }
  .bk-side { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: center; }
  .receipt { padding: 26px 18px 22px; border-radius: 18px; }
  .rc-cols { grid-template-columns: 1fr; }
  .rc-head { flex-direction: column; align-items: flex-start; }
  .rc-title { align-items: flex-start; text-align: start; }
  .rc-foot { flex-direction: column; text-align: center; }
  .done-banner { flex-direction: column; text-align: center; }
  .rc-actions .btn { flex: 1 1 45%; }
  .tb-item { padding: 0 14px; }
  .tb-item + .tb-item { border: 0; }
  .tb-items { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  .ft-row { justify-content: center; text-align: center; }
  .wa-float { width: 50px; height: 50px; bottom: 16px; inset-inline-start: 16px; }
}

/* ---------- wizard additions ---------- */
.book-grid.no-summary { grid-template-columns: minmax(0, 940px); justify-content: center; }
.gold-t { color: var(--gold-hi); }
.ev-choice .ch-box small { position: relative; z-index: 1; font-size: 12px; color: #cdbd9e; line-height: 1.4; }
.copy-row { display: flex; align-items: center; gap: 10px; margin-top: 10px; padding: 8px 8px 8px 14px; padding-inline-start: 14px; border-radius: 12px; background: rgba(217,173,92,.1); border: 1px solid var(--line2); }
.copy-val { flex: 1; min-width: 0; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 16px; font-weight: 700; letter-spacing: .5px; color: var(--gold-hi); word-break: break-all; text-align: left; }
.copy-row .copy-btn { margin: 0; flex-shrink: 0; background: var(--g-grad); color: #2b1e0b; border: 0; padding: 8px 16px; }
.copy-btn.copied { background: var(--ok) !important; color: #fff !important; }
.po-body .proof-wrap { margin: 14px 0 0; }
.po-body .upload { position: relative; }
.pay-opt .po-head { cursor: pointer; }
.pay-opt .po-head input { position: absolute; opacity: 0; pointer-events: none; }

/* ==========================================================================
   Light theme (default) — switch in Admin > Settings > الواجهة والمظهر
   ========================================================================== */
body.theme-light {
  --bg: #fdfaf4; --bg2: #f8f1e4; --card: #ffffff; --card2: #fffaf1;
  --line: #ecdfc6; --line2: #e0cca5;
  --gold-hi: #a3742c; --text: #3d3224; --muted: #7f6f57; --dim: #a39479;
  --g-grad-tx: linear-gradient(135deg, #d9ae5c 0%, #a8772f 55%, #7d5419 100%);
  background: var(--bg); color: var(--text);
}
.theme-light .btn-ghost { color: #8a5f1c; border-color: #dcc79e; background: #fff; }
.theme-light .btn-ghost:hover { background: #fdf3e0; border-color: var(--gold); }
.theme-light .icon-btn { color: #8a5f1c; }
/* header */
.theme-light .site-header { background: rgba(255, 253, 248, .9); border-bottom-color: #eee2cb; box-shadow: 0 6px 20px rgba(122, 86, 29, .06); }
.theme-light .logo-text { background: var(--g-grad-tx); -webkit-background-clip: text; background-clip: text; }
.theme-light .main-nav > a { color: #4a3c27; }
.theme-light .main-nav > a:hover, .theme-light .main-nav > a.on { color: #a3742c; }
.theme-light .nav-overlay { background: rgba(42, 33, 22, .35); }
/* hero */
/* sections */
.theme-light .events { background: linear-gradient(180deg, var(--bg) 0, var(--bg2) 100%); }
.theme-light .ev-card { background: #fff; border-color: #eee1c7; box-shadow: 0 8px 24px rgba(122,86,29,.07); }
.theme-light .ev-card:hover { box-shadow: 0 18px 40px rgba(122,86,29,.16), 0 0 0 1px rgba(217,173,92,.4); }
.theme-light .ev-img:not([style]) { background-image: radial-gradient(circle at 50% 40%, #fbf1df, #ecdcbd 70%); }
.theme-light .ev-img::after { background: linear-gradient(180deg, transparent 35%, rgba(255,255,255,.7) 78%, #fff 100%); }
.theme-light .ev-ic { background: #fff; color: #a3742c; box-shadow: 0 6px 16px rgba(122,86,29,.15); }
.theme-light .ev-card strong { color: #2a2116; }
.theme-light .st-ic { background: #fdf6e8; }
.theme-light .trust-band { background: #fff; border-color: #eee1c7; }
.theme-light .tb-item b { color: #8a5f1c; }
.theme-light .tb-item .ic { color: #a3742c; }
.theme-light .socials a { color: #8a5f1c; border-color: #e0cca5; }
.theme-light .socials a:hover { color: #2b1e0b; }
.theme-light .site-footer { background: var(--bg2); }
.theme-light .ft-copy { color: #8f8068; }
/* inner pages */
.theme-light .book-hero::before { background: rgba(253,250,244,.88); }
.theme-light .book-hero { border-bottom-color: #eee1c7; }
.theme-light .book-hero h1 { color: #2a2116; }
.theme-light .book-hero p { color: #6a5a42; }
.theme-light .card, .theme-light .bk-item { background: #fff; border-color: #eee1c7; box-shadow: 0 8px 24px rgba(122,86,29,.06); }
.theme-light .bk-info strong { color: #2a2116; }
.theme-light .alert-error { background: #fdecea; border-color: #f5c6c1; color: #92261e; }
.theme-light .ch-ic { background: #fdf6e8; color: #a3742c; border-color: #ecd9b1; }
.theme-light .code { color: #8a5f1c; background: #fbf1df; }
.theme-light .st-pending { background: #fff3d8; color: #9a6a0b; border-color: #efd28f; }
.theme-light .st-confirmed { background: #e2f6ea; color: #1d7a4a; border-color: #a7dfbe; }
.theme-light .st-done { background: #e7edfb; color: #3858a6; border-color: #bfcdf1; }
.theme-light .st-cancelled { background: #fde8e6; color: #b13a30; border-color: #f2b9b3; }
/* forms */
.theme-light .fld > span { color: #4a3c27; }
.theme-light .fld > span em { color: #a39479; }
.theme-light input[type=text], .theme-light input[type=tel], .theme-light input[type=email], .theme-light input[type=password], .theme-light input[type=number], .theme-light input[type=date], .theme-light select, .theme-light textarea { background-color: #fff; border-color: #e5d7bc; color: #2a2116; }
.theme-light input:focus, .theme-light select:focus, .theme-light textarea:focus { background-color: #fff; border-color: var(--gold); box-shadow: 0 0 0 4px rgba(217,173,92,.18); }
.theme-light select option { background: #fff; color: #2a2116; }
.theme-light input::placeholder, .theme-light textarea::placeholder { color: #b9ab92; }
/* wizard */
.theme-light .wizard { background: #fff; border-color: #eee1c7; box-shadow: 0 20px 50px rgba(122,86,29,.08); }
.theme-light .step legend { color: #2a2116; }
.theme-light .stepper li::before { background: #eadcc0; }
.theme-light .stepper li.done::before { background: var(--gold); }
.theme-light .stepper span { background: #fff; border-color: #e5d7bc; color: #b9ab92; }
.theme-light .stepper b { color: #a39479; }
.theme-light .stepper li.on b { color: #8a5f1c; }
.theme-light .stepper li.done span { background: #fdf6e8; color: #a3742c; }
.theme-light .stepper li.done b { color: #6a5a42; }
.theme-light .date-status.ok { background: #e8f7ef; border-color: #a7dfbe; color: #1d7a4a; }
.theme-light .date-status.ok b { color: #155f39; }
.theme-light .date-status.bad { background: #fdecea; border-color: #f2b9b3; color: #b13a30; }
.theme-light .date-status.wait { background: #fff8e8; color: #9a6a0b; }
.theme-light .ch-box { background: #fff; border-color: #eadcc0; }
.theme-light .ch-box b { color: #3d3224; }
.theme-light .choice input:checked + .ch-box { background: linear-gradient(180deg, #fdf3df, #fffaf1); box-shadow: 0 10px 26px rgba(168,119,47,.16); }
.theme-light .ev-choice .ch-box::before { background-image: linear-gradient(180deg, rgba(255,255,255,0) 0, rgba(255,255,255,.55) 40%, rgba(255,255,255,.97) 74%), var(--img, none); opacity: 1; }
.theme-light .ev-choice .ch-box b { color: #2a2116; }
.theme-light .ev-choice .ch-box small { color: #7f6f57; }
.theme-light .ev-choice .ch-box .ch-ic { background: rgba(255,255,255,.92); }
.theme-light .svc { background: #fff; border-color: #eadcc0; }
.theme-light .svc-ic { background: #fdf6e8; color: #a3742c; }
.theme-light .svc-txt b { color: #2a2116; }
.theme-light .svc-check { border-color: #d9c7a3; }
.theme-light .svc.on { background: linear-gradient(90deg, #fdf3df, #fffaf1); }
.theme-light .svc-title { color: #2a2116; }
.theme-light .svc-total { background: #fdf6e8; color: #4a3c27; }
.theme-light .deposit-box > div { background: #fff; border-color: #eadcc0; }
.theme-light .deposit-box b { color: #2a2116; }
.theme-light .deposit-box .dep-main b { color: #22170a; }
.theme-light .pay-opt { background: #fff; border-color: #eadcc0; }
.theme-light .pay-opt:has(input:checked) { background: linear-gradient(180deg, #fdf6e8, #fff); }
.theme-light .po-head b { color: #2a2116; }
.theme-light .po-details { background: #fffaf1; border-color: #e7d4ac; color: #3d3224; }
.theme-light .copy-row { background: #fdf6e8; border-color: #e7d4ac; }
.theme-light .copy-val { color: #7a561d; }
.theme-light .upload { background: #fffaf1; border-color: #dcc79e; }
.theme-light .upload b { color: #2a2116; }
.theme-light .upload.has { background: #edf9f2; }
.theme-light .agree { background: #fffaf1; border-color: #eadcc0; }
.theme-light .wz-nav { border-top-color: #f0e5d0; }
.theme-light .summary { background: #fff; border-color: #e7d4ac; box-shadow: 0 20px 50px rgba(122,86,29,.1); }
.theme-light .summary h3 { color: #2a2116; border-bottom-color: #f0e5d0; }
.theme-light .summary dl > div { border-bottom-color: #f3eadb; }
.theme-light .summary dd { color: #2a2116; }
.theme-light .s-svcs li { color: #4a3c27; }
.theme-light .s-total { border-top-color: #f0e5d0; }
.theme-light .s-total b { color: #2a2116; }
.theme-light .s-dep { background: #fdf3df; color: #8a5f1c; }
.theme-light .toast { background: #2a2116; }
/* receipt page */
.theme-light .receipt { box-shadow: 0 24px 60px rgba(122,86,29,.16); }
@media (max-width: 980px) {
  .theme-light .main-nav { background: #fff; border-inline-end-color: #eee1c7; }
  .theme-light .main-nav > a { border-bottom-color: #f1e6d1; }
}
@media (max-width: 720px) {
  .theme-light .wz-nav { background: rgba(255,255,255,.97); }
}

/* Light theme: plain white backgrounds, no blurred photo behind */
body.theme-light { --bg: #ffffff; --bg2: #ffffff; }
.theme-light .book-hero { background: #fff; }
.theme-light .book-hero::before { display: none; }
.theme-light .events, .theme-light .site-footer { background: #fff; }
.theme-light .site-header { background: #fff; backdrop-filter: none; -webkit-backdrop-filter: none; }

/* ==========================================================================
   Design match (v5): dark header bar, sharp hero with flowers & gold emblem,
   cream middle band with full-photo cards, dark trust band + footer
   ========================================================================== */
.emblem-img { display: none; }
.hero-fl { display: none; }

/* full-photo occasion cards (both themes) */
.ev-grid { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 16px; }
.ev-card, .theme-light .ev-card { position: relative; display: block; aspect-ratio: 1.2; padding: 0; border-radius: 16px; overflow: hidden; background: #100c08; border: 0; box-shadow: 0 10px 26px rgba(0,0,0,.28); }
.ev-card:hover, .theme-light .ev-card:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(0,0,0,.35), 0 0 0 1.5px rgba(217,173,92,.7); }
.ev-img, .theme-light .ev-img { position: absolute; inset: 0; width: 100%; aspect-ratio: auto; background-size: cover; background-position: center top; }
.ev-img:not([style]), .theme-light .ev-img:not([style]) { background-image: radial-gradient(circle at 50% 30%, #4a3519, #120d08 70%); }
.ev-img::after, .theme-light .ev-img::after { background: linear-gradient(180deg, transparent 38%, rgba(16,12,8,.55) 56%, rgba(16,12,8,.96) 70%); }
.ev-ic, .theme-light .ev-ic { position: absolute; z-index: 2; left: 50%; top: 55%; width: 48px; height: 48px; margin: -24px 0 0 -24px; background: rgba(16,12,8,.72); border: 1.5px solid rgba(217,173,92,.8); color: #f3d692; box-shadow: 0 4px 14px rgba(0,0,0,.45); }
.ev-ic .ic { width: 23px; height: 23px; }
.ev-card strong, .theme-light .ev-card strong { position: absolute; z-index: 2; inset-inline: 8px; top: 73%; margin: 0; text-align: center; font-size: 17px; line-height: 1.3; color: #fff; }
.ev-card small, .theme-light .ev-card small { position: absolute; z-index: 2; inset-inline: 8px; top: 87%; text-align: center; font-size: 11.5px; line-height: 1.3; color: #d9cbb0; min-height: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* dark theme = the reference design */
.theme-dark .site-header, .theme-dark.page-home .site-header, .theme-dark.page-home .site-header.scrolled { position: sticky; background: #0d0a07; border-bottom: 1px solid rgba(217,173,92,.45); }
.theme-dark .hero { min-height: 0; align-items: center; }
.theme-dark .hero-bg { transform: scale(1.06); filter: saturate(1.15) brightness(1.08); }
.theme-dark .hero-photo { inset-inline-start: 22%; width: 52%; -webkit-mask-image: linear-gradient(to left, transparent 0, #000 16%, #000 84%, transparent 100%); mask-image: linear-gradient(to left, transparent 0, #000 16%, #000 84%, transparent 100%); }
.theme-dark .hero-shade { background:
  radial-gradient(ellipse at 22% 50%, rgba(10,7,4,.55) 0, rgba(10,7,4,.15) 45%, transparent 65%),
  linear-gradient(180deg, rgba(10,7,4,.15) 0, transparent 40%, transparent 85%, rgba(10,7,4,.35) 100%); }
.theme-dark .hero-in { padding-top: 30px; padding-bottom: 36px; align-items: center; }
.theme-dark .hero-book { align-self: end; margin-bottom: 20px; }
.theme-dark .hb-card { background: rgba(10, 7, 4, .66); border-color: rgba(217,173,92,.55); border-radius: 26px; }
.theme-dark .emblem { display: none; }
.theme-dark .emblem-img { display: block; width: 230px; height: auto; margin-bottom: -6px; -webkit-mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 62%, transparent 100%); mask-image: radial-gradient(ellipse 50% 50% at 50% 50%, #000 62%, transparent 100%); }
.theme-dark .brand-title { font-size: 78px; }
.theme-dark .hero-fl { display: block; position: absolute; bottom: 0; z-index: -1; pointer-events: none; height: 78%; width: auto; }
.theme-dark .hero-fl-l { left: 0; -webkit-mask-image: linear-gradient(to right, #000 55%, transparent 100%), linear-gradient(to top, #000 70%, transparent 100%); -webkit-mask-composite: source-in; mask-image: linear-gradient(to right, #000 55%, transparent 100%); }
.theme-dark .hero-fl-r { right: 0; height: 70%; bottom: 0; -webkit-mask-image: linear-gradient(to left, #000 55%, transparent 100%); mask-image: linear-gradient(to left, #000 55%, transparent 100%); }
.theme-dark .events { background: #f8f3ea; padding: 24px 0 14px; }
.theme-dark .steps-band { background: #f8f3ea; padding: 10px 0 30px; }
.theme-dark .steps-box { background: #f1e8d9; box-shadow: none; border: 1px solid #e8dcc6; border-radius: 22px; padding: 22px 30px; }
.st-ic { width: auto; height: auto; flex-direction: row; gap: 8px; background: none; box-shadow: none; color: #2a2116; margin-bottom: 6px; }
.st-ic b { position: static; width: 24px; height: 24px; background: #fff; border: 1.5px solid #c99a45; color: #8a5f1c; font-size: 13px; }
.st-ic .ic { color: #2a2116; stroke-width: 1.6; }
.theme-dark .steps-head h2 { font-size: 27px; }
.theme-dark .trust-band { background: #0d0a07; border-top: 0; }
.theme-dark .site-footer { background: #0d0a07; border-top: 1px solid rgba(217,173,92,.15); }
@media (max-width: 980px) {
  .theme-dark .hero-photo { inset-inline: 0; width: 100%; }
  .theme-dark .hero-in { padding-top: 250px; }
  .theme-dark .hero-fl { height: 40%; opacity: .8; }
  .theme-dark .hero-shade { background: linear-gradient(180deg, rgba(10,7,4,.2) 0, rgba(10,7,4,.05) 25%, rgba(10,7,4,.7) 52%, rgba(10,7,4,.9) 80%, rgba(10,7,4,.95) 100%); }
  .ev-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 720px) {
  .theme-dark .hero-in { padding-top: 260px; }
  .theme-dark .emblem-img { width: 150px; }
  .theme-dark .brand-title { font-size: 50px; }
  .ev-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .ev-card strong, .theme-light .ev-card strong { font-size: 15px; }
  .ev-ic, .theme-light .ev-ic { width: 42px; height: 42px; margin: -21px 0 0 -21px; }
}

/* exact hero (desktop, dark): the design photo, pieces placed at its proportions (1536 × 446) */
@media (min-width: 1100px) {
  .theme-dark .hero { display: block; min-height: 0; height: 29.04vw; background: #120d08 url('../img/seed/hero-full.webp') center / 100% 100% no-repeat; }
  .theme-dark .hero-bg, .theme-dark .hero-photo, .theme-dark .hero-shade, .theme-dark .hero-fl { display: none; }
  .theme-dark .hero-in { position: absolute; inset: 0; max-width: none; padding: 0; display: block; }
  .theme-dark .hero-brand { position: absolute; left: 9.6%; width: 29.6%; top: 3.2%; bottom: 6%; gap: 0; padding: 0; justify-content: flex-start; }
  .theme-dark .emblem-img { width: 15.2vw; margin: 0 0 -.4vw; }
  .theme-dark .brand-title { font-size: 4.75vw; filter: drop-shadow(0 .25vw .8vw rgba(0,0,0,.55)); }
  .theme-dark .brand-rule { margin: .3vw 0 .7vw; gap: .6vw; }
  .theme-dark .brand-rule i { width: 9vw; }
  .theme-dark .brand-rule .ic { width: 1.1vw; height: 1.1vw; }
  .theme-dark .hero-title { font-size: 1.62vw; line-height: 1.5; }
  .theme-dark .hero-sub { font-size: 1.3vw; margin-bottom: 1.6vw; line-height: 1.5; }
  .theme-dark .hero-feats li { padding: 0 1.45vw; gap: .5vw; font-size: .88vw; }
  .theme-dark .hero-feats .ic { width: 2vw; height: 2vw; }
  .theme-dark .hero-book { position: absolute; left: 71.4%; width: 19.8%; top: 52.6%; height: 39.6%; margin: 0; }
  .theme-dark .hb-card { height: 100%; max-width: none; display: flex; flex-direction: column; justify-content: center; padding: 1.4vw 1.75vw; border-radius: 1.6vw; }
  .theme-dark .hb-card h2 { justify-content: flex-start; gap: .9vw; font-size: 1.5vw; margin-bottom: .3vw; }
  .theme-dark .hb-card h2 .ic { width: 1.8vw; height: 1.8vw; order: -1; }
  .theme-dark .hb-card p { font-size: .86vw; margin-bottom: 1.25vw; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .theme-dark .hb-card .btn { height: 3vw; font-size: 1.05vw; border-radius: .8vw; }
}
@media (min-width: 1100px) {
  .theme-dark .hero-feats li { white-space: nowrap; padding: 0 1.2vw; }
  .theme-dark.page-home .container { max-width: 1480px; padding: 0 30px; }
  .theme-dark .site-header .logo-text { font-size: 38px; }
  .theme-dark .site-header .logo .logo-mark { width: 62px; height: 50px; }
  .theme-dark .hdr { min-height: 70px; }
}

/* ---------- occasions section ---------- */
.ev-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; margin-bottom: 16px; }
.ev-head h2 { position: relative; font-family: var(--head); font-size: 28px; font-weight: 700; color: #2a2116; padding-bottom: 8px; }
.ev-head h2::after { content: ''; position: absolute; bottom: 0; inset-inline-start: 0; width: 46px; height: 3px; border-radius: 3px; background: var(--g-grad); }
.ev-head-end { display: flex; align-items: center; gap: 8px; }
.see-all { display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; border-radius: 30px; border: 1.5px solid #d9b46a; color: #8a5f1c; font-weight: 700; font-size: 14px; background: #fff; transition: .2s; }
.see-all:hover { background: var(--g-grad); color: #2b1e0b; border-color: transparent; }
.ev-arrow { width: 38px; height: 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; border: 1.5px solid #e2cfa6; background: #fff; color: #8a5f1c; transition: .2s; }
.ev-arrow:hover { background: var(--g-grad); color: #2b1e0b; border-color: transparent; }
.theme-dark .events:not(.events-all) .ev-head h2 { color: #2a2116; }
.events-all { padding: 30px 0 50px; }
.theme-dark .events-all { background: #f8f3ea; }
/* horizontal slider (drag) */
.ev-slider { display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; padding: 4px 2px 14px; scrollbar-width: none; cursor: grab; -webkit-overflow-scrolling: touch; }
.ev-slider::-webkit-scrollbar { display: none; }
.ev-slider.dragging { cursor: grabbing; scroll-snap-type: none; scroll-behavior: auto; }
.ev-slider.dragging .ev-card { pointer-events: none; }
.ev-slider .ev-card { flex: 0 0 calc((100% - 4 * 16px) / 5); scroll-snap-align: start; user-select: none; -webkit-user-drag: none; }
.ev-slider img { -webkit-user-drag: none; }
/* the custom card */
.ev-custom .ev-img:not([style]) { background-image: radial-gradient(circle at 50% 28%, #7a5626 0, #3a2810 38%, #140e07 72%) !important; }
.ev-custom .ev-img:not([style])::before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(135deg, rgba(243,214,146,.07) 0 2px, transparent 2px 14px); }
.ev-custom .ev-ic { background: var(--g-grad) !important; color: #2b1e0b !important; border-color: transparent !important; }
.ev-choice-custom .ch-box { border-style: dashed; }
.ev-choice-custom .ch-box:not([style])::before { background-image: radial-gradient(circle at 50% 30%, rgba(217,173,92,.35), transparent 70%) !important; }
.custom-name { margin-top: 4px; padding: 16px; border-radius: 16px; border: 1.5px dashed var(--line2); background: rgba(217,173,92,.06); animation: stepIn .35s both; }
.custom-name input { font-size: 17px; font-weight: 700; }
.custom-end { text-align: center; padding: 28px 20px; border-radius: 20px; background: rgba(31,170,89,.08); border: 1.5px solid rgba(31,170,89,.35); margin-bottom: 6px; }
.ce-ic { width: 70px; height: 70px; margin: 0 auto 10px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #1faa59; color: #fff; box-shadow: 0 0 0 8px rgba(31,170,89,.14); }
.custom-end h3 { font-family: var(--head); font-size: 23px; color: #fff; margin-bottom: 6px; }
.custom-end p { color: var(--muted); max-width: 560px; margin: 0 auto; font-size: 14.5px; }
.theme-light .custom-end h3 { color: #155f39; }
.wz-nav .btn-wa { min-width: 160px; }
.st-inquiry { background: rgba(160,110,220,.14); color: #c8a5f1; border: 1px solid rgba(160,110,220,.4); }
.theme-light .st-inquiry, .receipt .st-inquiry { background: #f3e9fb; color: #6b3fa0; border-color: #d9c2ef; }
.summary.is-custom .s-dep b { font-size: 14px; }
@media (max-width: 980px) { .ev-slider .ev-card { flex-basis: calc((100% - 2 * 16px) / 3); } }
@media (max-width: 720px) {
  .ev-slider { gap: 10px; }
  .ev-slider .ev-card { flex-basis: 44%; }
  .ev-head h2 { font-size: 23px; }
  .see-all { padding: 6px 12px; font-size: 13px; }
  .wz-nav .btn-wa { font-size: 13px; padding: 0 10px; }
}
.ev-grid { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 980px) { .ev-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 720px) { .ev-grid { grid-template-columns: repeat(2, 1fr); } }

/* «عرض الكل» = plain text link */
.see-all, .see-all:hover { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: #8a5f1c; font-weight: 700; font-size: 15px; }
.see-all:hover { color: #2a2116; text-decoration: underline; text-underline-offset: 5px; }
.ev-arrow { display: none; }

/* «الوضع الداكن»: same design, whole page black */
.bg-black .events, .bg-black .steps-band, .bg-black .events-all, .bg-black .gallery-sec { background: var(--bg); }
.bg-black .events:not(.events-all) .ev-head h2, .bg-black .ev-head h2 { color: #fff; }
.bg-black .see-all { color: var(--gold-hi); }
.bg-black .see-all:hover { color: #fff; }
.bg-black .steps-box { background: var(--card); border-color: var(--line); }
.bg-black .steps-head h2, .bg-black .steps strong { color: #fff; }
.bg-black .steps-head p { color: var(--muted); }
.bg-black .steps small { color: var(--dim); }
.bg-black .steps li + li { border-color: var(--line); }
.bg-black .st-ic .ic { color: var(--gold); }
.bg-black .st-ic b { background: #1d160e; border-color: var(--gold); color: var(--gold-hi); }
.bg-black .script-note { color: var(--gold-hi); }
.bg-black .script-note .ic { color: var(--gold); }
.bg-black .site-footer { border-top-color: var(--line); }

/* ---------- booking page, «الوضع الأبيض المشرق»: white page, black & gold header/footer ---------- */
.book-white { background: #fff; }
.book-white .book-hero, .book-white .book-wrap { background: #fff; }
.book-white .site-header { background: #0d0a07 !important; border-bottom: 1px solid rgba(217,173,92,.45); box-shadow: none; }
.book-white .site-header .logo-text { background: linear-gradient(135deg, #f7df9f 0%, #d9ad5c 48%, #b0802f 100%); -webkit-background-clip: text; background-clip: text; font-size: 38px; }
.book-white .site-header .logo .logo-mark { width: 62px; height: 50px; }
.book-white .main-nav > a { color: #e9dcc2; }
.book-white .main-nav > a:hover, .book-white .main-nav > a.on { color: #f3d692; }
.book-white .icon-btn { color: #f3d692; }
.book-white .btn-ghost { color: #f3d692; border-color: rgba(217,173,92,.38); background: rgba(217,173,92,.04); }
.book-white .wizard .btn-ghost { color: #8a5f1c; border-color: #dcc79e; background: #fff; }
.book-white .trust-band { background: #0d0a07; border-color: transparent; }
.book-white .tb-item b { color: #f3d692; }
.book-white .tb-item small { color: #b3a385; }
.book-white .tb-item .ic { color: #d9ad5c; }
.book-white .tb-item + .tb-item { border-color: rgba(217,173,92,.2); }
.book-white .socials a { color: #f3d692; border-color: rgba(217,173,92,.38); }
.book-white .site-footer { background: #0d0a07; border-top: 1px solid rgba(217,173,92,.15); }
.book-white .ft-copy { color: #7f735e; }
.book-white .ft-tag { color: #b3a385; }
.book-white .site-footer .logo-text { background: linear-gradient(135deg, #f7df9f 0%, #d9ad5c 48%, #b0802f 100%); -webkit-background-clip: text; background-clip: text; }
@media (max-width: 980px) {
  .book-white .site-header .logo-text { font-size: 25px; }
  .book-white .site-header .logo .logo-mark { width: 42px; height: 34px; }
  .book-white .main-nav { background: #0f0c08; border-inline-end-color: rgba(217,173,92,.2); }
  .book-white .main-nav > a { border-bottom-color: rgba(217,173,92,.2); }
}

/* ---------- header search ---------- */
.hdr-acc { gap: 12px; }
.hsearch { position: relative; width: 250px; }
.hsearch input[type=search] { width: 100%; min-height: 0; height: 42px; padding: 0 40px 0 14px; border-radius: 30px; background: rgba(255,255,255,.06); border: 1px solid rgba(217,173,92,.35); color: #f3e7cf; font-size: 14px; }
[dir="rtl"] .hsearch input[type=search] { padding: 0 40px 0 14px; }
.hsearch input::placeholder { color: #a8987a; }
.hsearch input:focus { background: rgba(255,255,255,.1); border-color: var(--gold); box-shadow: 0 0 0 3px rgba(217,173,92,.18); }
.hs-ic { position: absolute; top: 50%; inset-inline-start: 13px; transform: translateY(-50%); color: #d9ad5c; display: flex; pointer-events: none; }
.hs-list { position: absolute; top: calc(100% + 8px); inset-inline: 0; min-width: 300px; z-index: 80; padding: 6px; border-radius: 16px; background: #fff; border: 1px solid #eadcc0; box-shadow: 0 20px 50px rgba(0,0,0,.35); max-height: 70vh; overflow: auto; }
.hs-item { display: flex; align-items: center; gap: 12px; padding: 8px; border-radius: 12px; color: #2a2116; transition: .15s; }
.hs-item:hover, .hs-item.on { background: #fdf3df; }
.hs-img { width: 46px; height: 46px; flex-shrink: 0; border-radius: 10px; background: radial-gradient(circle at 50% 30%, #6a4a1e, #1a120a 75%) center / cover; }
.hs-star { display: flex; align-items: center; justify-content: center; color: #2b1e0b; background: var(--g-grad) !important; font-size: 20px; }
.hs-t { display: flex; flex-direction: column; min-width: 0; line-height: 1.4; }
.hs-t b { font-size: 15px; font-weight: 700; }
.hs-t mark { background: none; color: #b0802f; font-weight: 800; }
.hs-t small { font-size: 12px; color: #8a7a60; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hs-custom { border-top: 1px dashed #eadcc0; margin-top: 4px; }
.hs-toggle { display: none; }
.main-nav { gap: 26px; }
.nav-track { display: none; }

/* ---------- page search (services, occasions) ---------- */
.list-search { position: relative; display: flex; align-items: center; max-width: 640px; margin: 0 auto 24px; }
.list-search input[type=search] { width: 100%; height: 56px; min-height: 0; padding: 0 48px 0 110px; border-radius: 40px; font-size: 16px; background: #fff; border: 1.5px solid #e2cfa6; color: #2a2116; box-shadow: 0 10px 26px rgba(122,86,29,.08); }
[dir="rtl"] .list-search input[type=search] { padding: 0 48px 0 110px; }
.list-search .hs-ic { inset-inline-start: 18px; color: #b0802f; }
.list-search input:focus { border-color: var(--gold); background: #fff; }
.ls-count { position: absolute; inset-inline-end: 20px; font-size: 13px; color: #8a7a60; font-weight: 700; }
.ls-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 40px 10px; color: #7a6a52; text-align: center; }
.ls-empty .ic { color: #c99a45; }
.bg-black .list-search input[type=search] { background: var(--card); border-color: var(--line2); color: var(--text); box-shadow: none; }
.bg-black .ls-empty { color: var(--muted); }

/* ---------- services page ---------- */
.svc-page { background: #f8f3ea; }
.svc-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.svc-card { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px; padding: 18px 20px; border-radius: 18px; background: #fff; border: 1px solid #eee1c7; box-shadow: 0 8px 22px rgba(122,86,29,.06); transition: .2s; }
.svc-card:hover { border-color: var(--gold); transform: translateY(-2px); }
.sc-ic { width: 56px; height: 56px; border-radius: 16px; display: flex; align-items: center; justify-content: center; background: var(--g-grad); color: #2b1e0b; }
.sc-body h3 { font-family: var(--head); font-size: 18px; color: #2a2116; }
.sc-body p { font-size: 13.5px; color: #7a6a52; line-height: 1.6; }
.sc-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.sc-tags a { font-size: 11.5px; font-weight: 700; padding: 2px 10px; border-radius: 20px; background: #fdf3df; color: #8a5f1c; border: 1px solid #efdcb5; }
.sc-tags a:hover { background: var(--g-grad); color: #2b1e0b; }
.sc-price { display: flex; flex-direction: column; align-items: flex-end; font-size: 18px; color: #8a5f1c; white-space: nowrap; }
.sc-price small { font-size: 11px; color: #a39479; font-weight: 600; }
.bg-black .svc-page { background: var(--bg); }
.bg-black .svc-card { background: var(--card); border-color: var(--line); box-shadow: none; }
.bg-black .sc-body h3 { color: #fff; }
.bg-black .sc-body p { color: var(--muted); }
.bg-black .sc-tags a { background: rgba(217,173,92,.1); border-color: var(--line2); color: var(--gold-hi); }
.bg-black .sc-price { color: var(--gold-hi); }

/* ---------- tracking page ---------- */
.page-track main { background: #f8f3ea; }
.bg-black.page-track main { background: var(--bg); }
.track-form { display: flex; flex-direction: column; gap: 16px; text-align: start; background: #fff; border-color: #eee1c7; }
.track-form .auth-ic { margin: 0 auto; background: #fdf6e8; color: #a3742c; border-color: #ecd9b1; }
.track-form .fld > span { color: #4a3c27; }
.track-form input { background: #fff !important; color: #2a2116 !important; border-color: #e5d7bc !important; }
.track-card { background: #fff; color: #2a2116; border-radius: 24px; padding: 26px; border: 1px solid #eee1c7; box-shadow: 0 20px 50px rgba(122,86,29,.1); }
.tr-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.tr-head small { display: block; color: #8a7a60; font-size: 12.5px; }
.tr-head b { font-family: monospace; font-size: 22px; color: #7a561d; letter-spacing: 1px; }
.track-card .st-pending { background: #fff3d8; color: #9a6a0b; border-color: #efd28f; }
.track-card .st-confirmed { background: #e2f6ea; color: #1d7a4a; border-color: #a7dfbe; }
.track-card .st-done { background: #e7edfb; color: #3858a6; border-color: #bfcdf1; }
.track-card .st-cancelled { background: #fde8e6; color: #b13a30; border-color: #f2b9b3; }
.tr-msg { display: flex; align-items: center; gap: 16px; padding: 18px; border-radius: 18px; margin-bottom: 22px; }
.tr-msg > span { width: 58px; height: 58px; flex-shrink: 0; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: #fff; }
.tr-msg h2 { font-family: var(--head); font-size: 22px; }
.tr-msg p { font-size: 14.5px; color: #5b4c36; }
.tr-ok { background: #e8f7ef; } .tr-ok > span { background: #1d8a52; } .tr-ok h2 { color: #155f39; }
.tr-wait { background: #fff6e0; } .tr-wait > span { background: #d79a1e; } .tr-wait h2 { color: #8a5a00; }
.tr-done { background: #eef2fd; } .tr-done > span { background: #3858a6; } .tr-done h2 { color: #2d4a8f; }
.tr-bad { background: #fdecea; } .tr-bad > span { background: #c4392f; } .tr-bad h2 { color: #92261e; }
.tr-steps { list-style: none; display: grid; grid-template-columns: repeat(4, 1fr); margin-bottom: 22px; }
.tr-steps li { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; }
.tr-steps li::before { content: ''; position: absolute; top: 21px; inset-inline-start: 50%; width: 100%; height: 3px; background: #efe5d3; z-index: 0; }
.tr-steps li:last-child::before { display: none; }
.tr-steps li.done::before { background: #c99a45; }
.tr-steps span { position: relative; z-index: 1; width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #fff; border: 2px solid #e5d7bc; color: #b9ab92; }
.tr-steps li.done span { background: var(--g-grad); border-color: transparent; color: #2b1e0b; }
.tr-steps li.cur span { border-color: #c99a45; color: #a3742c; box-shadow: 0 0 0 6px rgba(201,154,69,.18); animation: pulse 1.6s infinite; }
@keyframes pulse { 50% { box-shadow: 0 0 0 10px rgba(201,154,69,.06); } }
.tr-steps b { font-size: 13.5px; }
.tr-steps small { font-size: 11.5px; color: #8a7a60; }
.tr-info > div { display: grid; grid-template-columns: 130px 1fr; gap: 10px; padding: 10px 0; border-bottom: 1px solid #f2ead9; font-size: 14.5px; }
.tr-info dt { display: flex; align-items: center; gap: 7px; color: #8a7a60; }
.tr-info dt .ic { color: #b0802f; }
.tr-info dd { font-weight: 700; }
.tr-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.rc-qr-wrap { display: flex; flex-direction: column; align-items: center; gap: 6px; flex-shrink: 0; }
.rc-qr-wrap small { font-size: 11.5px; color: #8a7a60; font-weight: 700; }

@media (max-width: 1180px) { .hsearch { width: 200px; } .main-nav { gap: 18px; } }
@media (max-width: 980px) {
  .hsearch { position: absolute; top: 100%; inset-inline: 0; width: auto; padding: 10px 14px; background: #0d0a07; border-bottom: 1px solid rgba(217,173,92,.3); display: none; }
  .hsearch.open { display: block; }
  .hsearch .hs-ic { inset-inline-start: 27px; }
  .hs-list { inset-inline: 14px; min-width: 0; }
  .hs-toggle { display: inline-flex; }
  .hdr { position: relative; }
  .nav-track { display: block; }
  .svc-grid { grid-template-columns: 1fr; }
}
@media (max-width: 720px) {
  .hdr-book { display: none; }
  .svc-card { grid-template-columns: auto 1fr; padding: 14px; }
  .sc-price { grid-column: 1 / -1; flex-direction: row; justify-content: space-between; align-items: baseline; border-top: 1px dashed #eadcc0; padding-top: 8px; }
  .tr-steps b { font-size: 11.5px; } .tr-steps small { display: none; }
  .tr-info > div { grid-template-columns: 1fr; gap: 2px; }
  .track-card { padding: 18px; }
  .list-search input[type=search] { height: 50px; font-size: 15px; }
}
.main-nav > a { white-space: nowrap; }
@media (max-width: 1320px) { .main-nav { gap: 18px; } .main-nav > a { font-size: 14.5px; } .hsearch { width: 190px; } .theme-dark .site-header .logo-text, .book-white .site-header .logo-text { font-size: 32px; } }
@media (max-width: 1200px) and (min-width: 981px) { .hdr-book { display: none; } .hdr { gap: 16px; } .main-nav { gap: 14px; } }
/* compact header (menu button + search icon) from 1180px down */
@media (max-width: 1180px) {
  .menu-btn { display: inline-flex; }
  .hdr { gap: 12px; position: relative; }
  .main-nav { position: fixed; top: 0; bottom: 0; inset-inline-start: 0; z-index: 100; width: 300px; max-width: 86%; flex-direction: column; align-items: stretch; gap: 0; margin: 0; padding: 80px 22px 24px; background: #0f0c08; border-inline-end: 1px solid var(--line); transform: translateX(100%); transition: transform .3s; overflow-y: auto; }
  .main-nav.open { transform: none; }
  .main-nav > a { padding: 14px 4px; border-bottom: 1px solid var(--line); font-size: 16.5px; }
  .main-nav > a.on::after, .main-nav > a.on::before { display: none; }
  .nav-track { display: block; }
  .hdr-acc { margin-inline-start: auto; }
  .hsearch { position: absolute; top: 100%; inset-inline: 0; width: auto; padding: 10px 14px; background: #0d0a07; border-bottom: 1px solid rgba(217,173,92,.3); display: none; }
  .hsearch.open { display: block; }
  .hsearch .hs-ic { inset-inline-start: 27px; }
  .hs-list { inset-inline: 14px; min-width: 0; }
  .hs-toggle { display: inline-flex; }
  .hdr-book { display: inline-flex !important; }
}
@media (max-width: 720px) { .hdr-book { display: none !important; } }

/* ---------- phone / tablet menu (fixed: was clipped inside the header and under the overlay) ---------- */
.nav-head, .nv-ic, .nav-book { display: none; }
@media (max-width: 1180px) {
  .site-header, .theme-dark .site-header, .page-home .site-header { backdrop-filter: none; -webkit-backdrop-filter: none; }
  body.nav-open .site-header { z-index: 95; }
  .nav-overlay { z-index: 90; }
  .main-nav { position: fixed; top: 0; bottom: 0; height: 100vh; height: 100dvh; inset-inline-start: 0; z-index: 100; width: 300px; max-width: 86vw; padding: 0 0 24px; background: #0f0c08; box-shadow: -20px 0 50px rgba(0,0,0,.5); }
  .nav-head { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; margin-bottom: 8px; border-bottom: 1px solid rgba(217,173,92,.25); }
  .nh-logo { font-family: var(--brand); font-size: 24px; font-weight: 700; background: linear-gradient(135deg, #f7df9f, #d9ad5c 48%, #b0802f); -webkit-background-clip: text; background-clip: text; color: transparent; direction: ltr; }
  .nav-head .icon-btn { color: #f3d692; border: 1px solid rgba(217,173,92,.35); width: 40px; height: 40px; }
  .main-nav > a:not(.nav-book) { display: flex !important; align-items: center; gap: 14px; margin: 0 14px; padding: 13px 8px; border-radius: 12px; border-bottom: 1px solid rgba(217,173,92,.12); color: #efe4cf !important; font-size: 16.5px; font-weight: 600; }
  .main-nav > a.on { background: rgba(217,173,92,.12); color: #f3d692 !important; }
  .nv-ic { display: inline-flex; width: 38px; height: 38px; align-items: center; justify-content: center; border-radius: 10px; background: rgba(217,173,92,.1); color: #d9ad5c; flex-shrink: 0; }
  .main-nav > a.on .nv-ic { background: linear-gradient(135deg, #f7df9f, #d9ad5c 48%, #b0802f); color: #2b1e0b; }
  .nav-book { display: flex !important; margin: 18px 14px 0; height: 50px; }
}
.main-nav > a.nav-book, .book-white .main-nav > a.nav-book { color: #2b1e0b !important; font-weight: 800; }

/* ---------- booking page: banner of the chosen occasion ---------- */
.book-hero.has-event { padding: 30px 0; text-align: right; }
.bh-event { display: grid; grid-template-columns: 300px 1fr; gap: 28px; align-items: center; }
.bh-media { position: relative; display: flex; flex-direction: column; align-items: center; }
.bh-img { width: 100%; aspect-ratio: 1.45; border-radius: 18px; overflow: hidden; position: relative; background: #1a150e center/cover no-repeat; border: 1px solid rgba(217,173,92,.45); box-shadow: 0 18px 40px -18px rgba(0,0,0,.6); }
.bh-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, rgba(18,14,9,.6) 75%, rgba(18,14,9,.95) 100%); }
.bh-img.no-img { background: radial-gradient(circle at 50% 40%, #3a2a14, #18120b 70%); }
.bh-ic { position: relative; z-index: 1; margin-top: -32px; width: 62px; height: 62px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: rgba(20,15,9,.92); border: 1.5px solid var(--gold); color: var(--gold-hi, #f0d08e); box-shadow: 0 6px 18px rgba(0,0,0,.5); }
.bh-ic svg { width: 28px; height: 28px; }
.bh-kicker { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; color: var(--gold, #d9ad5c); background: rgba(217,173,92,.12); border: 1px solid rgba(217,173,92,.35); padding: 4px 12px; border-radius: 20px; }
.book-hero .bh-txt h1 { margin: 10px 0 2px; }
.book-hero .bh-txt p { margin: 0; max-width: none; }
.book-hero .bh-sub { font-weight: 700; color: #e8cf98; margin-bottom: 10px !important; }
.book-hero .bh-desc { line-height: 1.9; white-space: pre-line; }
.bh-change { margin-top: 14px; display: inline-flex; align-items: center; gap: 6px; background: transparent; border: 1px solid rgba(217,173,92,.55); color: var(--gold, #d9ad5c); padding: 7px 14px; border-radius: 10px; font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.bh-change:hover { background: rgba(217,173,92,.12); }
.theme-light .book-hero .bh-sub { color: #9a6f23; }
.theme-light .bh-img { border-color: #e7d3a8; box-shadow: 0 16px 34px -20px rgba(80,56,20,.45); }
.theme-light .bh-kicker, .theme-light .bh-change { color: #9a6f23; border-color: #e2c78f; background: #fdf6e6; }
@media (max-width: 760px) {
  .bh-event { grid-template-columns: 1fr; gap: 16px; }
  .book-hero.has-event { padding: 20px 0; }
}
.tr-note { display: flex; gap: 12px; align-items: flex-start; margin: 14px 0 0; padding: 14px 16px; border-radius: 14px; background: rgba(217,173,92,.1); border: 1px solid rgba(217,173,92,.35); }
.tr-note > span { color: var(--gold, #d9ad5c); flex: none; margin-top: 2px; }
.tr-note b { display: block; margin-bottom: 2px; }
.tr-note p { margin: 0; line-height: 1.8; }
.tr-live, .tr-when { font-size: 12.5px; margin: 10px 0 0; display: flex; align-items: center; gap: 5px; justify-content: center; }
.bh-img.is-seed { background-size: 147% auto; background-position: 50% 0; }

/* desktop hero with the admin's own background picture (Admin > الواجهة والمظهر) */
@media (min-width: 1100px) {
  .theme-dark .hero.hero-custom { background-image: url('../img/seed/hero-base.webp'); }
  .theme-dark .hero.hero-custom .hero-photo { display: block; inset: 0 auto 0 35.5%; width: 44%; height: auto; background-size: cover; background-position: center 28%;
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 16%, #000 84%, transparent 100%), linear-gradient(to bottom, #000 72%, transparent 100%);
    -webkit-mask-composite: source-in; mask-image: linear-gradient(to right, transparent 0, #000 16%, #000 84%, transparent 100%), linear-gradient(to bottom, #000 72%, transparent 100%); mask-composite: intersect; }
}
/* privacy page */
.legal h2 { font-family: var(--head); font-size: 20px; margin: 26px 0 8px; color: #9a6c25; }
.legal p, .legal li { line-height: 1.95; }
.legal ul { padding-inline-start: 20px; margin: 0 0 6px; }
.theme-dark.bg-black .legal h2 { color: var(--gold); }
.ft-copy a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
/* inside the installed app the «get the app» button is pointless */
@media (display-mode: standalone) { .get-app { display: none !important; } }
/* the closed phone menu sits just outside the screen: no shadow on the page edge, not reachable by keyboard */
@media (max-width: 1180px) {
  .main-nav:not(.open) { box-shadow: none; visibility: hidden; transition: transform .3s, visibility 0s .3s; }
  .main-nav.open { visibility: visible; transition: transform .3s; }
}
/* home background pictures: several pictures fade into each other */
.hero .hero-photo { opacity: 0; transition: opacity 1.2s ease; }
.hero .hero-photo.on { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .hero .hero-photo { transition: none; } }