/* ============================================================
   RTL + larger-type refinements (2026-06-07) [v3]
   Additive overrides, loaded AFTER the main stylesheets.
   ============================================================ */

/* Kill the ~15px horizontal overflow caused by 100vw elements (which ignore the
   vertical scrollbar). Stops the stray horizontal scrollbar / sideways drift. */
html { overflow-x: clip; }

/* ---- Footer: keep long values (email, address) inside their own column on desktop ---- */
.pdi-footer-nav,
.pdi-footer-column {
  min-width: 0;
}
.pdi-footer-nav a,
.pdi-footer-column a,
.pdi-footer-column div:not(.pdi-footer-label) {
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* ---- RTL nav: language switcher on the side opposite the logo ---- */
[dir="rtl"] .pdi-language-switch-desktop {
  right: auto !important;
  left: clamp(34px, 2.75vw, 48px) !important;
}
[dir="rtl"] .pdi-language-switch-desktop .pdi-language-option,
[dir="rtl"] .pdi-language-switch-desktop .pdi-language-option.is-active {
  justify-content: flex-start;
}

/* ============ GLOBAL: bigger small text / kickers / titles ============ */
.text-xs { font-size: clamp(13px, 1vw, 16px); }
.nav_links .text-xs { font-size: clamp(14px, 1vw, 18px); }

/* Section eyebrows / kickers / small "titles" — noticeably bigger */
[data-config-text$=".kicker"],
[data-config-text$=".mobileEyebrow"],
[data-config-text$=".title"].text-xs,
[data-config-text$=".secondaryTitle"].text-xs,
.pdi-menu-mobile-eyebrow,
.pdi-menu-desktop-title,
.pdi-reservation-kicker,
.pdi-order-kicker,
.pdi-footer-label {
  font-size: clamp(18px, 1.5vw, 27px) !important;
}

.pdi-reservation-title { font-size: clamp(30px, 3.2vw, 56px); }

.pdi-reservation-form label span,
[data-config-text^="forms."] { font-size: clamp(14px, 1vw, 18px); }

/* Commander / order small text */
.pdi-order-filter,
.pdi-order-add,
.pdi-order-tags,
.pdi-order-tags span,
.pdi-order-card-ingredients,
.pdi-order-empty,
[data-config-text="order.cartLabel"],
[data-config-text="order.totalLabel"] { font-size: clamp(14px, 1.05vw, 17px); }

/* Footer legal links */
.pdi-footer-legal-links a,
.pdi-footer-copyright { font-size: clamp(13px, 0.95vw, 16px); }

/* ============ GALLERY: no scrollbar — driven by JS horizontal scroll-on-scroll ============ */
#menu-details.pdi-menu-scroll-section .pdi-menu-image-stage {
  overflow: hidden !important;
}

/* ============ Menu-details ("Notre carte") — nudge the two columns horizontally ============ */
/* Right column (text + buttons) +40px right, left column (heading + images) -30px left.
   Columns have no transform of their own (the scroll effect only animates the inner
   .pdi-menu-image-track), so translateX is a pure visual nudge that leaves the effect intact.
   Desktop only. */
@media (min-width: 992px) {
  /* ORIGINAL spread: text far right, gallery far left — keeps the CENTRE CLEAR so the
     scroll video stays visible between the two columns. Do not pull these inward. */
  /* full 360px on large screens (1920+); on narrower desktops the shift shrinks just
     enough that the buttons never leave the screen (targeted fix #2) */
  /* Push the text column so its RIGHT edge hugs the viewport edge (~40px margin) at
     EVERY desktop width — not just 1920. Using 50vw keeps the right edge at ~(100vw-40)
     across the range, so the centre stays clear for the burger video and there's no empty
     gap on the right at 1366/1440/1536/1600. */
  #menu-details .exhibitions_right { transform: translateX(clamp(40px, calc(50vw - 640px), 420px)); justify-content: flex-start !important; }
  #menu-details .exhibitions_left { transform: translateX(-240px); }
  /* TARGETED fix #1: the column shift was cropping the "MENU MAISON" kicker off the left
     edge — counter-shift just the kicker (the gallery keeps its full shift). */
  #menu-details .exhibitions_left > .text-xs { transform: translateX(240px); }
  /* RESERVATION button stacked BELOW the MENU button */
  #menu-details .pdi-menu-cta-row {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 14px !important;
  }
  /* smaller right-column paragraph + narrower so the +310px push doesn't clip it off-screen */
  #menu-details .pdi-menu-paragraph { font-size: clamp(1.3rem, 1.8vw, 2.3rem) !important; max-width: 34rem !important; }
  /* align "MENU MAISON" (left) and "NOTRE CARTE" (right) on the same line:
     top-align both grid columns so both headings sit at the row top */
  #menu-details .container-large.is-exhibitions { align-items: start !important; }
  /* reduce the whole image gallery (the scrolling window) width by 50px */
  #menu-details .pdi-menu-image-stage { width: calc(100% - 50px) !important; }
}

