/* Shared UI for consent banner and chat widget placement */
.ss-consent { position: fixed; z-index: 95; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); max-width: 30rem; margin-inline: auto;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; padding: .9rem 1rem; border-radius: 20px;
  background: #ffffff; color: #0c152a; font: 400 .875rem/1.45 "Geist", system-ui, sans-serif;
  box-shadow: 0 0 0 1px oklch(0 0 0 / .06), 0 12px 32px -12px oklch(0.2 0 0 / .28); }
.ss-consent p { margin: 0; flex: 1 1 14rem; }
.ss-consent a { color: #2d57e5; text-underline-position: from-font; }
.ss-consent div { display: flex; gap: .5rem; }
.ss-consent button { min-height: 44px; padding: 0 1rem; border-radius: 999px; border: 0; font: 600 .875rem/1 "Geist", system-ui, sans-serif; cursor: pointer; touch-action: manipulation; transition: transform 160ms cubic-bezier(0.23, 1, 0.32, 1); }
.ss-consent button:active { transform: scale(0.96); }
.ss-consent [data-c="no"], .ss-consent [data-c="essential"] { background: #f1f3f9; color: #0c152a; }
.ss-consent [data-c="yes"] { background: #2d57e5; color: #fff; }
.ss-consent button:focus-visible { outline: 2px solid #2d57e5; outline-offset: 2px; }
/* On phones the sticky WhatsApp / Book a call bar already covers contact, and the floating bubble hid content (spec tables, FAQ, diagram labels). Desktop keeps it. */
@media (prefers-reduced-motion: reduce) { .ss-consent button { transition: none; } }

/* Sit above the mobile action bar when it shows */
:root:has(.mbar.is-on) .ss-consent, :root:has(.mbar.on) .ss-consent { bottom: calc(92px + env(safe-area-inset-bottom, 0px)); }
.ss-consent { transition: bottom 200ms cubic-bezier(0.23, 1, 0.32, 1); }

/* ================= Chat launcher (bottom right) ================= */
.ss-chat { position: fixed; z-index: 75; right: max(16px, env(safe-area-inset-right)); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); display: grid; justify-items: end; gap: 12px;
  font-family: "Geist", system-ui, sans-serif; }
@media (max-width: 959px) { .ss-chat { display: none; } }
@media (max-width: 959px) { .bar-on .ss-chat, :root:has(.mbar.is-on) .ss-chat, :root:has(.mbar.on) .ss-chat { bottom: calc(96px + env(safe-area-inset-bottom, 0px)); } }
.ss-chat__btn { width: 60px; height: 60px; border: 0; border-radius: 9999px; display: grid; place-items: center; cursor: pointer; background: #2d57e5; color: #fff;
  box-shadow: 0 0 0 1px #2145ca, 0 10px 24px -8px oklch(0.45 0.2 266 / .55), inset 0 1px 0 oklch(1 0 0 / .18);
  transition: transform 200ms cubic-bezier(0.23, 1, 0.32, 1), background-color 160ms cubic-bezier(0.23, 1, 0.32, 1); touch-action: manipulation; }
.ss-chat__btn svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; transition: transform 220ms cubic-bezier(0.23, 1, 0.32, 1), opacity 140ms linear; }
.ss-chat__btn:active { transform: scale(0.96); }
.ss-chat__btn:focus-visible { outline: 2px solid #0c152a; outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { .ss-chat__btn:hover { background: #2145ca; transform: translateY(-2px); } }
.ss-chat__btn .ss-chat__close { position: absolute; opacity: 0; transform: rotate(-45deg) scale(.8); }
.ss-chat.is-open .ss-chat__btn .ss-chat__open { opacity: 0; transform: rotate(45deg) scale(.8); }
.ss-chat.is-open .ss-chat__btn .ss-chat__close { opacity: 1; transform: none; }
.ss-chat__nudge { display: none; max-width: 15rem; padding: 10px 14px; border-radius: 16px 16px 4px 16px; background: #ffe034; color: #0c152a; font-size: .875rem; line-height: 1.4; font-weight: 500;
  box-shadow: 0 0 0 1px #0c152a, 0 10px 24px -14px oklch(0.2 0 0 / .5); animation: ssNudge 320ms cubic-bezier(0.23, 1, 0.32, 1) both; }
@keyframes ssNudge { from { opacity: 0; transform: translateY(8px) scale(.96); } to { opacity: 1; transform: none; } }
@media (min-width: 960px) { .ss-chat.is-hinting .ss-chat__nudge { display: block; } }
.ss-chat.is-open .ss-chat__nudge, .ss-chat.is-dismissed .ss-chat__nudge { display: none; }
.ss-chat__panel { width: min(21rem, calc(100vw - 32px)); border-radius: 24px; background: #fff; color: #0c152a; overflow: hidden; transform-origin: 100% 100%;
  box-shadow: 0 0 0 1px oklch(0 0 0 / .06), 0 24px 48px -20px oklch(0.2 0 0 / .38); display: none; }
.ss-chat.is-open .ss-chat__panel { display: block; animation: ssPanel 260ms cubic-bezier(0.23, 1, 0.32, 1) both; }
@keyframes ssPanel { from { opacity: 0; transform: translateY(10px) scale(.97); } to { opacity: 1; transform: none; } }
.ss-chat__head { padding: 16px 18px; background: #0c152a; color: #fff; display: flex; align-items: center; gap: 10px; }
.ss-chat__head b { font-weight: 600; font-size: .9375rem; }
.ss-chat__head span { display: block; font-size: .75rem; color: #b9c0cf; }
.ss-chat__dot { width: 8px; height: 8px; border-radius: 50%; background: #2d57e5; box-shadow: 0 0 0 3px oklch(0.45 0.19 265 / .25); flex: none; }
.ss-chat__body { padding: 18px; display: grid; gap: 12px; font-size: .9375rem; line-height: 1.5; }
.ss-chat__body p { margin: 0; color: #46526c; }
.ss-chat__acts { display: grid; gap: 8px; }
.ss-chat__acts a { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 0 16px; border-radius: 9999px; font-weight: 600; text-decoration: none;
  transition: transform 160ms cubic-bezier(0.23, 1, 0.32, 1), background-color 160ms cubic-bezier(0.23, 1, 0.32, 1); }
.ss-chat__acts a:active { transform: scale(0.96); }
.ss-chat__acts .is-primary { background: #2d57e5; color: #fff; box-shadow: 0 0 0 1px #2145ca; }
.ss-chat__acts .is-quiet { background: #fff; color: #0c152a; box-shadow: 0 0 0 1px #dde1ea; }
@media (hover: hover) and (pointer: fine) { .ss-chat__acts .is-primary:hover { background: #2145ca; } .ss-chat__acts .is-quiet:hover { box-shadow: 0 0 0 1px #778093; } }
.ss-chat__foot { font-size: .75rem; color: #778093; }
@media (prefers-reduced-motion: reduce) {
  .ss-chat__btn, .ss-chat__btn svg, .ss-chat__acts a { transition: none; }
  .ss-chat.is-open .ss-chat__panel, .ss-chat__nudge { animation: none; }
}

/* FAQ: show the first few, reveal the rest on request (all answers stay in the DOM) */
.faq:not(.is-all) details[data-more] { display: none; }
.faq.is-all details[data-more] { animation: faq-in 260ms var(--ease-out, cubic-bezier(.23,1,.32,1)) both; }
@keyframes faq-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
.faq__foot { margin-top: 1.25rem; display: flex; }
.faq__foot .btn { min-height: 2.75rem; }
.faq__count { color: var(--sc-ink-soft); font-weight: 500; margin-inline-start: .25em; }
@media (prefers-reduced-motion: reduce) { .faq.is-all details[data-more] { animation: none; } }

/* FAQ: heading and intro stick on the left while the list scrolls on the right (no empty right side) */
@media (min-width: 1000px) {
  #faq .wrap { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: clamp(2.5rem, 6vw, 6rem); align-items: start; }
  #faq .head { position: sticky; top: 7rem; margin-bottom: 0; }
  #faq .faq { margin-top: 0; max-width: none; }
}

/* Mobile-native baseline */
html { -webkit-tap-highlight-color: transparent; -webkit-text-size-adjust: 100%; }
button, [role="button"], [role="tab"], .btn, .pcard, summary { touch-action: manipulation; -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
input, textarea, select { font-size: max(16px, 1em); }
.rail__track, .how-pan__rail { overscroll-behavior-x: contain; }
@media (max-width: 639px) { .ss-consent { max-width: calc(100vw - 1.5rem); } }


/* Mobile and tablet menu: pages and on-page sections (shown below 960px) */
.nav__menu { display: none; flex: none; width: 44px; height: 44px; margin-left: .35rem; border: 0; border-radius: 50%; background: var(--navy-950); color: var(--navy-0); cursor: pointer; place-items: center; touch-action: manipulation; transition: transform 160ms var(--ease-out); }
.nav__menu:active { transform: scale(.96); }
.nav__menu span { position: relative; display: block; width: 18px; height: 12px; }
.nav__menu i { position: absolute; left: 0; right: 0; height: 2px; border-radius: 2px; background: currentColor; transition: transform 220ms var(--ease-out), top 220ms var(--ease-out); }
.nav__menu i:first-child { top: 2px; } .nav__menu i:last-child { top: 8px; }
.nav__menu[aria-expanded="true"] i:first-child { top: 5px; transform: rotate(45deg); }
.nav__menu[aria-expanded="true"] i:last-child { top: 5px; transform: rotate(-45deg); }
.nav__sheet { z-index: 5; position: absolute; top: calc(100% + 8px); left: 0; right: 0; max-height: calc(100svh - 6.5rem); overflow-y: auto; overscroll-behavior: contain; padding: 1rem; border-radius: var(--r-card, 24px); background: var(--navy-0); box-shadow: var(--shadow-float); animation: navsheet 200ms var(--ease-out) both; }
.nav__sheet[hidden] { display: none; }
@keyframes navsheet { from { opacity: 0; transform: translateY(-6px) scale(.98); } to { opacity: 1; transform: none; } }
.nav__sh { margin: 0 0 .5rem .25rem; font: 600 .75rem/1.3 var(--sc-font-text); letter-spacing: .06em; text-transform: uppercase; color: var(--sc-ink-soft); }
.nav__sh:not(:first-child) { margin-top: 1rem; }
.nav__pg { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .4rem; }
.nav__pg a { display: grid; place-items: center; min-height: 48px; border-radius: var(--r-pill); background: var(--navy-50); color: var(--navy-950); font-weight: 700; font-size: .9375rem; text-decoration: none; }
.nav__pg a[aria-current="page"] { background: var(--navy-950); color: var(--navy-0); }
.nav__ls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .25rem .5rem; }
.nav__ls a { display: flex; align-items: center; min-height: 48px; padding: 0 .85rem; border-radius: 14px; color: var(--navy-950); font-weight: 500; font-size: 1rem; text-decoration: none; }
.nav__ls a:active, .nav__pg a:active { background: var(--navy-50); }
@media (max-width: 1099px) { .nav__menu { display: grid; } .nav { position: fixed; } }
@media (min-width: 960px) and (max-width: 1099px) { .nav .nav__links { display: none !important; } .nav .brand, .nav__word { flex: none; } }
@media (min-width: 1100px) { .nav__sheet, .nav__menu { display: none !important; } }




/* Riso art placeholders (duotone, brand inks) */
.poster__img, .case__photo img, .about__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.poster__art { background: #f7f4ec; overflow: hidden; }
.poster__art .poster__scrim { display: none; }
.poster__art .poster__title { left: .75rem; right: auto; bottom: .75rem; max-width: calc(100% - 1.5rem); padding: .4rem .7rem; border-radius: 12px; background: var(--navy-950); color: #fff; font-size: .9375rem; line-height: 1.2; box-shadow: var(--shadow-border); }
.poster__badge { z-index: 1; }
.case__photo, .about__photo { position: relative; overflow: hidden; }
.about__photo { background: #f7f4ec; }
.dstack__art { display: block; width: 100%; height: 9rem; object-fit: cover; border-radius: 16px; }
@media (min-width: 760px) {
  .dstack .dstack__card { padding-right: calc(min(40%, 26rem) + 2.5rem); }
  .dstack .dstack__art { position: absolute; right: 1.25rem; top: 3.5rem; bottom: 1.25rem; width: min(40%, 26rem); height: auto; }
}

/* Mobile + tablet bar: menu left, logo centre, call right; page tabs on a second row */
.nav__short { display: none; }
@media (max-width: 479px) { .nav__long { display: none; } .nav__short { display: inline; } }
@media (max-width: 959px) {
  header.nav { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); grid-template-rows: auto auto; align-items: center; column-gap: .5rem; row-gap: 6px; padding: 8px; border-radius: 28px; }
  header.nav .nav__menu { grid-area: 1 / 1; justify-self: start; margin: 0; }
  header.nav .brand { grid-area: 1 / 2; justify-self: center; gap: .4rem; }
  header.nav .btn { grid-area: 1 / 3; justify-self: end; padding-inline: 1rem; font-size: .875rem; white-space: nowrap; }
  header.nav .pillar-nav { grid-area: 2 / 1 / 3 / 4; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
  header.nav .pillar-nav a { text-align: center; padding: .55rem .25rem; font-size: .875rem; }
  header.nav .nav__word { height: 17px; }
  .nav__sheet { max-height: calc(100svh - 9rem); }
  .nav ~ main > :first-child, .nav ~ main .hero { scroll-margin-top: 7rem; }
  .nav ~ main .hero { padding-top: calc(140px + env(safe-area-inset-top, 0px)); }
}

/* Footer links: 44px tap area on touch screens (was 32px) */
@media (pointer: coarse) { .foot > div a { min-height: 44px; } }

/* Currency note: the "Show prices in ₹" control is a button styled as a link */
button.link { background: none; border: 0; padding: 0; font: inherit; font-weight: 500; color: var(--accent-text, var(--sc-accent)); text-decoration: underline; text-underline-offset: .22em; cursor: pointer; min-height: 44px; }
.plan__price { white-space: nowrap; }