:root{
  --accent:#C9A96E;
  --ink:#0B1622;
  --ivory:#F4EFE6;
  --muted:rgba(244,239,230,.72);
  --panel:#0B121A;
  --hair:rgba(244,239,230,.16);
  --ml:clamp(20px,5.5vw,80px);
  --mr:clamp(20px,10.4vw,150px);
  --serif:"Cormorant Garamond","Cormorant",Garamond,"EB Garamond","Times New Roman",Times,serif;
  --sans:Manrope,"Helvetica Neue",Helvetica,Arial,system-ui,sans-serif;
  --ease:cubic-bezier(.2,.7,.2,1);
}
html{scroll-behavior:smooth;scroll-snap-type:y proximity;background:#05090E}
body{margin:0;-webkit-text-size-adjust:100%;text-size-adjust:100%;background:#05090E;color:var(--ivory);font-family:var(--sans);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.vl{text-align:right}
.vl *,.vl *::before,.vl *::after{box-sizing:border-box}
.vl a{color:inherit;text-decoration:none}
.vl h1,.vl h2,.vl h3,.vl p,.vl blockquote,.vl figure{margin:0}
.vl h1,.vl h2,.vl h3,.vl h4{color:inherit;text-transform:none}
.vl blockquote{border:0;padding:0;font-style:normal}
.vl hr{opacity:1;color:inherit}
.vl img{display:block;max-width:100%}
.vl button,.vl input,.vl select{font:inherit;color:inherit}
.vl em{font-style:italic;font-weight:400}
.vl-serif{font-family:var(--serif);font-weight:500;letter-spacing:-.01em}
.vl-shadowed{text-shadow:0 2px 24px rgba(0,0,0,.35)}
.vl-glass{background:rgba(8,15,22,.42);-webkit-backdrop-filter:blur(18px) saturate(120%);backdrop-filter:blur(18px) saturate(120%);border:1px solid var(--hair)}
.vl-label{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
.vl-eyebrow{display:flex;align-items:right;gap:16px;color:var(--accent);font-size:12px;font-weight:600;letter-spacing:.28em;text-transform:uppercase}
.vl-eyebrow::before{content:"";width:40px;height:1px;background:var(--accent)}

/* Odoo host: let the block run full-bleed if it sits inside an Embed Code snippet */
.s_embed_code:has(.vl),.s_embed_code_embedded:has(.vl){padding:0 !important;max-width:none !important;width:100% !important;background:transparent !important}
#wrapwrap:has(.vl),#wrap:has(.vl){background:transparent !important}

/* Video layer */
.vl-bg{position:fixed;inset:0;z-index:0;overflow:hidden;background:#05090E}
.vl-bg video{width:100%;height:100%;object-fit:cover;display:block}
.vl-scrim{position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(to left,rgba(3,8,13,.78) 0%,rgba(3,8,13,.35) 32%,rgba(3,8,13,0) 55%),
  linear-gradient(to top,rgba(3,8,13,.8) 0%,rgba(3,8,13,0) 38%),
  linear-gradient(to bottom,rgba(3,8,13,.55) 0%,rgba(3,8,13,0) 18%)}

/* Chrome */
.vl-hdr{position:fixed;top:0;left:0;right:0;z-index:30;height:96px;padding:0 40px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.vl-logo{justify-self:start;font-family:var(--serif);font-weight:500;font-size:21px;letter-spacing:.34em;padding:10px 14px 10px 24px;border-radius:999px;line-height:1.2}
.vl-nav{display:flex;gap:52px}
.vl-nav a{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ivory);opacity:.9;transition:color .3s,opacity .3s}
.vl-nav a:hover{color:var(--accent);opacity:1}
.vl-cta{justify-self:end;display:inline-flex;align-items:center;height:46px;padding:0 24px;border-radius:999px;background:var(--accent);color:var(--ink) !important;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;transition:background .3s}
.vl-cta:hover{background:#d8bb85}
.vl-index{position:fixed;left:40px;top:170px;z-index:30;display:flex;flex-direction:column;align-items:flex-end;gap:22px}
.vl-index a{display:flex;align-items:center;gap:12px;font-size:12px;font-weight:600;letter-spacing:.2em;color:rgba(244,239,230,.55);transition:color .35s}
.vl-index .vl-lbl{opacity:0;transform:translateX(-8px);transition:opacity .35s,transform .35s var(--ease);font-size:10px;letter-spacing:.24em}
.vl-index a.vl-active,.vl-index a:hover{color:var(--accent)}
.vl-index a.vl-active .vl-lbl{opacity:1;transform:none}

/* Sections */
main.vl-vl-main{position:relative;z-index:10;overflow-x:clip}
.vl-screen{position:relative;height:100vh;height:100svh;min-height:760px;scroll-snap-align:start}
/* doubled class beats Odoo's rule that makes every direct child of a section position:relative */
.vl .vl-grp{position:absolute}

/* Buttons */
.vl-btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;height:54px;padding:0 28px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;border:0;transition:background .3s,border-color .3s}
.vl-btn-solid{background:var(--accent);color:var(--ink) !important}
.vl-btn-solid:hover{background:#d8bb85}
.vl-btn-glass{padding-left:11px;color:var(--ivory)}
.vl-btn-glass:hover{background:rgba(8,15,22,.6)}
.vl-circ{display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:rgba(244,239,230,.14)}
.vl-ico{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* 01 Hero */
.vl-hero-copy{right:var(--ml);top:max(120px,calc(50vh - 250px));width:min(540px,80vw)}
.vl-hero-copy h1{font-size:clamp(56px,6.7vw,96px);line-height:.92;margin:26px 0 26px}
.vl-lede{font-size:16px;opacity:.88;max-width:400px}
.vl-ctas{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.vl-cue{right:var(--ml);bottom:56px;display:flex;align-items:center;gap:16px;font-size:11px;font-weight:600;letter-spacing:.24em;color:var(--muted)}
.vl-cue-line{width:1px;height:40px;background:rgba(244,239,230,.2);position:relative;overflow:hidden}
.vl-cue-line::after{content:"";position:absolute;inset:0;background:var(--ivory);transform-origin:top;animation:cue 2.2s var(--ease) infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}50.1%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@keyframes ldIn{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
.vl-ld1{animation:ldIn 1.1s var(--ease) .15s both}
.vl-ld2{animation:ldIn 1.15s var(--ease) .35s both}
.vl-ld3{animation:ldIn 1.2s var(--ease) .55s both}
.vl-ld4{animation:ldIn 1.2s var(--ease) .8s both}

/* Feature network over the hero */
/* doubled class: Odoo makes every direct child of a section position:relative */
.vl .vl-net{position:absolute;inset:0;z-index:1;overflow:hidden;opacity:0;transition:opacity .8s ease}
.vl-net.vl-net-ready{opacity:1}
.vl-net-lines{position:absolute;left:0;top:0;pointer-events:none}
.vl-node{position:absolute;left:0;top:0;width:var(--ns,60px);height:var(--ns,60px);border-radius:50%;display:grid;place-items:center;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;will-change:transform;
  background:rgba(8,15,22,.5);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--hair);box-shadow:0 10px 26px rgba(0,0,0,.3);transition:background .3s,border-color .3s,box-shadow .3s}
.vl-node img{width:60%;height:60%;object-fit:contain;pointer-events:none;-webkit-user-drag:none}
.vl-node.vl-hot{z-index:3;background:rgba(8,15,22,.78);border-color:rgba(201,169,110,.65);box-shadow:0 0 0 6px rgba(201,169,110,.14),0 18px 40px rgba(0,0,0,.45)}
.vl-node.vl-grab{cursor:grabbing}
.vl-node[data-label]:not([data-label=""])::after{content:attr(data-label) "\A" attr(data-cat);white-space:pre;text-align:center;line-height:1.6;position:absolute;top:100%;left:50%;margin-top:10px;transform:translateX(-50%) scale(.74);transform-origin:top center;padding:6px 14px;border-radius:14px;background:rgba(8,15,22,.86);border:1px solid var(--hair);color:var(--ivory);font-size:15px;font-weight:600;opacity:0;transition:opacity .25s;pointer-events:none}
.vl-node.vl-kin{border-color:rgba(201,169,110,.45);background:rgba(8,15,22,.66)}
.vl .vl-node.vl-hot::after{opacity:1}
.vl-hero-copy,.vl-cue{z-index:2}

/* 02 Onboard */
.vl-cards{display:contents}
.vl-card{position:absolute;width:clamp(220px,20vw,290px);aspect-ratio:29/22;border-radius:28px;overflow:hidden;border:1px solid var(--hair);box-shadow:0 30px 60px rgba(0,0,0,.35);background:#0B121A}
.vl-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.vl-card:hover img{transform:scale(1.06)}
.vl-card::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(225deg,rgba(3,8,13,.7) 0%,rgba(3,8,13,.25) 45%,rgba(3,8,13,0) 70%)}
.vl-card figcaption{position:absolute;right:22px;top:18px;z-index:2;font-size:28px;line-height:1}
.vl-card .vl-circ48{position:absolute;left:16px;top:16px;z-index:2;width:48px;height:48px;border-radius:50%;display:grid;place-items:center}
.vl-c1{right:var(--ml);top:14.5%}
.vl-c2{right:calc(var(--ml) + 8.5vw);top:44.5%}
.vl-c3{left:var(--mr);top:14.5%}
.vl-c4{left:calc(var(--mr) + 8.5vw);top:44.5%}
.vl-glide{left:0;right:0;bottom:9%;text-align:center;padding:0 20px}
.vl-glide h2{font-size:clamp(64px,7.2vw,104px);line-height:.95}
.vl-glide p{max-width:560px;margin:18px auto 0;font-size:17px;color:var(--muted)}

/* 03 Voyage */
.vl-voy-l{right:var(--ml);bottom:96px;width:min(760px,56vw)}
.vl-line{display:block;width:64px;height:2px;background:var(--accent);transform-origin:right;margin-bottom:28px}
.vl-voy-l h2{font-size:clamp(52px,5.7vw,82px);line-height:.98}
.vl-voy-r{left:var(--mr);bottom:104px;width:min(400px,30vw)}
.vl-voy-r p{color:var(--muted)}
.vl-alink{display:inline-flex;margin-top:22px;color:var(--accent) !important;font-size:12px;font-weight:700;letter-spacing:.18em}
.vl-alink:hover{color:var(--ivory) !important}

/* 04 Destinations */
.vl-dest-h{right:var(--ml);top:150px}
.vl-dest-h h2{font-size:clamp(50px,5.3vw,76px);line-height:.98;margin-top:20px;max-width:640px}
.vl-tiles{left:var(--ml);right:var(--mr);bottom:64px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.vl-tile{border-radius:22px;min-height:170px;padding:22px;display:flex;flex-direction:column;transition:background .4s}
.vl-tile:hover{background:rgba(8,15,22,.68)}
.vl-tile-top{display:flex;gap:12px;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.vl-tile-top b{color:var(--accent);font-weight:700}
.vl-tile h3{font-family:var(--serif);font-weight:500;font-size:32px;line-height:1.05;margin:auto 0 8px;padding-top:18px}
.vl-tile p{font-size:14px;color:var(--muted);line-height:1.5}

/* 05 Reserve */
.vl-reserve{position:relative;scroll-snap-align:start;padding-top:12vh}
.vl-sheet{margin:0 24px;padding:80px clamp(24px,7.2vw,104px) 40px;background:var(--panel);border-radius:32px 32px 0 0;border:1px solid rgba(244,239,230,.08);border-bottom:0;box-shadow:0 -40px 80px rgba(0,0,0,.4)}
.vl-res-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:72px;align-items:start}
.vl-badge{display:inline-flex;align-items:center;gap:10px;padding:9px 16px;border-radius:999px;border:1px solid var(--hair);font-size:11px;font-weight:600;letter-spacing:.2em}
.vl-badge i{width:7px;height:7px;border-radius:50%;background:var(--accent)}
.vl-res-grid blockquote{font-size:clamp(44px,4.4vw,64px);line-height:1;margin:30px 0 26px}
.vl-res-copy p{color:var(--muted);max-width:480px}
.vl-form-t{font-size:12px;font-weight:700;letter-spacing:.24em;margin-bottom:24px}
.vl-fgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.vl-field label{display:block;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.vl-field input,.vl-field select{width:100%;height:52px;padding:0 16px;background:#121B25;border:1px solid rgba(244,239,230,.12);border-radius:12px;color:var(--ivory);font-size:15px;outline:none;transition:border-color .3s;-webkit-appearance:none;appearance:none}
.vl-field select{padding-left:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23C9A96E' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:left 14px center;background-size:16px}
.vl-field input[type=number]{-moz-appearance:textfield;appearance:textfield}
.vl-field input[type=number]::-webkit-outer-spin-button,.vl-field input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.vl-field select{-moz-appearance:none}
.vl-field select option{background:#121B25;color:var(--ivory)}
.vl-field input::placeholder{color:rgba(244,239,230,.35)}
.vl-field input:focus,.vl-field select:focus{border-color:rgba(244,239,230,.45)}
.vl-erow{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:end;margin-top:16px}
.vl-erow .vl-btn{height:52px;border-radius:12px;text-transform:none;letter-spacing:.02em;font-size:15px}
.vl-privacy{font-size:12px;color:rgba(244,239,230,.5);margin-top:14px}
.vl-status{margin-top:14px;color:var(--accent);font-weight:600}
.vl-ftr{margin-top:88px;border-top:1px solid var(--hair);padding-top:56px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}
.vl-ftr-brand{display:flex;align-items:center;gap:12px;font-family:var(--serif);font-size:22px;letter-spacing:.3em}
.vl-ftr-brand svg{width:22px;height:22px;fill:var(--accent)}
.vl-ftr p{color:var(--muted);font-size:14px;margin-top:14px;max-width:320px}
.vl-ftr h4{margin:0 0 16px;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.vl-ftr ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:14px;color:var(--muted)}
.vl-ftr ul a:hover{color:var(--ivory)}
.vl-wordmark{font-family:var(--serif);font-weight:500;font-size:clamp(64px,14vw,210px);line-height:.85;text-align:center;color:rgba(244,239,230,.05);letter-spacing:.04em;margin:56px 0 24px;white-space:nowrap;direction:ltr;overflow:hidden;-webkit-user-select:none;user-select:none}
.vl-legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid var(--hair);padding-top:24px;font-size:12px;color:rgba(244,239,230,.5)}
.vl-legal nav{display:flex;gap:24px}

/* Scroll-driven motion */
@keyframes rise{from{opacity:0;transform:translateY(70px)}to{opacity:1;transform:none}}
@keyframes flyL{from{opacity:0;transform:translateX(120px) scale(.92)}to{opacity:1;transform:none}}
@keyframes flyR{from{opacity:0;transform:translateX(-120px) scale(.92)}to{opacity:1;transform:none}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes sheetUp{from{transform:translateY(140px)}to{transform:none}}
@supports (animation-timeline: view()){
  /* Each screen exposes its own view timeline, so a group pinned to the bottom of
     a frame finishes its entrance by the time that frame is fully on screen. */
  .vl-screen{view-timeline-name:--sec;view-timeline-axis:block}
  .vl-rv,.vl-rv2,.vl-rv3,.vl-rv4{animation:rise linear both;animation-timeline:--sec}
  .vl-rv{animation-range:entry 15% entry 75%}
  .vl-rv2{animation-range:entry 25% entry 85%}
  .vl-rv3{animation-range:entry 32% entry 95%}
  .vl-rv4{animation-range:entry 38% entry 100%}
  .vl-inl,.vl-inl2{animation:flyL linear both;animation-timeline:--sec}
  .vl-inr,.vl-inr2{animation:flyR linear both;animation-timeline:--sec}
  .vl-inl,.vl-inr{animation-range:entry 10% entry 70%}
  .vl-inl2,.vl-inr2{animation-range:entry 22% entry 90%}
  .vl-line{animation:grow linear both;animation-timeline:--sec;animation-range:entry 15% entry 75%}
  /* The reserve sheet and the stacked phone layout are taller than a screen,
     so there each element tracks its own entry into view instead. */
  .vl-reserve .vl-rv,.vl-reserve .vl-rv2,.vl-reserve .vl-rv3{animation-timeline:view()}
  @media (max-width:900px){
    .vl-rv,.vl-rv2,.vl-rv3,.vl-rv4,.vl-inl,.vl-inl2,.vl-inr,.vl-inr2,.vl-line{animation-timeline:view()}
  }
  .vl-sheet{animation:sheetUp linear both;animation-timeline:view();animation-range:entry 0% entry 60%}
}
/* Fallback when scroll timelines are missing (class set by the script) */
.vl-no-sda .vl-rv,.vl-no-sda .vl-rv2,.vl-no-sda .vl-rv3,.vl-no-sda .vl-rv4{opacity:0;transform:translateY(70px)}
.vl-no-sda .vl-inl,.vl-no-sda .vl-inl2{opacity:0;transform:translateX(120px) scale(.92)}
.vl-no-sda .vl-inr,.vl-no-sda .vl-inr2{opacity:0;transform:translateX(-120px) scale(.92)}
.vl-no-sda .vl-line{transform:scaleX(0)}
.vl-no-sda .vl-rv,.vl-no-sda .vl-rv2,.vl-no-sda .vl-rv3,.vl-no-sda .vl-rv4,.vl-no-sda .vl-inl,.vl-no-sda .vl-inl2,.vl-no-sda .vl-inr,.vl-no-sda .vl-inr2,.vl-no-sda .vl-line{transition:opacity 1s ease,transform 1.1s var(--ease)}
.vl-no-sda .vl-rv2,.vl-no-sda .vl-inl2,.vl-no-sda .vl-inr2{transition-delay:.15s}
.vl-no-sda .vl-rv3{transition-delay:.3s}
.vl-no-sda .vl-rv4{transition-delay:.45s}
.vl-no-sda .vl-in{opacity:1;transform:none}

/* Responsive */
@media (max-width:900px){
  html{scroll-snap-type:none}
  .vl-hdr{padding:0 20px;height:76px;display:flex;justify-content:space-between}
  .vl-nav,.vl-index{display:none}
  .vl-logo{font-size:18px;padding:8px 10px 8px 18px}
  .vl .vl-logo{padding:9px 16px}
  .vl-brand-logo{width:112px;height:25px}
  .vl-cta{height:40px;padding:0 16px;font-size:11px;letter-spacing:.12em}
  .vl-screen{height:auto;min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;gap:28px;padding:120px 20px 48px}
  .vl .vl-grp,.vl .vl-card{position:static;width:auto;max-width:none}
  .vl-hero-copy,.vl-voy-l,.vl-voy-r{width:auto}
  .vl-cue{display:none}
  /* the icon network has the whole first screen; the hero copy sits centred on the next */
  #home.vl-screen{height:100vh;height:100svh;min-height:560px;padding:0}
  #intro.vl-screen{justify-content:center}
  .vl-cards{display:grid;grid-template-columns:1fr 1fr;gap:14px}
  .vl-card{width:100%;border-radius:22px}
  .vl-card figcaption{font-size:22px;right:16px;top:14px}
  .vl-card .vl-circ48{width:38px;height:38px;left:12px;top:12px}
  .vl-glide{text-align:right;padding:0}
  .vl-glide p{margin-right:0}
  .vl-tiles{grid-template-columns:1fr}
  .vl-reserve{padding-top:40px}
  .vl-sheet{margin:0 10px;padding:56px 20px 32px;border-radius:24px 24px 0 0}
  .vl-res-grid,.vl-fgrid,.vl-ftr{grid-template-columns:1fr}
  .vl-res-grid{gap:48px}
  .vl-erow{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .vl-ld1,.vl-ld2,.vl-ld3,.vl-ld4,.vl-rv,.vl-rv2,.vl-rv3,.vl-rv4,.vl-inl,.vl-inl2,.vl-inr,.vl-inr2,.vl-line,.vl-hero-copy,.vl-sheet{animation:none !important;opacity:1 !important;transform:none !important;transition:none !important}
  .vl-cue-line::after{animation:none;transform:scaleY(1)}
}

/* ---- Persian / right-to-left typography ---- */
.vl{--serif:Vazirmatn,"Vazir",Tahoma,"Segoe UI",sans-serif;--sans:Vazirmatn,"Vazir",Tahoma,"Segoe UI",sans-serif;--latin:"Cormorant Garamond",Garamond,"Times New Roman",serif;font-family:var(--sans)}
/* letter-spacing breaks Persian letter joining */
.vl *{letter-spacing:0 !important}
.vl em{font-style:normal;font-weight:inherit;color:var(--accent)}
.vl .vl-serif{font-weight:600;letter-spacing:0}
.vl h1.vl-serif,.vl h2.vl-serif,.vl blockquote.vl-serif{line-height:1.32}
.vl .vl-hero-copy h1{font-size:clamp(42px,5vw,74px);margin:22px 0}
.vl .vl-glide h2{font-size:clamp(46px,5.4vw,80px)}
.vl .vl-voy-l h2{font-size:clamp(38px,4.3vw,62px)}
.vl .vl-dest-h h2{font-size:clamp(36px,4vw,58px)}
.vl .vl-res-grid blockquote{font-size:clamp(32px,3.3vw,48px)}
.vl .vl-card figcaption{font-size:24px;line-height:1.3}
.vl .vl-tile h3{font-size:26px}
.vl .vl-eyebrow,.vl .vl-label,.vl .vl-nav a,.vl .vl-cta,.vl .vl-btn{font-size:14px}
.vl .vl-lede,.vl .vl-glide p,.vl .vl-voy-r p,.vl .vl-res-copy p{line-height:1.9}
/* Latin brand marks keep their spaced serif look */
.vl .vl-logo,.vl .vl-wordmark,.vl .vl-ftr-brand{font-family:var(--latin)}
.vl .vl-logo{letter-spacing:.34em !important;padding:10px 24px 10px 14px}
.vl .vl-ftr-brand{letter-spacing:.3em !important}
.vl .vl-wordmark{letter-spacing:.04em !important}
.vl .vl-circ48 svg{transform:scaleX(-1)}
.vl input[type=email]{direction:ltr;text-align:right}
.vl .vl-logo{padding:11px 22px;display:inline-flex;align-items:center}
/* LOGO · swap the image here (module: static/src/img/homatar-logo.png) */
.vl-brand-logo{display:block;width:150px;height:33px;background:url("/homatar_landing/static/src/img/homatar-logo.png") no-repeat center/contain}
.vl-brand-logo.vl-brand-lg{width:220px;height:48px}
.vl .vl-tile-top,.vl .vl-index a,.vl .vl-cue,.vl .vl-field label,.vl .vl-privacy,.vl .vl-badge,.vl .vl-form-t,.vl .vl-alink{font-size:13px}
.vl .vl-index .vl-lbl{font-size:12px}
.vl .vl-ftr h4{font-size:13px}
/* Homatar copy */
.vl .vl-h1-sub{display:inline-block;font-size:.42em;font-weight:500;color:var(--muted);vertical-align:middle}
.vl .vl-h1-sub bdi{font-family:var(--sans)}
.vl-nw{white-space:nowrap}
.vl-why{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:22px}
.vl-why li{position:relative;padding-right:22px;font-size:19px;font-weight:600;line-height:1.75;color:var(--ivory)}
.vl-why li::before{content:"";position:absolute;right:0;top:.72em;width:8px;height:8px;border-radius:50%;background:var(--accent)}
.vl .vl-erow-btn{grid-template-columns:auto;justify-content:start}
.vl input[type=tel]{direction:ltr;text-align:right}
/* longer Homatar copy: smaller headings and wider text blocks so everything fits one screen */
@media (min-width:901px){
  .vl .vl-hero-copy{width:min(660px,52vw);top:max(104px,calc(50vh - 300px))}
  .vl .vl-hero-copy h1{font-size:clamp(34px,3.5vw,54px);margin:18px 0}
  .vl .vl-lede{max-width:none;font-size:15px}
  .vl .vl-voy-r{width:min(470px,34vw)}
  .vl .vl-glide{bottom:7%}
  .vl .vl-glide h2{font-size:clamp(32px,3.3vw,50px)}
  .vl .vl-glide p{max-width:840px;font-size:15px}
}
@media (min-width:901px) and (max-width:1280px){
  .vl .vl-c1,.vl .vl-c3{top:13%}
  .vl .vl-c2,.vl .vl-c4{top:36%}
}



/* ==========================================================
   رفع فاصله و چسباندن سکشن intro به بالا (#home) و پایین (#onboard)
   ========================================================== */

/* 1. حذف ارتفاع اجباری 100vh و اسنپ برای این سکشن */
.vl-screen.vl-screen-compact {
  height: auto !important;
  min-height: 0 !important;
  scroll-snap-align: none !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* 2. در دسکتاپ: لغو Position Absolute جهت قرارگیری طبیعی در جریان صفحه */
@media (min-width: 901px) {
  #intro.vl-screen {
    position: relative;
    padding: 20px 0 !important;
  }
  #intro .vl-hero-copy {
    position: relative !important;
    top: 0 !important;
    right: 0 !important;
    margin: 0 auto;
    width: min(850px, 90vw) !important;
    text-align: center;
  }
  #intro .vl-ctas {
    justify-content: center;
    margin-top: 20px;
    margin-bottom: 10px;
  }
}

/* 3. در موبایل: حذف پدینگ‌های پیش‌فرض 120 پیکسل برای چسبیدن به بالا و پایین */
@media (max-width: 900px) {
  #intro.vl-screen {
    padding: 16px 20px !important;
    gap: 12px !important;
    justify-content: flex-start !important;
  }
  #intro .vl-hero-copy {
    margin: 0 !important;
  }
  #intro .vl-ctas {
    margin-top: 18px;
  }
}

/* 4. تنظیم تگ بالایی (#home) و پایینی (#onboard) برای اتصال بدون گپ */
#home.vl-screen {
  min-height: auto !important;
  margin-bottom: 0 !important;
}

#onboard.vl-screen {
  padding-top: 24px !important; /* فاصله مینیمال تگ بعدی با دکمه‌های این بخش */
}

/* Header actions: login / sign-up next to the consultation CTA */
.vl-hdr-acts{justify-self:end;display:flex;align-items:center;gap:12px}
.vl .vl-cta.vl-cta-ghost{background:rgba(244,239,230,.08);color:var(--ivory) !important;border:1px solid rgba(244,239,230,.28)}
.vl .vl-cta.vl-cta-ghost:hover{background:rgba(244,239,230,.16);border-color:var(--accent);color:var(--accent) !important}
@media (max-width:900px){
  .vl-hdr-acts{gap:8px}
}
@media (max-width:480px){
  .vl .vl-hdr-acts .vl-cta{height:36px;padding:0 12px;font-size:12px;letter-spacing:0}
  .vl .vl-brand-logo{width:92px;height:21px}
  .vl .vl-logo{padding:8px 12px}
}

/* Catalog download card (reserve sheet, just above the footer) */
.vl-catalog{display:flex;align-items:center;gap:18px;margin-top:34px;padding:18px 18px 18px 20px;border-radius:20px;max-width:520px;background:rgba(201,169,110,.06);border-color:rgba(201,169,110,.28)}
.vl-cat-ico{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:14px;background:rgba(201,169,110,.14)}
.vl-cat-ico svg{width:26px;height:26px;fill:none;stroke:var(--accent);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.vl-cat-txt{flex:1;min-width:0}
.vl .vl-res-copy .vl-cat-t{margin:0;color:var(--ivory);font-size:16px;font-weight:700;line-height:1.5}
.vl .vl-res-copy .vl-cat-m{margin:4px 0 0;color:var(--muted);font-size:13px;line-height:1.6}
.vl .vl-cat-btn{flex:none;height:46px;padding:0 20px;gap:10px;font-size:14px;letter-spacing:0;text-transform:none}
.vl-cat-btn .vl-ico{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:560px){
  .vl-catalog{flex-wrap:wrap}
  .vl .vl-cat-btn{width:100%}
}

/* Consultation form: required marks, field errors, honeypot */
.vl-req{color:var(--accent);font-style:normal}
.vl-field.vl-invalid input{border-color:#e07a6a}
.vl-field .vl-ferr{display:block;margin-top:6px;font-size:12px;color:#e8968a}
.vl-status-err{color:#e8968a}
.vl-hp{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#quoteForm{position:relative}
#quoteForm button[disabled]{opacity:.6;cursor:wait}

/* ---- Before / after tiles: title above each tile, «بدون هماتار» / «با هماتار» inside ---- */
.vl .vl-ba{align-items:stretch}
.vl .vl-ba-col{display:flex;flex-direction:column;gap:10px}
.vl .vl-ba-t{font-family:var(--serif);font-weight:700;font-size:26px;line-height:1.3;color:var(--accent);text-align:center}
.vl .vl-ba .vl-tile{flex:1;min-height:0;padding:22px 26px;direction:rtl;text-align:right !important;align-items:stretch;font-size:14px !important}
.vl .vl-ba .vl-tile h4,.vl .vl-ba .vl-tile p{direction:rtl;text-align:right !important;font-size:14px !important}
.vl .vl-ba .vl-tile h4{margin:0 0 6px;font-weight:700;line-height:1.6;color:var(--accent)}
.vl .vl-ba .vl-tile p{margin:0 0 18px;line-height:1.9;color:var(--ivory)}
.vl .vl-ba .vl-tile p:last-child{margin-bottom:0}

/* 03 voyage: title (right) and bullets (left) vertically centred on one row */
@media (min-width:901px){
  #voyage.vl-screen{height:auto !important;min-height:0 !important;margin:0 !important;padding:48px var(--ml) 48px var(--mr) !important;display:flex !important;flex-direction:row !important;direction:rtl;align-items:flex-start !important;justify-content:space-between;gap:40px;scroll-snap-align:none}
  #voyage .vl-grp{position:static !important;transform:none !important;inset:auto !important;margin:0 !important}
  #voyage .vl-voy-l{display:flex !important;align-items:center;height:calc(19px * 1.75);gap:20px;flex:1 1 auto;width:auto !important;min-width:0}
  #voyage .vl-voy-l .vl-line{flex:0 0 64px;margin:0 !important}
  #voyage .vl-voy-l h2{margin:0 !important;line-height:1.3 !important;min-width:0;white-space:nowrap;font-size:clamp(26px,3.4vw,58px) !important}
  #voyage .vl-voy-r{flex:0 0 auto;width:min(470px,34vw)}
  #voyage .vl-why{margin:0 0 18px !important}
}

/* Glass cards: same glass as .vl-tile.vl-glass, background video shows through */
.vl .vl-cards .vl-card{background:rgba(8,15,22,.25);-webkit-backdrop-filter:blur(18px) saturate(120%);backdrop-filter:blur(18px) saturate(120%);border:1px solid var(--hair);box-shadow:none}
.vl .vl-cards .vl-card img{opacity:.85}
.vl .vl-cards .vl-card::before{background:linear-gradient(225deg,rgba(3,8,13,.35) 0%,rgba(3,8,13,.1) 45%,rgba(3,8,13,0) 70%)}

/* Intro eyebrow: first child of #intro, pinned to the right margin above the hero copy */
#intro > .vl-eyebrow{direction:rtl;justify-content:flex-start;text-align:right;width:auto;margin:0 var(--ml) 0 auto !important;padding:0;background:none !important;box-shadow:none !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important}