/* ============ No text overlaid on images (remove "Selection" / "(Selection de la maison)" captions, all languages) ============ */
.collection_card .collection_detail { display: none !important; }

/* ============ Menu-details MOBILE: "Expérience signature" eyebrow removed ============
   (the subheading stays — it is distinct from the
   "Notre carte" heading, so no duplication) */
@media (max-width: 991px) {
  .pdi-menu-mobile-eyebrow { display: none !important; }
}

/* ============ Footer: SERVICE column to the RIGHT of HORAIRES (5 cols), filling the width ============ */
@media (min-width: 992px) {
  .pdi-footer-grid {
    grid-template-columns: minmax(160px, 1fr) repeat(4, minmax(140px, .9fr)) !important;
    width: 100% !important;
    max-width: 1760px !important;
  }
}

/* ============ Reservation section — DESKTOP composite card (mobile keeps the form) ============ */
/* ONE transparent PNG: the two framed photos are baked into its RIGHT side, the rest is
   transparent so the scroll video shows through. Text + MENU button overlaid on the left.
   No frame, no parallax. */
.pdi-resa-card, .pdi-resa-section { display: none; }

/* MOBILE: show the composite IMAGE (statically, no float effect — the JS gates itself
   to >=992px). The text block stays hidden on mobile (the about section already has it). */
@media (max-width: 991px) {
  .pdi-resa-section {
    display: block;
    position: relative;
    z-index: 5;
    padding: clamp(28px, 6vw, 48px) 0;
  }
  .pdi-resa-card {
    display: block;
    position: relative;
    width: min(88%, 430px);
    margin: 0 auto;
  }
  .pdi-resa-left { display: none; }
  .pdi-resa-composite {
    position: static;
    transform: translateX(130px) scale(1.8);
    width: 100%;
    height: auto;
    object-fit: contain;
    opacity: 1;
  }
  .pdi-resa-frame { display: none; }
}

/* ============ Footer: remove the giant REDROOSTER watermark + add 100px of space ============
   The big translucent "REDROOSTER" wordmark at the bottom is removed (desktop + mobile), and
   the footer is lengthened by 100px so there is breathing room after the content. */
.pdi-footer-word {
  display: none !important;
}
/* add 150px of space AFTER the last section (SERVICE), i.e. between the footer columns
   and the legal bar — by pushing the signature/legal block down */
.pdi-footer-signature {
  margin-top: calc(clamp(42px, 5.6vw, 92px) + 150px) !important;
}
/* let the footer grow so the legal bar is not pushed off-screen */
.pdi-footer-reveal,
.pdi-footer-panel {
  height: auto !important;
  min-height: calc(100vh + 150px) !important;
}
/* MOBILE: even more space after SERVICE so the burger video finishes lower down */
@media (max-width: 767px) {
  .pdi-footer-signature {
    margin-top: 470px !important;
  }
  .pdi-footer-reveal,
  .pdi-footer-panel {
    min-height: calc(100vh + 510px) !important;
  }
}

/* ============ Footer readability over the video (desktop + mobile) ============
   L'ancien "contour noir" (8 couches de text-shadow sombre héritées par tout le footer)
   donnait un aspect cerné/salissant — retiré (demande 09/07). On garde UNE ombre douce et
   diffuse, sans contour dur, juste pour la lisibilité sur les vidéos claires. */
