/* ==========================================================================
   HERO RAIL · the cards under the hero's title panel, on every page that has them (owner-approved 2026-10-09, layout 2026-10-10).
   Pages: the five service pages (Success Stories), About Us, Our Work, Our Management, Careers, Contact Us, Legal Documents.
   Each card: the visual (client logo, portrait, document scan, or the existing icon / step number), the name, one meta line.
   Layout follows how much a page holds:
     · service pages (25 businesses): compact cards (248×64) in TWO ROWS, on desktop and on phones — many businesses in view;
     · other pages (4–6 links), desktop: ONE ROW THAT FILLS THE WIDTH edge to edge, every item visible; the card height is
       84px on every page and the picture and words grow with the card's own width; ≤ 1269px, 5–6 items become two rows of three;
     · phones, every page: two rows side by side (one row on phones ≤ 640px tall, so the hero stays on screen).
   About Us, Our Work, Careers and Contact Us cards carry real pictures from the site (section at the end of this file).
   The old lower description (.ih-f) stays in the markup and is not shown.
   Linked in <head> right after the page's hero-drawer file and before the short-screen layer (fold.css); edit this file
   directly; delete its <link> line to undo. Every rule is scoped to the hero (#overview #q7).
   ========================================================================== */

/* ---- the fixed size --------------------------------------------------------------------------------------------- */
html body #overview#overview#overview #q7#q7#q7.cc{
  --rl-h:80px; --rl-vw:72px; --rl-vh:56px; --rl-r:12px; --rl-gap:12px;
  --rl-pad:10px 12px 10px 10px; --rl-cg:12px;
  --rl-nm:15.5px; --rl-nmh:19px; --rl-ms:13px; --rl-msh:16px; --rl-ico:24px; --rl-num:24px; --rl-mono:19px;
  --rl-ink:#0E1E35; --rl-meta:#5A606A; --rl-hov:#F6F8FA; --rl-sel:#E8EAEE; --rl-tile:#EEF1F5; --rl-glyph:#1C2636; }
@media (max-width:760px){
  html body #overview#overview#overview #q7#q7#q7.cc{ --rl-h:68px; --rl-vw:62px; --rl-vh:48px; --rl-r:11px; --rl-gap:8px;
    --rl-pad:8px 10px 8px 8px; --rl-cg:10px; --rl-nm:15px; --rl-nmh:17px; --rl-ms:12.5px; --rl-msh:15px; --rl-ico:21px; --rl-num:21px; --rl-mono:16px; }
}
/* short phones (e.g. 320×568): the whole hero compacts, so does the card — still the same on every page */
@media (max-width:760px) and (max-height:700px){
  html body #overview#overview#overview #q7#q7#q7.cc{ --rl-h:60px; --rl-vw:52px; --rl-vh:40px; --rl-r:10px; --rl-pad:6px 9px 6px 6px; --rl-cg:9px;
    --rl-nm:14px; --rl-nmh:16px; --rl-ms:12px; --rl-msh:14px; --rl-ico:18px; --rl-num:18px; --rl-mono:14px; }
}

