
    .parsley-errors-list{color:#B3261E;font-size:13px;list-style:none;padding:0;margin:6px 0 0}
    /* Markup of mine that beta's stylesheets do not cover. */
    .svh-skip{position:absolute;left:-9999px;background:#0a1525;color:#fff;padding:12px 18px;z-index:999;border-radius:8px;text-decoration:none}
    .svh-skip:focus{left:12px;top:12px}
    .svh-dock{display:none}
    @media (max-width:767.98px){
      .svh-dock{display:flex;gap:10px;position:fixed;inset:auto 0 0 0;z-index:70;background:#fff;
        box-shadow:0 -4px 20px rgba(10,21,37,.12);padding:10px 14px calc(10px + env(safe-area-inset-bottom))}
      .svh-dock .svh-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:8px;
        min-height:46px;border-radius:12px;font-weight:700;font-size:15px;text-decoration:none;
        background:linear-gradient(135deg,#bd5005,#c2410c);color:#fff}
      .svh-dock .svh-btn--ghost{background:#fff;color:#1f2937;border:1px solid #e5e7eb}
      body{padding-bottom:74px}
    }

    /* Beta turns the whole tile solid dark on hover
       (.bb-drawer-tile:hover{background:var(--bb-dark);color:#fff}) and flips
       the icon to amber, which reads as the tile going black under the finger.
       Lift it instead and keep the icon's own gradient. */
    .bb-drawer-tile:hover,
    .bb-drawer-tile:focus-visible{
      background:#fff !important;
      color:#1f2937 !important;
      border-color:#d7dee6 !important;
      box-shadow:0 6px 18px rgba(10,21,37,.10);
      transform:translateY(-2px);
    }
    .bb-drawer-tile:hover i{ color:#fff !important; }
    .bb-drawer-tile:hover i,
    .bb-drawer-tile:focus-visible i{ transform:scale(1.04); }
    .bb-drawer-tile i{ transition:transform .15s ease; }

    /* The wordmark is wide and the phone button + hamburger are fixed-size, so
       on narrow screens the logo ran underneath the orange pill. A vw cap only
       guessed at it; making the logo the only shrinkable item in the flex row
       means it can never collide, at any width. */
    .bb-nav{gap:10px}
    .bb-logo{flex:0 1 auto;min-width:0;overflow:hidden}
    /* <picture> is inline by default and would add a baseline gap inside
       the flex row. It also becomes the img's containing block, so it has to
       carry the same shrink rules as .bb-logo - otherwise .bb-logo-img's
       max-width:100% resolves against a box that never gets smaller and the
       "logo may shrink, the phone CTA may not" arrangement above stops
       working on narrow phones. */
    .bb-logo picture{display:flex;align-items:center;flex:0 1 auto;min-width:0;max-width:100%}
    .bb-logo-img{max-width:100%;width:auto;height:44px;object-fit:contain;object-position:left center}
    .bb-nav-actions{flex:0 0 auto}
    @media (max-width:575.98px){
      .bb-logo-img{height:38px}
      .bb-nav-actions{gap:8px}
      .bb-phone-cta--sm strong{font-size:13px}
    }
    /* inner-pages.css asks for repeat(2, 1fr) on the contact cards, but a grid
       "1fr" still has an automatic min-content floor - and info@srivinayakaholidays.in
       is one unbreakable token, so it dragged its column to 211px and squeezed
       the other to 113px. minmax(0,1fr) removes the floor; the address then
       needs permission to break. */
    .bb-static-cards{ grid-template-columns:repeat(4,minmax(0,1fr)) }
    @media (max-width:767px){
      .bb-static-cards{ grid-template-columns:repeat(2,minmax(0,1fr)) }
    }
    .bb-static-card span,
    .bb-static-card strong{ overflow-wrap:anywhere; word-break:break-word }
    @media (max-width:575.98px){
      .bb-static-card{ padding:14px 10px }
      .bb-static-card span{ font-size:12.5px; line-height:1.45 }
    }

    /* inner-pages.css sets the hero h1 to clamp(28px, 4vw, 44px) - on a phone 4vw
       is far below 28px, so the clamp floors at 28 and a long title like
       "Hyderabad to Hyderabad tour packages" runs to three lines. Scale it down
       on small screens so it settles in two. */
    @media (max-width:767.98px){
      .bb-inner-hero h1{ font-size:clamp(20px, 5.6vw, 26px); line-height:1.2 }
      .bb-inner-hero{ padding:22px 0 26px }
      .bb-inner-hero-text{ margin-bottom:18px }
    }
    @media (max-width:389.98px){
      .bb-inner-hero h1{ font-size:19px }
    }

    /* ---- Why travel with us -----------------------------------------------
       .bb-why-card carries only a white background and a border, so on its own
       the three items read as unstyled blocks. Beta's own palette rotation
       (orange / teal / indigo) gives them an identity without new artwork. */
    .svh-why{
      position:relative; height:100%; padding:26px 22px 22px;
      display:flex; flex-direction:column; gap:10px; overflow:hidden;
      transition:transform .18s ease, box-shadow .18s ease;
    }
    .svh-why::before{
      content:''; position:absolute; inset:0 0 auto 0; height:4px;
      background:linear-gradient(90deg, var(--svh-a), var(--svh-b));
    }
    .svh-why:hover{ transform:translateY(-3px); box-shadow:0 14px 30px -14px rgba(10,21,37,.25) }
    .svh-why--1{ --svh-a:#f97316; --svh-b:#c2410c }
    .svh-why--2{ --svh-a:#0d9488; --svh-b:#134e4a }
    .svh-why--3{ --svh-a:#6366f1; --svh-b:#4338ca }
    .svh-why-ico{
      width:56px; height:56px; border-radius:16px; flex:none;
      display:inline-flex; align-items:center; justify-content:center;
      background:linear-gradient(135deg, var(--svh-a), var(--svh-b));
      color:#fff; font-size:22px;
      box-shadow:0 8px 18px -8px var(--svh-a);
    }
    .svh-why-ico img{ filter:brightness(0) invert(1) }
    .svh-why-num{
      position:absolute; top:6px; right:14px;
      font-family:'Plus Jakarta Sans',sans-serif; font-size:64px; font-weight:800;
      line-height:1; color:var(--svh-a); opacity:.08; pointer-events:none;
    }
    .svh-why h5{
      font-family:'Plus Jakarta Sans',sans-serif; font-size:17px; font-weight:800;
      color:var(--bb-text,#0a1525); margin:4px 0 0;
    }
    .svh-why p{ font-size:13.5px; line-height:1.6; color:var(--bb-text-muted,#64748b); margin:0 }

    /* ---- Testimonials ------------------------------------------------------
       Quote mark, rating, the words, then an author row pinned to the bottom so
       cards of different text lengths still line up. */
    .svh-tm{
      position:relative; height:100%; margin:0; padding:24px 20px 20px;
      display:flex; flex-direction:column; gap:12px; overflow:hidden;
      background:#fff; border:1px solid var(--bb-border-light,#eef2f7);
      border-radius:var(--bb-radius-lg,16px);
      box-shadow:0 2px 10px -4px rgba(15,23,42,.08);
      transition:transform .18s ease, box-shadow .18s ease;
    }
    .svh-tm:hover{ transform:translateY(-3px); box-shadow:0 16px 32px -16px rgba(10,21,37,.28) }
    .svh-tm::before{ content:''; position:absolute; inset:0 0 auto 0; height:3px; background:var(--svh-a) }
    .svh-tm--1{ --svh-a:#f97316 } .svh-tm--2{ --svh-a:#0d9488 } .svh-tm--3{ --svh-a:#6366f1 }
    .svh-tm-mark{
      position:absolute; top:2px; right:16px;
      font-family:Georgia,serif; font-size:78px; line-height:1;
      color:var(--svh-a); opacity:.12; pointer-events:none;
    }
    .svh-tm-stars{ color:#f59e0b; font-size:12px; letter-spacing:1px }
    .svh-tm-text{
      margin:0; font-size:13.5px; line-height:1.65; color:var(--bb-text,#0a1525);
      /* keeps one long review from doubling the row height */
      display:-webkit-box; -webkit-line-clamp:7; -webkit-box-orient:vertical; overflow:hidden;
    }
    .svh-tm-by{
      margin-top:auto; padding-top:14px; border-top:1px dashed var(--bb-border-light,#eef2f7);
      display:flex; align-items:center; gap:10px;
    }
    .svh-tm-av{
      width:38px; height:38px; border-radius:50%; flex:none;
      display:inline-flex; align-items:center; justify-content:center;
      background:linear-gradient(135deg, var(--svh-a), rgba(10,21,37,.75));
      color:#fff; font-family:'Plus Jakarta Sans',sans-serif; font-weight:800; font-size:15px;
    }
    .svh-tm-by strong{ display:block; font-size:13.5px; font-weight:800; color:var(--bb-text,#0a1525) }
    .svh-tm-by small{ display:block; font-size:11.5px; color:var(--bb-text-muted,#64748b) }
    @media (max-width:767.98px){
      .svh-why{ padding:22px 18px 18px }
      .svh-tm{ padding:20px 16px 16px }
      .svh-tm-text{ -webkit-line-clamp:6 }
    }

    /* ---- search filters ---------------------------------------------------
       Desktop: an ordinary sidebar column. Below 992px the SAME markup becomes
       a bottom-sheet, so there is only one set of inputs to keep in step. */
    @media (max-width:991.98px){
      .svh-filter-col{
        position:fixed; left:0; right:0; bottom:0; z-index:1050;
        max-height:84vh; overflow-y:auto;
        background:#fff; border-radius:16px 16px 0 0;
        box-shadow:0 -8px 40px rgba(10,15,40,.2);
        transform:translateY(100%); transition:transform .3s cubic-bezier(.4,0,.2,1);
        padding:0; margin:0; width:100%;
      }
      .svh-filter-col.is-open{transform:translateY(0)}
      .svh-filter-col .bb-tps-filterbar{position:static;border:0;border-radius:16px 16px 0 0}
      .svh-filter-col .bb-tps-filterbar-head{
        position:sticky; top:0; z-index:2; border-radius:16px 16px 0 0;
      }
      .svh-filter-col .bb-tps-filter-section:last-child{
        position:sticky; bottom:0; background:#fff; z-index:2;
        box-shadow:0 -4px 14px rgba(15,23,42,.06);
      }
      .bb-tps-filter-overlay{
        position:fixed; inset:0; z-index:1049; background:rgba(10,21,37,.5);
        display:none;
      }
      .bb-tps-filter-overlay.is-open{display:block}
    }
    .bb-tps-filter-drawer-close{
      width:32px; height:32px; border-radius:50%; cursor:pointer;
      border:1px solid var(--bb-border,#e2e8f0); background:#fff;
      color:var(--bb-text-muted,#64748b);
      display:inline-flex; align-items:center; justify-content:center;
    }
    .bb-tps-mob-filterbtn-badge{
      display:inline-flex; align-items:center; justify-content:center;
      min-width:18px; height:18px; padding:0 5px; margin-left:4px;
      border-radius:999px; background:#fff; color:#0f2d6b;
      font-size:11px; font-weight:800;
    }

    /* style.css sizes .bb-tpx-paynow as width:calc(100% - 32px) + margin:0 16px,
       which assumes it is a direct child of an UNPADDED container. Inside
       .bb-tpx-paxcard-body (18px padding) the 14px padding is then added on top
       of that width, so the button hung ~28px past the card on both sides. */
    .bb-tpx-paxcard-body .bb-tpx-paynow{
      box-sizing:border-box; width:100%; margin:16px 0 0;
    }

    /* "Expert tour assistance / Custom group rates / Flexible dates" - two to a
       row wrapped mid-phrase on a phone. One per row reads in a single glance. */
    @media (max-width:767.98px){
      .bb-tbe-pkg-feats{grid-template-columns:1fr}
    }

    /* ---- vehicle-hire quote form (its own page, /vehicle-hiring/quote/<url>).
       The modal chrome that used to live here went with the modal; what
       remains is the form furniture the page still uses. */
    /* Trip type as a segmented control - three taps, no dropdown. */
    .svh-q-seg{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}
    .svh-q-seg label{margin:0;cursor:pointer}
    .svh-q-seg input{position:absolute;opacity:0;pointer-events:none}
    .svh-q-seg span{
      display:flex;align-items:center;justify-content:center;gap:6px;
      padding:10px 6px;border:1.5px solid var(--bb-border,#e2e8f0);border-radius:12px;
      font-size:12.5px;font-weight:700;color:var(--bb-text,#0a1525);background:#fff;
      transition:all .15s;
    }
    .svh-q-seg input:checked + span{
      background:linear-gradient(135deg,#f97316,#c2410c);border-color:transparent;color:#fff;
      box-shadow:0 6px 14px -6px rgba(249,115,22,.55);
    }
    .svh-q-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
    .svh-q-f{min-width:0}
    .svh-q-msg{margin-top:14px;padding:12px 14px;border-radius:12px;font-size:13.5px;font-weight:600}
    .svh-q-msg.is-ok{background:#ecfdf5;border:1px solid #6ee7b7;color:#047857}
    .svh-q-msg.is-err{background:#fef2f2;border:1px solid #fca5a5;color:#b91c1c}
    .svh-q-submit{width:100%;margin-top:16px}
    .svh-q-submit.is-busy{opacity:.6;cursor:progress}
    .svh-q-fine{margin:10px 0 0;font-size:11.5px;color:var(--bb-text-muted,#64748b);text-align:center}
    @media (max-width:575.98px){
      .svh-q-row{grid-template-columns:1fr}
      .svh-q-seg span{flex-direction:column;gap:3px;font-size:11px;padding:9px 4px}
    }

    /* ---- per-card route panel on the vehicle step -----------------------
       Its own visibility classes: ci-overrides.css forces
       .bb-tbr-vcard-panel{display:block!important} for beta's AJAX drawer, so
       reusing those would leave every pane open at once. Everything inside is
       still beta's (bb-tbr-pt-list / bb-tbr-pt-time / bb-tpd-timeline). */
    /* The pill rail scrolls instead of wrapping: three pills with counts do not
       fit a phone, and the third was being cut off at the card edge. */
    .bb-tbr-vcard-toggles{
      flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch;
      scrollbar-width:none; scroll-behavior:smooth; padding:2px 0 0;
    }
    .bb-tbr-vcard-toggles::-webkit-scrollbar{display:none}
    .bb-tbr-vcard-toggles > .bb-tbr-toggle{flex:0 0 auto}
    /* Three pills overflow a 375px card by ~23px - scrolling for that is worse
       than trimming them, so they shrink to fit and the rail only scrolls if a
       package ever adds a fourth. */
    @media (max-width:575.98px){
      .bb-tbr-vcard-toggles{gap:5px}
      .bb-tbr-vcard-toggles > .bb-tbr-toggle{padding:7px 10px;font-size:11.5px;gap:5px}
      .bb-tbr-vcard-toggles > .bb-tbr-toggle span{font-size:11px;opacity:.8}
    }
    /* !important to match how ci-overrides.css states the same thing for beta's
       own bb-inline-tog-active - without it the plain .bb-tbr-toggle white
       background kept winning and the active pill never coloured. */
    /* Literal colours, not var(): a var() that resolves to something the
       background shorthand cannot take is invalid at computed-value time and
       silently falls back to transparent - which is why the active pill kept
       showing the card's white. Teal matches beta's own .bb-tbr-toggle.is-active. */
    .bb-tbr-vcard .bb-tbr-toggle.is-active{
      background:linear-gradient(135deg,#0d9488,#134e4a)!important;
      border-color:#0d9488!important;
    }
    /* Higher specificity than the theme's own !important colour rules on the
       pill's label and icon, which otherwise kept the text dark on teal. */
    .bb-tbr-vcard .bb-tbr-vcard-toggles button.bb-tbr-toggle.is-active,
    .bb-tbr-vcard .bb-tbr-vcard-toggles button.bb-tbr-toggle.is-active *{color:#fff!important}

    /* Sits inside the card body, flush under the pills - no floating gap, and a
       tinted ground so it reads as part of that card. */
    .svh-rcp{
      position:relative; margin:4px 0 0; padding:14px;
      background:var(--bb-bg,#f7f9fc);
      border:1px solid var(--bb-border-light,#eef2f7);
      border-radius:var(--bb-radius,12px);
    }
    .svh-rcp[hidden]{display:none}
    .svh-rcp-close{
      position:absolute; top:10px; right:10px; width:34px; height:34px;
      border:1px solid var(--bb-border-light,#eef2f7); background:#fff;
      color:var(--bb-primary,#f97316); border-radius:50%; cursor:pointer;
      display:inline-flex; align-items:center; justify-content:center;
      box-shadow:0 2px 8px rgba(15,23,42,.08);
    }
    .svh-rcp-pane{display:none}
    .svh-rcp-pane.is-active{display:block}
    .svh-rcp-h{
      font-family:'Plus Jakarta Sans',sans-serif; font-size:15px; font-weight:800;
      color:var(--bb-text,#0a1525); margin:0 44px 12px 0; display:flex; align-items:center; gap:8px;
    }
    /* The panel body is a card on its own ground so the lists read as content. */
    .svh-rcp .bb-tbr-pt-list{background:#fff;border-radius:12px;padding:12px 14px}
    .svh-rcp .bb-tbr-pt-list li small{display:block;font-size:11.5px;color:var(--bb-text-muted,#64748b)}
    .svh-rcp .bb-tpd-timeline{background:#fff;border-radius:12px}

    /* Itinerary sub-navigation: four tiles, auto-fitting at any width. */
    .svh-rcp-tiles{
      display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
      gap:10px; margin-bottom:14px;
    }
    .svh-rcp-tile{
      display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
      min-height:86px; padding:12px 10px; cursor:pointer; text-align:center;
      background:#fff; border:1px solid var(--bb-border-light,#eef2f7);
      border-radius:var(--bb-radius,12px);
      font-size:13px; font-weight:700; color:var(--bb-text,#0a1525);
      transition:all .15s;
    }
    .svh-rcp-tile i{font-size:18px;color:var(--bb-text-muted,#64748b)}
    .svh-rcp-tile:hover{border-color:var(--bb-primary,#f97316)}
    .svh-rcp-tile.is-active{
      background:linear-gradient(135deg,var(--bb-primary,#f97316),var(--bb-primary-dark,#c2410c));
      border-color:transparent; color:#fff;
      box-shadow:0 6px 16px -6px rgba(249,115,22,.55);
    }
    .svh-rcp-tile.is-active i{color:#fff}
    .svh-rcp-sub{display:none}
    .svh-rcp-sub.is-active{display:block}
    .svh-rcp-sub .bb-abt-body{background:#fff;border-radius:12px;padding:14px 16px}

    /* Narrow screens: one point per row, smaller chrome, no overflow anywhere. */
    @media (max-width:767.98px){
      .svh-rcp{padding:12px}
      .svh-rcp .bb-tbr-pt-list{grid-template-columns:1fr;padding:10px 12px}
      .svh-rcp-tiles{grid-template-columns:1fr 1fr;gap:8px}
      .svh-rcp-tile{min-height:74px;font-size:12px;padding:10px 8px}
      .svh-rcp-h{font-size:14px;margin-right:40px}
    }
    @media (max-width:359.98px){ .svh-rcp-tiles{grid-template-columns:1fr} }

    /* Beta parks bb-tpd-mobcta above its mobile bottom nav; this site has none,
       so it sits on the floor. body already reserves 74px for a bottom bar. */
    .bb-tpd-mobcta{display:none}
    @media (max-width:767.98px){
      .bb-tpd-mobcta{display:flex;bottom:0;z-index:70}
      body{padding-bottom:80px}
    }

    /* style.css hangs the stop counter outside the card on phones
       (.bb-tpd-stop-card::before{left:-6px}). The column has overflow:hidden, so
       every badge was sliced in half down the left edge. There is ~42px of room
       before the time column starts - put it inside, and at a readable size. */
    @media (max-width:575.98px){
      .bb-tpd-stop-card::before{ left:8px; width:22px; height:22px; font-size:10px }
      .bb-tpd-stop-card{ padding-left:38px }
      .bb-tpd-stop-time{ min-width:56px }
    }

    /* The section strip sticks under the header, so --header-h has to match the
       real header height (beta's stylesheet defaults it to 70px; this one is 60).
       The sidebar then has to clear BOTH sticky bars, not just the header. */
    :root{ --header-h:60px }
    .bb-tpd-tabs-bar .container{ display:flex; align-items:stretch; gap:8px }
    .bb-tpd-tabs-bar{ height:52px }
    @media (max-width:575.98px){ .bb-tpd-tabs-bar{ height:46px } }

    /* A sidebar card only has something to stick beside once the two columns
       sit side by side. Below that the column is stacked, sticky positions it
       against nothing, and Chrome leaves repaint trails of the section behind. */
    .svh-sticky-lg{position:static}
    @media (min-width:992px){ .svh-sticky-lg{position:sticky;top:calc(var(--header-h) + 64px)} }
    /* Two stop columns side by side once there is room. */
    @media (min-width:992px){ .bb-tpd-stops{grid-template-columns:1fr 1fr} }

    /* Footer columns are <details>; on desktop beta shows them open. */
    @media (min-width:992px){
      .bb-af-col > summary{pointer-events:none}
      .bb-af-col > summary .bb-af-chev{display:none}
      .bb-af-col > div{display:block !important}
    }
  