.pdi-footer-panel,
.pdi-footer-reveal {
  text-shadow: 0 1px 12px rgba(0, 0, 0, .45);
}

/* ============ Typography polish (site-wide) ============
   Reading texts use the site's fonts with brighter — but NUANCED — colors for readability:
   big statements in the display serif (cream), body texts in warm near-white, kickers stay
   gold/dim for hierarchy (NOT everything white). */
#specialites .text-2xl {
  font-family: var(--restaurant-font-display, Georgia, "Times New Roman", serif);
  color: #fff8ea;
  line-height: 1.18;
}
#menu-details .pdi-menu-paragraph { color: rgba(255, 248, 238, .92); }
.pdi-about-text-panel { color: rgba(255, 248, 238, .92); }
.pdi-reservation-text { color: rgba(255, 246, 223, .92); }

@media (min-width: 992px) {
  /* Specialties: only the TEXT header (kicker + paragraph) is removed on desktop —
     the image cards stay */
  #specialites .collections_header { display: none !important; }

  /* Desktop reservation: the booking FORM is the pinned content (it stays on screen while the
     scroll video scrubs). The NOTRE MAISON card is NO LONGER inside that pinned block — in the
     markup it now sits AFTER it, as a normal in-flow block, so it only scrolls into view once
     the form has unpinned and left the viewport. Overlap is therefore impossible. It reveals
     with a soft fade + rise (JS adds .is-revealed via IntersectionObserver). */
  #about { margin-top: clamp(40px, 6vh, 90px); }

  .pdi-resa-card {
    /* RIGHT-side stage: the text and the image occupy the SAME spot (vertically centred);
       they fade at different moments, so each one is FULLY visible during its own time.
       position:STICKY — the browser glues the card natively (zero frame lag, no JS jitter);
       the JS only drives the fades and a slow extra descent via transform. */
    position: sticky;
    top: calc((100vh - min(75vh, 740px)) / 2);
    display: block;
    width: min(40%, 620px);
    min-height: min(75vh, 740px);
    margin: 0 clamp(28px, 3vw, 64px) 0 auto;
    color: var(--pdi-cream, #fff2d8);
    opacity: 1;                /* fades are now driven PER CHILD (text vs image, staggered) */
    will-change: transform;
    z-index: 2;
  }
  /* the glued-float JS staggers these: image fades in 40px after the text,
     and finishes fading out 50px after the text/paragraph/button */
  .pdi-resa-left, .pdi-resa-composite { opacity: 0; will-change: opacity; }
  /* The NOTRE MAISON card lives in its OWN section after #reservation (OUTSIDE the form's
     pin), so the form and card can never share the viewport. The section is transparent and
     sits above the fixed scroll-video (z-index), so the frozen video still shows behind it. */
  .pdi-resa-section {
    display: block;
    min-height: 230vh;        /* scroll room: text life + image life + gradual fade-out,
                                 all finishing before the sticky glue releases the card */
    position: relative;
    z-index: 5; /* MUST sit above the fixed hero-video background (z-index 4) or the card
                   is hidden behind the floating-burger video */
  }
  /* gold frame removed — the new composite image has its own glow baked in */
  .pdi-resa-frame { display: none; }
  .pdi-resa-frame-OFF {
    position: absolute;
    top: 2.5%;
    bottom: 2.5%;
    right: 0.5%;
    width: 41%;
    z-index: 1;
    pointer-events: none;
    border: 1px solid rgba(230, 178, 70, .58);
    border-radius: 26px;
  }
  .pdi-resa-frame::before {
    content: "";
    position: absolute;
    inset: -12px -7px 16px 18px;
    border: 1px solid rgba(230, 178, 70, .28);
    border-radius: 30px;
  }
  .pdi-resa-composite {
    /* same spot as the text — centred in the stage, fully visible when it fades in */
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(1.5);
    width: min(96%, 560px);
    height: auto;
    object-fit: contain;
    object-position: center;
    z-index: 1;
  }
  .pdi-resa-left {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
    z-index: 2;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }
  .pdi-resa-title {
    /* matches the site's display style (same as "Réservez votre table"): big serif,
       no uppercase, tight leading — pure white for readability over the video */
    font-family: var(--restaurant-font-display, Georgia, "Times New Roman", serif);
    text-transform: none;
    line-height: .92;
    font-size: clamp(44px, 4.4vw, 80px);
    font-weight: 400;
    letter-spacing: 0;
    margin: 0;
    color: #ffffff;
    text-shadow: 0 2px 30px rgba(0, 0, 0, .8);
  }
  .pdi-resa-rule {
    width: clamp(46px, 4vw, 66px); height: 2px;
    margin: clamp(14px, 1.2vw, 20px) 0 clamp(18px, 1.6vw, 26px);
    background: linear-gradient(90deg, #e6b246, rgba(230, 178, 70, .12));
    border-radius: 2px;
  }
  .pdi-resa-text {
    /* body font of the site, pure white, larger — readable over the video */
    font-family: var(--restaurant-font-body, Inter, Arial, sans-serif);
    color: #ffffff;
    font-size: clamp(17px, 1.2vw, 22px); line-height: 1.55;
    max-width: 30em; margin: 0 0 clamp(14px, 1.2vw, 20px);
    text-shadow: 0 1px 16px rgba(0, 0, 0, .75);
  }
  /* MENU button (image skin) — no background pill behind it */
  .pdi-resa-cta {
    display: inline-block; margin-top: clamp(14px, 1.4vw, 24px);
    background: none; border: 0; padding: 0; box-shadow: none; min-width: 0; min-height: 0;
  }
  .pdi-resa-cta:hover { background: none; transform: translateY(-2px); }
  .pdi-resa-cta-img { display: block; width: clamp(210px, 16vw, 280px); height: auto; }
}

/* ============ About "Notre maison" — DESKTOP redesign ============ */
/* Gated by .pdi-about-redesign (added by animation-kit.js ONLY when media.aboutComposite
   is configured). Text moves all the way RIGHT; the composite image (two framed photos
   with baked-in gold borders + transparency) is stacked directly below it. Commander
   button removed. The crossfade / floating scroll effects are left untouched.
   Sites without the composite keep the original centered layout. Desktop only. */
.pdi-about-composite { display: none; }

@media (min-width: 992px) {
  /* let the pinned text block reach the viewport's right edge ("tout a droite") */
  .section_about.pdi-about-redesign .about_sticky {
    width: 100vw !important;
    max-width: 100vw !important;
    margin-left: calc(50% - 50vw) !important;
  }
  .section_about.pdi-about-redesign .about_sticky-content {
    left: auto !important;
    right: clamp(40px, 4.5vw, 120px) !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    /* wide column for a LARGE composite; capped by viewport height so the
       text + image block always fits without clipping on shorter screens
       (multiplier = trimmed composite aspect ratio 1607/527 ~= 3.05) */
    width: min(42rem, 42vw, calc((100vh - 340px) * .93)) !important;
    min-height: 0 !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    gap: clamp(8px, 1vw, 18px);
    overflow: visible !important;
  }
  .section_about.pdi-about-redesign .pdi-about-text-region {
    position: relative !important;
    width: 100%;
    min-height: clamp(10rem, 19vh, 14rem);
  }
  .section_about.pdi-about-redesign .pdi-about-text-panel {
    align-items: flex-end !important;
    text-align: right !important;
  }
  .section_about.pdi-about-redesign .pdi-about-text-panel .text-2xl {
    max-width: 32rem;
    margin-left: auto;
    text-align: right !important;
  }
  .section_about.pdi-about-redesign .pdi-about-composite {
    display: block;
    width: 100%;
    aspect-ratio: 875 / 941;
    height: auto;
    object-fit: contain;
    object-position: center;
    margin: 0;
    transform: scale(1.5);
    transform-origin: center;
  }
  .section_about.pdi-about-redesign .pdi-about-commander-cta {
    display: none !important;
  }
  /* No floating board photos in the redesign. Keep the slots' box space
     (visibility, not display) so the section keeps its scroll length for the
     text crossfade / sticky pin. Also hides the template's empty placeholder
     slots (which would otherwise show broken-image icons). */
  .section_about.pdi-about-redesign .about_img {
    visibility: hidden !important;
  }
}

/* About redesign on MOBILE: drop the (image-less) board-photo slots entirely
   so there are no broken placeholders or blank gaps in the stacked layout.
   MOBILE mirrors DESKTOP: the composite (two framed photos) shows below the text. */
@media (max-width: 991px) {
  .section_about.pdi-about-redesign .about_img {
    display: none !important;
  }
  /* Universal sizing: scale by max-width AND max-height so the image gets as big as
     possible while KEEPING its own aspect ratio — works for any image shape (16:9,
     square, portrait). A fixed 16:9 box only filled 16:9 images and shrank the rest. */
  .section_about.pdi-about-redesign .pdi-about-composite {
    display: block;
    flex-shrink: 0 !important;
    width: auto !important;
    height: auto !important;
    max-width: 156vw !important;
    max-height: 80vh !important;
    align-self: center !important;
    object-fit: contain;
    object-position: center;
    margin: 18px auto 0;
  }
  /* MOBILE: flatten the desktop "sticky scroll-story" scene into normal flow — the
     pinned/absolute boxes were sized for short placeholder text and the real copy
     overflowed onto the composite. Text stacks, the composite lands BELOW it. */
  .section_about.pdi-about-redesign {
    height: auto !important;
    min-height: 0 !important;
  }
  .section_about.pdi-about-redesign .about_sticky {
    position: static !important;
    height: auto !important;
    min-height: 0 !important;
    width: 100% !important;
    margin: 0 !important;
  }
  .section_about.pdi-about-redesign .about_sticky-content {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    height: auto !important;
    max-height: none !important;
    width: 100% !important;
    padding: clamp(72px, 13svh, 118px) 18px clamp(96px, 15svh, 142px);
    box-sizing: border-box;
  }
  .section_about.pdi-about-redesign .pdi-about-text-region {
    position: relative;
    min-height: 0;
    height: auto !important;
  }
  .section_about.pdi-about-redesign .pdi-about-text-panel {
    position: static !important;
    visibility: visible !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
    height: auto !important;
    margin: 0 0 clamp(78px, 13svh, 122px);
  }
  /* MOBILE order mirrors the desktop rhythm: TEXT → IMAGE → TEXT → IMAGE(button).
     display:contents lifts the panels next to the composite so flex `order` can
     interleave them; panel 1 keeps no button (its gold CTA hides), panel 2's gold
     button closes the sequence. */
  .section_about.pdi-about-redesign .about_sticky-content {
    display: flex;
    flex-direction: column;
  }
  .section_about.pdi-about-redesign .pdi-about-text-region { display: contents; }
  .section_about.pdi-about-redesign .pdi-about-text-panel.is-primary {
    order: 1;
    margin-bottom: clamp(88px, 14svh, 132px);
  }
  .section_about.pdi-about-redesign .pdi-about-composite {
    order: 2;
    margin: clamp(42px, 7svh, 64px) auto clamp(96px, 16svh, 146px);
  }
  .section_about.pdi-about-redesign .pdi-about-text-panel.is-secondary {
    order: 3;
    margin-bottom: clamp(82px, 14svh, 132px);
  }
  .section_about.pdi-about-redesign .pdi-about-text-panel.is-primary .pdi-about-commander-cta { display: none !important; }
  /* panel 2's gold button closes the sequence (the final "image") */
  .section_about.pdi-about-redesign .pdi-about-text-panel.is-secondary .pdi-about-commander-cta {
    display: inline-block !important;
    margin-top: clamp(52px, 9svh, 82px);
  }

  .section_about.pdi-about-redesign .pdi-about-fade-item {
    opacity: 0 !important;
    transform: translate3d(0, 42px, 0) !important;
    filter: blur(10px) !important;
    transition:
      opacity 1s ease,
      transform 1s cubic-bezier(.18, .72, .18, 1),
      filter 1s ease;
    will-change: opacity, transform, filter;
  }

  .section_about.pdi-about-redesign .pdi-about-fade-item.is-visible {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
}

@media (max-width: 991px) and (prefers-reduced-motion: reduce) {
  .section_about.pdi-about-redesign .pdi-about-fade-item,
  .section_about.pdi-about-redesign .pdi-about-fade-item.is-visible {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}

/* ============ MOBILE hero: static rooster-graffiti portrait shot instead of the
   landscape desktop video ============ */
@media (max-width: 991px) {
  .pdi-hero-video { display: none !important; }
  /* !important: the template JS writes an inline background-image (heroBackgroundImage)
     on this element — the mobile hero shot must win over it */
  .pdi-hero-parallax {
    background-image: url("https://dineora.b-cdn.net/atlas-generated/red_rooster_fast_food/hero-mobile-rooster-v1.png") !important;
    background-size: cover !important;
    background-position: center top !important;
    background-repeat: no-repeat !important;
  }
}

/* ============ ARABIC: larger defaults everywhere ============ */
[lang="ar"] .text-xs { font-size: clamp(15px, 1.15vw, 19px) !important; }
[lang="ar"] .nav_links .text-xs { font-size: clamp(17px, 1.25vw, 23px) !important; }

[lang="ar"] [data-config-text$=".kicker"],
[lang="ar"] [data-config-text$=".mobileEyebrow"],
[lang="ar"] [data-config-text$=".title"].text-xs,
[lang="ar"] [data-config-text$=".secondaryTitle"].text-xs,
[lang="ar"] .pdi-menu-mobile-eyebrow,
[lang="ar"] .pdi-menu-desktop-title,
[lang="ar"] .pdi-reservation-kicker,
[lang="ar"] .pdi-order-kicker,
[lang="ar"] .pdi-footer-label {
  font-size: clamp(21px, 1.8vw, 31px) !important;
}

[lang="ar"] .pdi-reservation-title { font-size: clamp(34px, 3.6vw, 60px) !important; }
[lang="ar"] .pdi-menu-mobile-heading { font-size: clamp(34px, 3.6vw, 60px) !important; }
[lang="ar"] .pdi-menu-mobile-subheading { font-size: clamp(40px, 4.6vw, 72px) !important; }

/* Arabic forms */
[lang="ar"] .pdi-reservation-form label span,
[lang="ar"] [data-config-text^="forms."] { font-size: clamp(16px, 1.2vw, 21px) !important; }
[lang="ar"] .pdi-reservation-form input,
[lang="ar"] .pdi-reservation-form select,
[lang="ar"] .pdi-reservation-form textarea { font-size: clamp(15px, 1.05vw, 18px) !important; }

/* Arabic order / commander */
[lang="ar"] .pdi-order-filter { font-size: clamp(15px, 1.1vw, 19px) !important; }
[lang="ar"] .pdi-order-add { font-size: clamp(15px, 1.1vw, 19px) !important; }
[lang="ar"] .pdi-order-tags,
[lang="ar"] .pdi-order-tags span { font-size: clamp(14px, 1.05vw, 18px) !important; }
[lang="ar"] .pdi-order-card-ingredients { font-size: clamp(15px, 1.1vw, 18px) !important; }
[lang="ar"] .pdi-order-empty { font-size: clamp(16px, 1.2vw, 20px) !important; }
[lang="ar"] [data-order-grid] h3,
[lang="ar"] .pdi-order-card h3 { font-size: clamp(20px, 1.6vw, 27px) !important; }
[lang="ar"] [data-order-grid] p,
[lang="ar"] .pdi-order-card p { font-size: clamp(15px, 1.15vw, 19px) !important; }
[lang="ar"] [data-config-text^="order."] { font-size: clamp(15px, 1.1vw, 19px) !important; }
[lang="ar"] .pdi-order-price { font-size: clamp(20px, 1.5vw, 26px) !important; }

/* Arabic footer text + legal */
[lang="ar"] .pdi-footer-nav a,
[lang="ar"] .pdi-footer-column a,
[lang="ar"] .pdi-footer-column div { font-size: clamp(16px, 1.1vw, 20px) !important; }
[lang="ar"] .pdi-footer-legal-links a,
[lang="ar"] .pdi-footer-copyright { font-size: clamp(14px, 1vw, 17px) !important; }

/* Arabic: headings + readability */
[lang="ar"] h1, [lang="ar"] h2, [lang="ar"] h3 { font-size: 1.08em; }
[lang="ar"] p,
[lang="ar"] .pdi-menu-paragraph,
[lang="ar"] .pdi-reservation-text { line-height: 1.75; }