/* ---- the card ------------------------------------------------------------------------------------------------------ */
html body #overview#overview#overview #q7#q7#q7.cc .mp-row{
  display:flex; flex-wrap:nowrap; align-items:stretch; gap:var(--rl-gap); grid-template-rows:none; grid-auto-columns:auto; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-row > .mp-i{
  max-width:none; min-width:0; height:var(--rl-h); min-height:0; box-sizing:border-box; margin:0;
  display:grid; grid-template-columns:var(--rl-vw) minmax(0,1fr) 14px; grid-template-rows:auto; align-items:center; align-content:center;
  column-gap:var(--rl-cg); row-gap:0; padding:var(--rl-pad); overflow:hidden;
  border:0; border-radius:14px; outline:0; background:#FFFFFF; color:var(--rl-ink); text-align:left; text-decoration:none; transform:none;
  box-shadow:0 0 0 1px rgba(var(--d5sh),.06), 0 1px 2px rgba(var(--d5sh),.06), 0 3px 8px -4px rgba(var(--d5sh),.16); }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m{ grid-column:1; grid-row:1; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-w{ grid-column:2; grid-row:1; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .cc-cue{ grid-column:3; grid-row:1; }

/* the old lower description and the old tick are not shown; the arrow's words stay for screen readers */
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .ih-f,
html body #overview#overview#overview #q7#q7#q7.cc .mp-i .mp-v{ display:none !important; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i .cc-tx{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ---- the visual: one frame, the same size on every page ------------------------------------------------------------- */
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m{ position:relative; display:grid; place-items:center; flex:none; box-sizing:border-box;
  width:var(--rl-vw); height:var(--rl-vh); margin:0; padding:0; overflow:hidden; border-radius:var(--rl-r); }
/* client without a logo file: its initials on its brand colour */
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m{ background:var(--k); color:#FFFFFF; font-size:var(--rl-mono); font-weight:800; letter-spacing:.02em; }
/* client logo, on the colour around the logo so the plate blends with it.
   NOTE: --logo (set by assets/shared/client-proof/card.js) and --doc (set on the Legal Documents cards) carry url()s written
   relative to THIS file, because a url() inside a CSS variable is resolved from the stylesheet that uses it. */
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m.mp-logo{ padding:6px; font-size:0; color:transparent;
  background:var(--logo) center / contain no-repeat content-box padding-box var(--lb, #FFFFFF);
  box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
/* portrait */
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m.ih-pic{ background:#E6E8EC; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m.ih-pic > img{ position:absolute; inset:0; width:100%; height:100%; max-width:none; display:block; margin:0;
  object-fit:cover; object-position:50% 20%; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m.ih-pic::after{ content:""; position:absolute; inset:0; border-radius:inherit; pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
/* section / topic icon and step number: a quiet tile, ink glyph */
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m.ih-ico{ background:var(--rl-tile); color:var(--rl-glyph); }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m.ih-ico svg{ width:var(--rl-ico); height:var(--rl-ico); color:var(--rl-glyph); stroke:currentColor; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m.ih-ico svg :is(path, circle, rect){ stroke:currentColor; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m .n-num{ font-size:var(--rl-num); line-height:1; font-weight:800; color:var(--rl-glyph);
  letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
/* document: the document's own scan, from the top */
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m.ih-doc{ background:var(--doc) center top / cover no-repeat #F4F6F9;
  box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-m.ih-doc > svg{ display:none; }

/* ---- the words: name up to two lines, one meta line ---------------------------------------------------------------- */
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-w{ display:flex; flex-direction:column; justify-content:center; gap:3px; min-width:0; margin:0; padding:0; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i .cc-nm{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2; overflow:hidden;
  margin:0; white-space:normal; text-overflow:clip; overflow-wrap:break-word;
  font-size:var(--rl-nm); line-height:var(--rl-nmh); font-weight:700; letter-spacing:-.01em; color:var(--rl-ink); }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i .mp-s{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; line-clamp:2;
  margin:0; overflow:hidden; white-space:normal; text-overflow:clip; overflow-wrap:break-word;
  font-size:var(--rl-ms); line-height:var(--rl-msh); font-weight:500; font-style:normal; color:var(--rl-meta); }
/* where the card is narrow, a two-line name and a two-line meta would not fit the fixed height: the meta keeps one line */
@media (min-width:1000px) and (max-width:1269px), (min-width:540px) and (max-width:760px), (max-width:389px), (max-width:760px) and (max-height:700px){
  html body #overview#overview#overview #q7#q7#q7.cc .mp-i .mp-s{ display:block; -webkit-line-clamp:none; line-clamp:none; white-space:nowrap; text-overflow:ellipsis; }
}
html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .cc-cue{ display:grid; place-items:center; width:14px; height:24px; margin:0; padding:0;
  background:none; border:0; box-shadow:none; color:#8A919B; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i .cc-ar{ width:14px; height:14px; rotate:none; translate:none; }

/* ---- states: hover = a quiet tone; chosen = pressed in (same size and place, no tick, no lift) ----------------------- */
html body #overview#overview#overview #q7#q7#q7.cc .mp-i:is(a, button):hover{ background:var(--rl-hov); transform:none; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i:is(a, button):hover .cc-cue{ color:var(--rl-ink); }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i:is(.is-sel, [aria-current], [aria-expanded="true"]),
html body #overview#overview#overview #q7#q7#q7.cc .mp-i:is(.is-sel, [aria-current], [aria-expanded="true"]):hover{ background:var(--rl-sel); transform:none;
  box-shadow:inset 0 2px 5px -1px rgba(var(--d5sh),.20), inset 0 1px 1px rgba(var(--d5sh),.09), inset 0 0 0 1px rgba(var(--d5sh),.07); }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i:is(.is-sel, [aria-current], [aria-expanded="true"]) .cc-nm{ font-weight:800; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i:is(.is-sel, [aria-current], [aria-expanded="true"]) .cc-cue{ color:var(--rl-ink); }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i:is(.is-sel, [aria-expanded="true"]) .cc-ar{ rotate:90deg; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i:focus-visible{ outline:2px solid var(--rl-ink); outline-offset:2px; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i.mp-i--static{ cursor:default; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i.mp-i--static:hover{ background:#FFFFFF; }
html body #overview#overview#overview #q7#q7#q7.cc .mp-i.mp-i--static > .cc-cue{ visibility:hidden; }
@media (forced-colors:active){
  html body #overview#overview#overview #q7#q7#q7.cc .mp-i:is(.is-sel, [aria-current], [aria-expanded="true"]){ outline:3px solid Highlight; outline-offset:2px; }
}

/* ====================================== LAYOUT BY PAGE TYPE ====================================== */
/* ---- phones, every page: two rows of compact cards, scrolling sideways (one row on phones ≤ 640px tall) ------------ */
@media (max-width:760px){
  html body #overview#overview#overview #q7#q7#q7.cc{ --rl-vw:56px; --rl-vh:42px; --rl-pad:5px 9px 5px 5px; --rl-cg:9px; --rl-nm:13.5px; --rl-nmh:16px; --rl-ms:12px; --rl-msh:13px; }
  html body #overview#overview#overview #q7#q7#q7.cc .mp-row{ display:grid; grid-auto-flow:column; grid-template-rows:repeat(2, auto); grid-auto-columns:236px; gap:8px; justify-content:start; }
  html body #overview#overview#overview #q7#q7#q7.cc .mp-row > .mp-i{ flex:none; width:auto; height:56px; grid-template-columns:var(--rl-vw) minmax(0,1fr) 14px; }
  html body #overview#overview#overview #q7#q7#q7.cc .mp-row > .mp-i > .mp-m{ border-radius:10px; }
  html body #overview#overview#overview #q7#q7#q7.cc .mp-i > .mp-w{ gap:2px; }
  html body #overview#overview#overview #q7#q7#q7.cc .mp-i .mp-s{ display:block; -webkit-line-clamp:none; white-space:nowrap; text-overflow:ellipsis; }
}
@media (max-width:760px) and (max-height:640px){
  html body #overview#overview#overview #q7#q7#q7.cc .mp-row{ grid-template-rows:repeat(1, auto); grid-auto-columns:220px; }
  html body #overview#overview#overview #q7#q7#q7.cc .mp-row > .mp-i{ height:52px; }
  html body #overview#overview#overview #q7#q7#q7.cc{ --rl-vw:48px; --rl-vh:36px; }
}

/* ---- service pages, desktop: compact cards in two rows (248×64) ------------------------------------------------------ */
@media (min-width:761px){
  html body #overview#overview#overview:not(.ih) #q7#q7#q7.cc{ --rl-vw:64px; --rl-vh:48px; --rl-pad:8px 10px 8px 8px; --rl-cg:10px; --rl-nm:14.5px; --rl-nmh:17px; --rl-ms:12.5px; --rl-msh:15px; }
  html body #overview#overview#overview:not(.ih) #q7#q7#q7.cc .mp-row{ display:grid; grid-auto-flow:column; grid-template-rows:repeat(2, auto); grid-auto-columns:248px; gap:10px; justify-content:safe center; }
  html body #overview#overview#overview:not(.ih) #q7#q7#q7.cc .mp-row > .mp-i{ flex:none; width:auto; height:64px; grid-template-columns:var(--rl-vw) minmax(0,1fr) 14px; }
  html body #overview#overview#overview:not(.ih) #q7#q7#q7.cc .mp-row > .mp-i > .mp-m{ border-radius:10px; }
  html body #overview#overview#overview:not(.ih) #q7#q7#q7.cc .mp-i > .mp-w{ gap:2px; }
  html body #overview#overview#overview:not(.ih) #q7#q7#q7.cc .mp-i .mp-s{ display:block; -webkit-line-clamp:none; white-space:nowrap; text-overflow:ellipsis; }
}

/* ---- other pages, desktop: one row that fills the width; every item visible -------------------------------------------- */
@media (min-width:761px){
  html body #overview#overview#overview.ih #q7#q7#q7.cc{ --rl-nm:16.5px; --rl-nmh:20px; --rl-ms:13.5px; --rl-msh:17px; --rl-ico:26px; --rl-num:26px; --c-gap:12px; --c-h:84px; --c-vw:84px; --c-vh:62px; }
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row{ display:flex; flex-wrap:wrap; justify-content:flex-start; gap:var(--c-gap); overflow:visible; }
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i{ --c-k:var(--c-n, 6); flex:0 0 calc((100% - (var(--c-k) - 1) * var(--c-gap)) / var(--c-k)); width:auto; height:var(--c-h);
    grid-template-columns:auto minmax(0, max-content) 14px; justify-content:start; column-gap:12px; padding:10px 14px 10px 10px; container-type:inline-size; }
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i > .mp-w{ max-width:100%; gap:3px; }
  /* how many items the page has (4, 5 or 6) */
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(4), html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(4) ~ .mp-i{ --c-n:4; }
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(5), html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(5) ~ .mp-i{ --c-n:5; }
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(6), html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(6) ~ .mp-i{ --c-n:6; }
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(3), html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(3) ~ .mp-i{ --c-n:3; }
}
/* smaller laptops / tablets: 5–6 items become two rows of three */
@media (min-width:761px) and (max-width:1269px){
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(n+5), html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(n+5) ~ .mp-i{ --c-k:3; }
}
@media (min-width:761px) and (max-width:999px){
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(4), html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i:first-child:nth-last-child(4) ~ .mp-i{ --c-k:2; }
}

/* the card's picture and words follow the card's own width (same rule on every page): wide cards get a larger picture and
   larger words, narrow cards a compact picture and two-line words; the card height stays 84px everywhere */
@media (min-width:761px){
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i > .mp-m{ width:56px; height:44px; border-radius:11px; }
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-i .cc-nm{ font-size:15px; line-height:17px; -webkit-line-clamp:2; }
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-i .mp-s{ display:-webkit-box; -webkit-line-clamp:2; white-space:normal; font-size:12.5px; line-height:14px; }
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i > .cc-cue{ display:none; }
  html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i{ grid-template-columns:auto minmax(0, max-content); column-gap:10px; padding:10px; }
  @container (min-width:230px){
    html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i > .mp-m{ width:72px; height:54px; }
    html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-i .cc-nm{ font-size:16px; line-height:19px; }
    html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-i .mp-s{ font-size:13.5px; line-height:16px; -webkit-line-clamp:1; display:block; white-space:nowrap; text-overflow:ellipsis; }
  }
  @container (min-width:300px){
    html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i > .mp-m{ width:92px; height:64px; border-radius:12px; }
    html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-i .cc-nm{ font-size:17.5px; line-height:21px; }
    html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-i .mp-s{ font-size:14.5px; line-height:17px; }
    html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-i > .mp-w{ gap:4px; }
  }
}
/* content centred inside each card, so wide cards (4 items on large screens) are balanced instead of empty on the right */
@media (min-width:761px){ html body #overview#overview#overview.ih #q7#q7#q7.cc .mp-row > .mp-i{ justify-content:center; } }

/* ====================================== REAL PICTURES ON THE CARDS ======================================
   About Us, Our Work, Careers and Contact Us show a real, colourful picture from the site on each card instead of a plain icon
   (Management shows portraits, Legal Documents the document scans and the service pages the client logos — set elsewhere).
   Set as CSS backgrounds on the card's visual frame, so the pages' markup (and the SEO snapshot of their images) is unchanged.
   url()s are relative to THIS file. About Us · Markets keeps its icon (no real picture of the five countries yet).
   Careers keeps the step number as a small chip on each photo. To change a picture, change its url() here. */
html body #overview#overview#overview.ih[data-ih="about-us"] #q7#q7#q7.cc .mp-row > .mp-i[href="#what-we-do"] > .mp-m{ background:url(../../our-work/img/r/eliteflavourscatering-co-in.jpg) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="about-us"] #q7#q7#q7.cc .mp-row > .mp-i[href="#what-we-do"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="about-us"] #q7#q7#q7.cc .mp-row > .mp-i[href="#our-story"] > .mp-m{ background:url(../../contact/img/vaishali.jpg) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="about-us"] #q7#q7#q7.cc .mp-row > .mp-i[href="#our-story"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="about-us"] #q7#q7#q7.cc .mp-row > .mp-i[href="#company"] > .mp-m{ background:url(../../shared/img/identity-plate.webp) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="about-us"] #q7#q7#q7.cc .mp-row > .mp-i[href="#company"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="about-us"] #q7#q7#q7.cc .mp-row > .mp-i[href="#offices"] > .mp-m{ background:url(../../contact/img/emaar.webp) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="about-us"] #q7#q7#q7.cc .mp-row > .mp-i[href="#offices"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="google-ads"] > .mp-m{ background:url(../../our-work/img/r/raika-photography-com.jpg) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="google-ads"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="video-audits"] > .mp-m{ background:url(../../shared/video-thumbnails/yt-mmsaBYqkmRg-640.webp) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="video-audits"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="landing-pages"] > .mp-m{ background:url(../../our-work/img/r/lp-kinam-in.jpg) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="landing-pages"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="meta-ads"] > .mp-m{ background:url(../../our-work/img/mr/eliteflavourscatering-co-in.jpg) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="meta-ads"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="websites"] > .mp-m{ background:url(../../our-work/img/r/andaman-tourism-com.jpg) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="websites"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="careers"] #q7#q7#q7.cc .mp-row > .mp-i:nth-child(1) > .mp-m{ background:url(../../contact/img/codebrew.webp) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="careers"] #q7#q7#q7.cc .mp-row > .mp-i:nth-child(1) > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="careers"] #q7#q7#q7.cc .mp-row > .mp-i:nth-child(2) > .mp-m{ background:url(../../contact/img/statesman-house.jpg) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="careers"] #q7#q7#q7.cc .mp-row > .mp-i:nth-child(2) > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="careers"] #q7#q7#q7.cc .mp-row > .mp-i:nth-child(3) > .mp-m{ background:url(../../contact/img/marchula.jpg) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="careers"] #q7#q7#q7.cc .mp-row > .mp-i:nth-child(3) > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="ads"] > .mp-m{ background:url(../../shared/video-thumbnails/yt-mmsaBYqkmRg-640.webp) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="ads"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="web"] > .mp-m{ background:url(../../our-work/img/r/westernkitchen-in.jpg) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="web"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="accounts"] > .mp-m{ background:url(../../../legal/docs/thumb/company-pan-card.jpg) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="accounts"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="careers"] > .mp-m{ background:url(../../contact/img/codebrew.webp) center / cover no-repeat #E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="careers"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="about-us"] #q7#q7#q7.cc .mp-row > .mp-i[href="#team"] > .mp-m{ background-image:url(../../../mgmt/img/ld-swasthi.webp), url(../../../mgmt/img/ld-gitashri.webp), url(../../../mgmt/img/ld-ankit.webp); background-size:auto 100%, auto 100%, auto 100%; background-position:100% 0, 50% 0, 0 0; background-repeat:no-repeat; background-color:#E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="about-us"] #q7#q7#q7.cc .mp-row > .mp-i[href="#team"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="new"] > .mp-m{ background-image:url(../../../mgmt/img/ld-swasthi.webp), url(../../../mgmt/img/ld-gitashri.webp), url(../../../mgmt/img/ld-ankit.webp); background-size:auto 100%, auto 100%, auto 100%; background-position:100% 0, 50% 0, 0 0; background-repeat:no-repeat; background-color:#E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="new"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="careers"] #q7#q7#q7.cc .mp-row > .mp-i:nth-child(4) > .mp-m{ background-image:url(../../../mgmt/img/ld-shanti.webp), url(../../../mgmt/img/ld-swasthi.webp); background-size:auto 100%, auto 100%; background-position:100% 0, 0 0; background-repeat:no-repeat; background-color:#E6E8EC; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="our-clients"] > .mp-m{ background-image:url(../../our-work/logo/indigo-cabs.png), url(../../our-work/logo/india-tour24.png), url(../../our-work/logo/servo-india.png), url(../../our-work/logo/dr-pearl-s.png); background-size:44% 38%, 44% 38%, 44% 38%, 44% 38%; background-position:6% 14%, 94% 14%, 6% 86%, 94% 86%; background-repeat:no-repeat; background-color:#FFFFFF; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="work"] #q7#q7#q7.cc .mp-row > .mp-i[data-target="our-clients"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="support"] > .mp-m{ background-image:url(../../our-work/logo/indigo-cabs.png), url(../../our-work/logo/india-tour24.png), url(../../our-work/logo/servo-india.png), url(../../our-work/logo/dr-pearl-s.png); background-size:44% 38%, 44% 38%, 44% 38%, 44% 38%; background-position:6% 14%, 94% 14%, 6% 86%, 94% 86%; background-repeat:no-repeat; background-color:#FFFFFF; box-shadow:inset 0 0 0 1px rgba(var(--d5sh),.10); }
html body #overview#overview#overview.ih[data-ih="contact"] #q7#q7#q7.cc .mp-row > .mp-i[data-pick="support"] > .mp-m > svg{ display:none; }
html body #overview#overview#overview.ih[data-ih="careers"] #q7#q7#q7.cc .mp-row > .mp-i > .mp-m .n-num{ position:absolute; left:4px; top:4px; min-width:20px; padding:2px 5px; border-radius:7px; background:#FFFFFF; color:#0E1E35; font-size:12px; line-height:16px; text-align:center; box-shadow:0 1px 2px rgba(var(--d5sh),.25); }