/* ════════════════════════════════════════════════
   VAYAN — تصميم «رحلة فايان» لثيم سلة
   الصق هذا كاملاً في: تخصيص متقدم ← تخصيص باستخدام CSS
   ════════════════════════════════════════════════ */
@import url("https://fonts.googleapis.com/css2?family=Amiri:wght@400;700&family=Bodoni+Moda:ital,opsz,wght@0,6..96,400;0,6..96,500;1,6..96,400&family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans+Arabic:wght@300;400;500;600&family=Montserrat:wght@300;400;500;600&display=swap");

/* ── ألوان وخطوط فايان ── */
.vy {
  --vayan-white:#fefbf6; --vayan-black:#242322; --vayan-cream:#fff8f2;
  --paper:#fefbf6; --paper-2:#f4f3f1; --ink:#242322; --ink-muted:#6b6865; --line:#e8e4de;
  --inverse:#242322; --on-inverse:#fff8f2;
  --font-display:"Bodoni Moda","Amiri",Didot,serif;
  --font-sans:"Montserrat","IBM Plex Sans Arabic",system-ui,sans-serif;
}

/* ── الثيم كله: أبيض وأسود، حواف حادة ── */
:root {
  --color-primary:#242322 !important; --color-primary-dark:#000000 !important;
  --color-primary-light:#3a3937 !important; --color-primary-reverse:#fff8f2 !important;
  --s-radius:0px !important;
}
body { background:#fefbf6 !important; }

/* ── يمتد بعرض الشاشة حتى لو الثيم داخل حاوية ── */
.vy-root { width:100vw; position:relative; inset-inline-start:50%; margin-inline-start:-50vw; overflow:hidden; direction:rtl; text-align:right; }
.vy-root * { letter-spacing:inherit; }
.vy-root h2, .vy-root h3 { color:inherit; }
.vy-root img { max-width:none; }
.vy-root s { opacity:.5; margin-inline-start:6px; font-size:.85em; }
.vy-root .vy-btn.vy-out { opacity:.55; }
.vy-root .vy-board-table, .vy-root .vy-pass-route, .vy-root .vy-board-clock { text-align:left; }
/* ── base ─────────────────────────────────────────── */
.vy, .vy * { box-sizing: border-box; }
.vy { font-family: var(--font-sans); color: var(--ink); background: var(--paper); font-weight: 300; line-height: 1.7; -webkit-font-smoothing: antialiased; }
.vy a { color: inherit; text-decoration: none; }
.vy button { font: inherit; color: inherit; }
.vy :focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.vy-label { font-family: var(--font-sans); font-size: 11px; line-height: 16px; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; }
.vy-serif { font-family: var(--font-display); font-weight: 400; }
.vy-ltr { direction: ltr; unicode-bidi: isolate; }

/* ── Button ───────────────────────────────────────── */
.vy-btn { appearance: none; border-radius: 0; border: 1px solid currentColor; background: transparent; color: inherit; font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; padding: 16px 30px; cursor: pointer; display: inline-flex; align-items: center; gap: 12px; position: relative; overflow: hidden; isolation: isolate; transition: color .35s; }
.vy-btn::before { content: ""; position: absolute; inset: 0; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .35s cubic-bezier(.7,0,.2,1); z-index: -1; }
.vy-btn:hover::before { transform: scaleX(1); transform-origin: left; }
.vy-btn:hover { color: var(--btn-hover-ink, var(--paper)); }
.vy-btn-solid { background: var(--inverse); color: var(--on-inverse); border-color: var(--inverse); }
.vy-btn-solid::before { background: var(--paper); }
.vy-btn-solid:hover { color: var(--ink); }
.vy-btn-arrow { display: inline-block; transition: transform .35s; }
.vy-btn:hover .vy-btn-arrow { transform: translateX(-6px); }
.vy-btn-sm { padding: 10px 18px; font-size: 11px; }

/* ── Ticker ───────────────────────────────────────── */
.vy-ticker { background: var(--vayan-black); color: var(--vayan-cream); overflow: hidden; white-space: nowrap; height: 36px; display: flex; align-items: center; }
.vy-ticker-track { display: inline-flex; gap: 48px; padding-inline-start: 48px; animation: vy-slide 38s linear infinite; }
.vy-ticker-track span { display: inline-flex; gap: 48px; align-items: center; }
.vy-ticker-track i { font-style: normal; opacity: .45; }
@keyframes vy-slide { from { transform: translateX(0); } to { transform: translateX(50%); } }

/* ── HeroSplit ────────────────────────────────────── */
.vy-hero { position: relative; height: 820px; overflow: hidden; direction: ltr; background: var(--vayan-white); }
.vy-hero-half { position: absolute; top: 0; bottom: 0; width: 50%; }
.vy-hero-half.dark { left: 0; background: var(--vayan-black); }
.vy-hero-half.light { right: 0; background: var(--vayan-white); }
.vy-hero-bottle { position: absolute; bottom: 104px; height: 610px; width: auto; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.vy-hero-bottle.l { right: calc(50% + 46px); transform: rotate(-4deg); transform-origin: bottom center; }
.vy-hero-bottle.r { left: calc(50% + 46px); transform: rotate(4deg); transform-origin: bottom center; }
.vy-hero:hover .vy-hero-bottle.l { transform: rotate(0deg) translateY(-8px); }
.vy-hero:hover .vy-hero-bottle.r { transform: rotate(0deg) translateY(-8px); }
.vy-hero-mark { position: absolute; left: 50%; top: 236px; width: 1180px; transform: translateX(-50%); mix-blend-mode: difference; pointer-events: none; z-index: 2; }
.vy-hero-mark img { display: block; width: 100%; height: auto; }
.vy-hero-seam { position: absolute; left: 50%; top: 110px; transform: translateX(-50%); z-index: 3; color: #ffffff; mix-blend-mode: difference; text-align: center; white-space: nowrap; }
.vy-hero-foot { position: absolute; left: 0; right: 0; bottom: 0; height: 104px; display: grid; grid-template-columns: 1fr 1fr; z-index: 3; }
.vy-hero-cell { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 40px; border-top: 1px solid; direction: rtl; }
.vy-hero-cell.dark { color: var(--vayan-cream); border-color: rgba(255,248,242,.22); --btn-hover-ink: var(--vayan-black); }
.vy-hero-cell.light { color: var(--vayan-black); border-color: rgba(36,35,34,.18); --btn-hover-ink: var(--vayan-white); }
.vy-hero-cell .n { font-family: var(--font-display); font-size: 24px; line-height: 30px; }
.vy-hero-cell .p { font-family: "IBM Plex Mono", monospace; font-size: 13px; opacity: .75; margin: 0 14px; }

/* ── Uses ─────────────────────────────────────────── */
.vy-uses { padding: 140px 40px 120px; text-align: center; background: var(--paper); }
.vy-uses h2 { font-family: var(--font-display); font-weight: 400; font-size: 64px; line-height: 84px; margin: 18px auto 88px; max-width: 900px; }
.vy-uses h2 em { font-style: italic; color: var(--ink-muted); }
.vy-uses-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.vy-use { padding: 36px 32px 0; text-align: start; border-inline-start: 1px solid var(--line); }
.vy-use:first-child { border-inline-start: 0; }
.vy-use .num { font-family: var(--font-display); font-size: 150px; line-height: 1; display: block; letter-spacing: -.04em; direction: ltr; text-align: end; -webkit-text-stroke: 1px var(--ink); color: transparent; transition: color .4s; }
.vy-use:hover .num { color: var(--ink); }
.vy-use h3 { font-family: var(--font-display); font-weight: 400; font-size: 32px; line-height: 44px; margin: 18px 0 6px; }
.vy-use p { margin: 0; color: var(--ink-muted); font-size: 15px; }

/* ── DepartureBoard ───────────────────────────────── */
.vy-board { background: var(--vayan-black); color: var(--vayan-cream); padding: 110px 40px 120px; }
.vy-board-head { display: flex; justify-content: space-between; align-items: end; margin-bottom: 44px; }
.vy-board-head h2 { font-family: var(--font-display); font-weight: 400; font-size: 56px; line-height: 64px; margin: 10px 0 0; }
.vy-board-clock { font-family: "IBM Plex Mono", monospace; font-size: 40px; line-height: 1; letter-spacing: .06em; direction: ltr; }
.vy-board-clock small { display: block; font-family: var(--font-sans); font-size: 11px; letter-spacing: .22em; opacity: .55; margin-top: 10px; text-align: end; }
.vy-board-table { direction: ltr; border-top: 1px solid rgba(255,248,242,.25); }
.vy-board-row { display: grid; grid-template-columns: 120px 1.3fr 1.6fr 80px 210px 150px; align-items: center; gap: 20px; padding: 18px 0; border-bottom: 1px solid rgba(255,248,242,.14); transition: background .3s; }
.vy-board-row.th { padding: 12px 0; color: rgba(255,248,242,.55); }
.vy-board-row:not(.th):hover { background: rgba(255,248,242,.04); }
.vy-board-row .ar { display: block; direction: rtl; text-align: left; font-family: var(--font-sans); font-size: 13px; color: rgba(255,248,242,.6); margin-top: 6px; letter-spacing: 0; }
.vy-flap { display: inline-flex; gap: 2px; font-family: "IBM Plex Mono", monospace; font-weight: 500; font-size: 17px; line-height: 1; text-transform: uppercase; }
.vy-flap span { display: inline-flex; justify-content: center; align-items: center; width: 17px; height: 28px; background: #2f2e2c; color: var(--vayan-cream); position: relative; }
.vy-flap span::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: rgba(0,0,0,.55); }
.vy-flap span.sp { background: transparent; }
.vy-flap span.sp::after { display: none; }
.vy-flap span.go { animation: vy-flip .08s linear; }
@keyframes vy-flip { 0% { transform: scaleY(1); } 50% { transform: scaleY(.15); } 100% { transform: scaleY(1); } }
.vy-flap.sm span { width: 13px; height: 22px; font-size: 12px; }
.vy-status { display: inline-flex; align-items: center; gap: 10px; }
.vy-status::before { content: ""; width: 7px; height: 7px; border-radius: 999px; background: var(--vayan-cream); animation: vy-blink 1.6s steps(2) infinite; }
.vy-status.soon::before { background: transparent; border: 1px solid var(--vayan-cream); animation: none; }
@keyframes vy-blink { 50% { opacity: .15; } }
.vy-board-row .vy-btn { justify-self: end; white-space: nowrap; color: var(--vayan-cream); --btn-hover-ink: var(--vayan-black); }
.vy-board-row .vy-btn[disabled] { opacity: .35; pointer-events: none; }

/* ── Chapter ──────────────────────────────────────── */
.vy-chapter { display: grid; grid-template-columns: 1fr 1fr; min-height: 860px; position: relative; overflow: hidden; }
.vy-chapter.light { background: var(--vayan-white); color: var(--vayan-black); --btn-hover-ink: var(--vayan-white); --line-c: rgba(36,35,34,.2); --muted: #6b6865; }
.vy-chapter.dark { background: var(--vayan-black); color: var(--vayan-cream); --btn-hover-ink: var(--vayan-black); --line-c: rgba(255,248,242,.22); --muted: #a8a39e; }
.vy-chapter-art { position: relative; display: flex; align-items: center; justify-content: center; }
.vy-chapter-ghost { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-size: 520px; line-height: 1; color: transparent; -webkit-text-stroke: 1px var(--line-c); direction: ltr; user-select: none; pointer-events: none; }
.vy-chapter-bottle { position: relative; height: 620px; width: auto; z-index: 1; transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.vy-chapter:hover .vy-chapter-bottle { transform: translateY(-10px) rotate(-2deg); }
.vy-postcard { position: absolute; z-index: 2; width: 260px; background: #ffffff; padding: 10px 10px 34px; border: 1px solid rgba(36,35,34,.15); transform: rotate(5deg); bottom: 70px; inset-inline-start: 56px; transition: transform .6s cubic-bezier(.2,.7,.2,1); color: #242322; }
.vy-chapter.flip .vy-postcard { transform: rotate(-5deg); inset-inline-start: auto; inset-inline-end: 56px; }
.vy-chapter:not(.flip) .vy-chapter-art { padding-inline-start: 150px; }
.vy-chapter.flip .vy-chapter-art { padding-inline-end: 150px; }
.vy-postcard:hover { transform: rotate(0) scale(1.04) !important; }
.vy-postcard img { display: block; width: 100%; height: 300px; object-fit: cover; object-position: right; }
.vy-postcard .cap { position: absolute; bottom: 10px; inset-inline: 12px; display: flex; justify-content: space-between; font-family: "IBM Plex Mono", monospace; font-size: 10px; letter-spacing: .12em; }
.vy-stamp { position: absolute; top: -14px; inset-inline-start: -14px; width: 64px; height: 76px; background: #fefbf6; border: 2px dashed #242322; display: flex; flex-direction: column; align-items: center; justify-content: center; transform: rotate(-12deg); font-family: var(--font-display); font-size: 22px; line-height: 1; color: #242322; }
.vy-stamp small { font-family: "IBM Plex Mono", monospace; font-size: 8px; letter-spacing: .1em; margin-top: 6px; }
.vy-chapter-copy { padding: 120px 64px 100px; display: flex; flex-direction: column; justify-content: center; }
.vy-chapter-copy .kicker { display: flex; justify-content: space-between; color: var(--muted); }
.vy-chapter-copy h2 { font-family: var(--font-display); font-weight: 400; font-size: 104px; line-height: 1.05; margin: 22px 0 4px; }
.vy-chapter-copy .en { font-family: var(--font-display); font-style: italic; font-size: 26px; color: var(--muted); direction: ltr; text-align: end; }
.vy-chapter-copy p.lede { margin: 26px 0 40px; font-size: 17px; line-height: 30px; max-width: 440px; color: var(--muted); }
.vy-route { list-style: none; margin: 0 0 44px; padding: 0; position: relative; counter-reset: stop; }
.vy-route::before { content: ""; position: absolute; top: 14px; bottom: 14px; inset-inline-start: 5px; width: 0; border-inline-start: 1px dashed var(--line-c); }
.vy-route li { position: relative; display: grid; grid-template-columns: 30px 1fr auto; gap: 12px; align-items: center; padding: 9px 0; counter-increment: stop; }
.vy-route li::before { content: ""; width: 11px; height: 11px; border-radius: 999px; border: 1px solid currentColor; background: var(--route-bg, transparent); position: relative; z-index: 1; transition: background .3s; }
.vy-chapter.light .vy-route li::before { background: var(--vayan-white); }
.vy-chapter.dark .vy-route li::before { background: var(--vayan-black); }
.vy-route li:first-child::before, .vy-route li:last-child::before { background: currentColor !important; }
.vy-route li:hover::before { background: currentColor !important; }
.vy-route .stop { font-family: var(--font-display); font-size: 26px; line-height: 34px; }

.vy-route .meta { white-space: nowrap; font-family: "IBM Plex Mono", monospace; font-size: 11px; letter-spacing: .1em; color: var(--muted); direction: ltr; }
.vy-route .meta::before { content: counter(stop, decimal-leading-zero) " · "; }
.vy-chapter-buy { display: flex; align-items: center; gap: 24px; }
.vy-chapter-buy .price { font-family: "IBM Plex Mono", monospace; font-size: 15px; }

/* ── BoardingPass ─────────────────────────────────── */
.vy-pass-wrap { background: var(--paper-2); padding: 130px 40px; text-align: center; }
.vy-pass-wrap h2 { font-family: var(--font-display); font-weight: 400; font-size: 64px; line-height: 76px; margin: 14px 0 12px; }
.vy-pass-wrap > p { margin: 0 auto 64px; color: var(--ink-muted); max-width: 460px; }
.vy-pass { --notch: var(--paper-2); display: grid; grid-template-columns: 1fr 270px; max-width: 980px; margin: 0 auto; text-align: start; color: var(--vayan-black); transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.vy-pass:hover { transform: rotate(-1deg) translateY(-6px); }
.vy-pass-main, .vy-pass-stub { background: var(--vayan-white); position: relative; }
.vy-pass-main { padding: 34px 40px 36px; background:
  radial-gradient(circle at 100% 0, var(--notch) 14px, transparent 15px) top right / 51% 51% no-repeat,
  radial-gradient(circle at 100% 100%, var(--notch) 14px, transparent 15px) bottom right / 51% 51% no-repeat,
  var(--vayan-white); }
.vy-pass-stub { padding: 34px 30px 36px; border-inline-start: 2px dashed rgba(36,35,34,.3); display: flex; flex-direction: column; justify-content: space-between; background:
  radial-gradient(circle at 0 0, var(--notch) 14px, transparent 15px) top left / 51% 51% no-repeat,
  radial-gradient(circle at 0 100%, var(--notch) 14px, transparent 15px) bottom left / 51% 51% no-repeat,
  var(--vayan-white); }
.vy-pass-top { display: flex; justify-content: space-between; align-items: center; padding-bottom: 22px; border-bottom: 1px solid rgba(36,35,34,.15); }
.vy-pass-top img { height: 22px; width: auto; }
.vy-pass-route { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; padding: 30px 0; direction: ltr; }
.vy-pass-route .city { font-family: var(--font-display); font-size: 64px; line-height: 1; }
.vy-pass-route .city small { display: block; font-family: var(--font-sans); font-size: 14px; margin-top: 10px; color: #6b6865; direction: rtl; text-align: left; }
.vy-pass-route .city.to { text-align: right; }
.vy-pass-route .city.to small { text-align: right; }
.vy-pass-route .path { display: flex; align-items: center; gap: 10px; width: 200px; }
.vy-pass-route .path::before, .vy-pass-route .path::after { content: ""; flex: 1; border-top: 1px dashed #242322; }
.vy-pass-route .path svg { width: 26px; height: 26px; fill: #242322; transform: rotate(90deg); }
.vy-pass-fields { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; border-top: 1px solid rgba(36,35,34,.15); padding-top: 22px; }
.vy-pass-fields dt { color: #6b6865; margin-bottom: 6px; }
.vy-pass-fields dd { margin: 0; font-family: var(--font-display); font-size: 22px; line-height: 28px; }
.vy-pass-stub .big { white-space: nowrap; font-family: var(--font-display); font-size: 46px; line-height: 1; }
.vy-pass-stub .big small { display: block; font-family: "IBM Plex Mono", monospace; font-size: 12px; letter-spacing: .12em; margin-top: 10px; color: #6b6865; }
.vy-pass-stub .vy-btn { --btn-hover-ink: var(--vayan-white); justify-content: center; }
.vy-pass-code { display: flex; gap: 3px; height: 34px; align-items: stretch; direction: ltr; }
.vy-pass-code i { display: block; background: #242322; }

/* ── WordmarkMarquee ──────────────────────────────── */
.vy-mq { background: var(--paper); padding: 26px 0; overflow: hidden; border-block: 1px solid var(--line); direction: ltr; }
.vy-mq-row { display: flex; width: max-content; gap: 44px; padding: 8px 0; animation: vy-mq 40s linear infinite; }
.vy-mq-row.rev { animation-direction: reverse; animation-duration: 52s; }
.vy-mq-row img { height: 58px; width: auto; display: block; }
.vy-mq-row img:nth-child(3n+2) { opacity: .16; }
.vy-mq .l-dark { display: none; }
@keyframes vy-mq { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* ── شاشات متوسطة ── */
@media (max-width:1240px) {
  .vy-hero-mark { width:92vw; top:30%; }
  .vy-hero-bottle { height:min(610px,62vw); }
  .vy-board-row { grid-template-columns:90px 1.1fr 1.6fr 150px 150px; }
  .vy-board-row > :nth-child(4) { display:none; }
  .vy-chapter-copy h2 { font-size:80px; }
}

/* ── الجوال ── */
@media (max-width:760px) {
  .vy-hero { height:640px; }
  .vy-hero-bottle { height:330px; bottom:150px; }
  .vy-hero-bottle.l { right:calc(50% + 14px); }
  .vy-hero-bottle.r { left:calc(50% + 14px); }
  .vy-hero-mark { width:94vw; top:210px; }
  .vy-hero-seam { top:40px; font-size:9px; }
  .vy-hero-foot { grid-template-columns:1fr; height:140px; }
  .vy-hero-cell { padding:0 16px; }
  .vy-hero-cell.dark { background:var(--vayan-black); }
  .vy-hero-cell.light { background:var(--vayan-white); }
  .vy-hero-cell .n { font-size:19px; }
  .vy-uses { padding:80px 20px 70px; }
  .vy-uses h2 { font-size:38px; line-height:52px; margin-bottom:40px; }
  .vy-uses-grid { grid-template-columns:1fr; }
  .vy-use { border-inline-start:0; border-bottom:1px solid var(--line); padding:24px 0; display:grid; grid-template-columns:auto 1fr; column-gap:20px; align-items:center; }
  .vy-use .num { font-size:72px; grid-row:span 2; }
  .vy-use h3 { margin:0; font-size:26px; }
  .vy-board { padding:72px 16px 80px; }
  .vy-board-head h2 { font-size:38px; line-height:46px; }
  .vy-board-clock { font-size:26px; }
  .vy-board-row { grid-template-columns:1fr auto; gap:10px 12px; }
  .vy-board-row.th { display:none; }
  .vy-board-row > :nth-child(1), .vy-board-row > :nth-child(3), .vy-board-row > :nth-child(4) { display:none; }
  .vy-board-row > :nth-child(2) { grid-column:1; }
  .vy-board-row .vy-status { grid-column:1; }
  .vy-board-row .vy-btn { grid-row:1 / span 2; grid-column:2; }
  .vy-flap span { width:14px; height:24px; font-size:14px; }
  .vy-chapter { grid-template-columns:1fr; min-height:0; }
  .vy-chapter.flip > :first-child { order:2; }
  .vy-chapter-art { min-height:520px; padding:0 !important; }
  .vy-chapter-ghost { font-size:300px; }
  .vy-chapter-bottle { height:400px; margin-inline-start:120px; }
  .vy-chapter:hover .vy-chapter-bottle { transform:none; }
  .vy-postcard { width:150px; bottom:20px; inset-inline-start:16px !important; inset-inline-end:auto !important; }
  .vy-postcard img { height:170px; }
  .vy-stamp { width:48px; height:58px; font-size:16px; }
  .vy-chapter-copy { padding:48px 20px 64px; }
  .vy-chapter-copy h2 { font-size:58px; }
  .vy-route .stop { font-size:22px; }
  .vy-pass-wrap { padding:80px 16px; }
  .vy-pass-wrap h2 { font-size:42px; line-height:52px; }
  .vy-pass { grid-template-columns:1fr; }
  .vy-pass-main { padding:24px 20px; background:var(--vayan-white); }
  .vy-pass-stub { border-inline-start:0; border-top:2px dashed rgba(36,35,34,.3); padding:24px 20px; gap:18px; background:var(--vayan-white); }
  .vy-pass-route .city { font-size:36px; }
  .vy-pass-route .path { width:70px; }
  .vy-pass-fields { grid-template-columns:1fr 1fr; }
  .vy-mq-row img { height:36px; }
}
@media (prefers-reduced-motion:reduce) {
  .vy-ticker-track, .vy-mq-row, .vy-status::before { animation:none !important; }
}

/* ── سولو: صورة المنتج تندمج مع الخلفية ── */
.vy-chapter-art:has(.is-photo) { padding:0 !important; }
.vy-chapter { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
.vy-chapter-bottle.is-photo { mix-blend-mode:multiply; width:100%; max-width:600px; height:auto; }
.vy-btn { white-space:nowrap; }
.vy-route .stop { white-space:nowrap; }

/* ── إخفاء أقسام الثيم في الرئيسية ── */
body.index .store-content > .hero-area { display:none !important; }
body.index #main-content > :not(.vy-root):not(salla-hook) { display:none !important; }
footer.store-footer .grid-cols-12 > div:first-child { display:none !important; }

/* ── الجوال: الأزرار لا تبقى ممتلئة بعد اللمس ── */
@media (hover:none) {
  .vy-btn::before { display:none; }
  .vy-btn:hover { color:inherit; }
  .vy-btn:hover .vy-btn-arrow { transform:none; }
}
@media (max-width:760px) {
  .vy-chapter { grid-template-columns:1fr; }
  .vy-chapter-bottle.is-photo { width:90%; max-width:420px; margin-inline-start:0; }
}

/* ── إخفاء «اطلبها مجدداً» وأي إضافات أسفل الرئيسية ── */
body.index #main-content salla-hook, body.index #main-content > * { display:none !important; }

/* ── التذييل الجديد ── */
body.vy-has-foot .footer-wrapper { display:none !important; }
.vy-foot { background:var(--vayan-black); color:var(--vayan-cream); overflow:hidden; direction:rtl; text-align:right; --btn-hover-ink:var(--vayan-black); }
.vy-foot a { color:inherit; text-decoration:none; }
.vy-foot-social { padding:110px 40px 80px; text-align:center; border-bottom:1px solid rgba(255,248,242,.16); }
.vy-foot-social .vy-label { opacity:.6; }
.vy-foot-social h2 { font-family:var(--font-display); font-weight:400; font-size:56px; line-height:68px; margin:14px 0 48px; color:var(--vayan-cream); }
.vy-socs { display:grid; grid-template-columns:1fr 1fr; gap:20px; max-width:860px; margin:0 auto; }
.vy-soc { display:flex; align-items:center; gap:20px; padding:28px 30px; border:1px solid rgba(255,248,242,.35); position:relative; overflow:hidden; isolation:isolate; transition:color .4s; text-align:right; }
.vy-soc::before { content:""; position:absolute; inset:0; background:var(--vayan-cream); transform:scaleY(0); transform-origin:bottom; transition:transform .45s cubic-bezier(.7,0,.2,1); z-index:-1; }
.vy-soc:hover::before { transform:scaleY(1); }
.vy-soc:hover { color:var(--vayan-black); }
.vy-soc svg { width:44px; height:44px; flex:none; fill:none; stroke:currentColor; stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; }
.vy-soc svg .f { fill:currentColor; stroke:none; }
.vy-soc .t { display:flex; flex-direction:column; flex:1; }
.vy-soc .t b { font-family:var(--font-display); font-weight:400; font-size:30px; line-height:36px; }
.vy-soc .t span { font-family:"IBM Plex Mono",monospace; font-size:13px; opacity:.7; text-align:right; }
.vy-soc .go { font-size:22px; transition:transform .4s; }
.vy-soc:hover .go { transform:translateX(-8px); }
.vy-foot-grid { display:grid; grid-template-columns:1fr 1fr 1.1fr; gap:40px; padding:64px 40px; align-items:start; }
.vy-foot-grid h5 { margin:0 0 18px; color:#a8a39e; }
.vy-foot-grid ul { list-style:none; margin:0; padding:0; display:grid; gap:12px; font-size:15px; }
.vy-foot-grid ul a { display:inline-flex; gap:10px; align-items:baseline; border-bottom:1px solid transparent; transition:border-color .3s; }
.vy-foot-grid ul a:hover { border-bottom-color:currentColor; }
.vy-foot-grid ul .vy-ltr { font-family:"IBM Plex Mono",monospace; font-size:13px; opacity:.75; }
.vy-cr { justify-self:end; display:flex; flex-direction:column; gap:8px; padding:22px 26px; border:2px dashed rgba(255,248,242,.45); transform:rotate(-2deg); transition:transform .4s; min-width:250px; }
.vy-cr:hover { transform:rotate(0); }
.vy-cr .vy-label { opacity:.65; }
.vy-cr b { font-family:"IBM Plex Mono",monospace; font-weight:500; font-size:26px; letter-spacing:.12em; text-align:right; }
.vy-cr small { font-size:12px; opacity:.6; }
.vy-foot-pay { padding:0 40px 36px; }
.vy-foot-pay salla-payments, .vy-foot-pay ul { display:flex !important; flex-wrap:wrap; gap:10px; justify-content:flex-start; list-style:none; margin:0; padding:0; }
.vy-foot-pay img { background:#fff; padding:4px 8px; height:34px; width:auto; border-radius:0; }
.vy-foot-base { display:flex; justify-content:space-between; gap:16px; padding:20px 40px; border-top:1px solid rgba(255,248,242,.16); font-size:12px; color:#a8a39e; }
.vy-foot-giant { display:block; width:calc(100% - 40px); margin:24px auto -6%; height:auto; opacity:.97; }

@media (max-width:760px) {
  .vy-foot-social { padding:72px 16px 56px; }
  .vy-foot-social h2 { font-size:38px; line-height:48px; margin-bottom:32px; }
  .vy-socs { grid-template-columns:1fr; gap:12px; }
  .vy-soc { padding:20px; }
  .vy-soc .t b { font-size:24px; }
  .vy-foot-grid { grid-template-columns:1fr 1fr; gap:32px 20px; padding:48px 16px; }
  .vy-cr { grid-column:1 / -1; justify-self:start; }
  .vy-foot-pay { padding:0 16px 28px; }
  .vy-foot-base { flex-direction:column; padding:18px 16px; }
}
@media (hover:none) { .vy-soc::before { display:none; } .vy-soc:hover { color:inherit; } }

/* ── التباعد للإنجليزي فقط ── */
.vy-label, .vy-btn, .vy-soc > span { letter-spacing:0 !important; }
.vy-label .vy-lat { letter-spacing:.22em; }
.vy-btn .vy-lat { letter-spacing:.14em; }
.vy-soc > span .vy-lat { letter-spacing:.2em; }
.vy-foot-grid ul .vy-ltr { font-family:var(--font-sans) !important; font-size:15px !important; opacity:.85; }

/* ── السوشل: معرّف كبير + أيقونات دائرية ── */
.vy-foot-social { padding:110px 24px 90px; }
.vy-handle { display:block; font-family:var(--font-display); font-weight:400; font-size:clamp(52px, 10vw, 128px); line-height:1.02; margin:22px auto 40px; color:var(--vayan-cream); transition:opacity .3s; }
.vy-handle:hover { opacity:.7; }
.vy-socs { display:flex !important; justify-content:center; gap:36px; max-width:none !important; }
.vy-soc { flex-direction:column; align-items:center; gap:12px; padding:0 !important; border:0 !important; text-align:center; }
.vy-soc::before { display:none !important; }
.vy-soc:hover { color:inherit !important; }
.vy-soc svg { width:28px; height:28px; padding:22px; box-sizing:content-box; border:1px solid rgba(255,248,242,.5); border-radius:999px; transition:background .35s, color .35s, transform .35s; }
.vy-soc:hover svg { background:var(--vayan-cream); color:var(--vayan-black); transform:translateY(-4px); }
.vy-soc > span { font-size:11px; text-transform:uppercase; opacity:.7; }
@media (max-width:760px) { .vy-foot-social { padding:80px 16px 64px; } .vy-socs { gap:28px; } }