/* Keep headings in document flow; frame the original 3D installations for phones. */
@media (max-width: 900px) {
  .section-head > *, .release-readout > *, .service-section-head > * { min-width: 0; }
  .section-head { flex-wrap: wrap; }
  .service-tile-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 40px; }
  .service-tile { transform: none; }
}

@media (max-width: 699px) {
  :root { --pad: 6vw; }
  html { scroll-padding-top: 86px; }
  h1, h2, h3, p, a, button, address { overflow-wrap: anywhere; }
  .header, .past-opening .header { height: 76px; min-height: 76px; padding: 14px var(--pad); gap: 10px; }
  .header .wordmark { flex-shrink: 0; }
  .header .motion { width: 40px; height: 40px; }
  .nav-toggle { min-height: 44px; }
  .header nav { max-height: calc(100dvh - 100px); overflow-y: auto; }
  .header nav a, .header nav a:last-child { padding: 16px 12px; }

  /* A 16:9 film needs 219px at 390px wide, not a full phone viewport. */
  .opening { height: auto; min-height: 0; aspect-ratio: 16 / 9; margin-top: 76px; }
  .opening .opening-film { top: 0; left: 0; width: 100% !important; height: 100% !important; transform: none; }
  .opening-fade { height: 15%; }

  .hero { height: auto; min-height: 0; padding: 40px var(--pad) 48px; }
  .hero-top, .hero-bottom, .brand-orbit-tools { position: relative; inset: auto; }
  .hero-top .eyebrow, .eyebrow { font-size: 10px; line-height: 1.65; letter-spacing: .08em; }
  .hero #hero-title { font-size: clamp(38px, 12vw, 78px); max-width: 100%; line-height: 1; }
  .ribbon-stage { position: relative; inset: auto; margin: 28px 0 0; }
  #brand-fallback:not([hidden]) {
    display: grid !important; position: relative; inset: auto;
    grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 66%;
    gap: 16px; overflow-x: auto; overflow-y: hidden; padding: 6px 4px 22px;
    scroll-snap-type: x mandatory; scroll-padding-inline: 4px; scrollbar-width: thin;
    scrollbar-color: #b33850 #ffffff0a; -webkit-overflow-scrolling: touch;
  }
  #brand-fallback .brand-card {
    display: flex; flex-direction: column; justify-content: center; align-items: center;
    min-width: 0; min-height: 235px; padding: 26px 22px; gap: 24px;
    border: 1px solid #e8657c99; border-radius: 22px; scroll-snap-align: start;
    background: linear-gradient(135deg, #f4e7f424, #7c183322 55%, #ffffff0a);
    box-shadow: inset 0 1px 0 #ffccd577, inset 0 -1px 0 #e9446680;
    backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  }
  #brand-fallback .brand-card img { width: 100%; height: 105px; object-fit: contain; border-radius: 0; }
  #brand-fallback .brand-card span { font-size: 12px; line-height: 1.5; text-align: center; }
  .brand-orbit-tools { display: block; margin-top: 12px; }
  .brand-orbit-tools > div { justify-content: center; gap: 12px; }
  .brand-orbit-tools button { min-height: 44px; min-width: 44px; font-size: 11px; }
  #brand-work-link { display: none; }
  .hero-bottom { margin-top: 26px; gap: 20px; align-items: center; }
  .hero-bottom .tiny { font-size: 9px; line-height: 1.7; }
  .hero-bottom .text-link { min-width: 0; font-size: 14px; }
  .hero-bottom .round-link { flex-shrink: 0; }
  .hero-bottom .drag-note { display: none; }

  .work, .latest, .collections, .people, .services-summary { padding: 52px var(--pad); }
  .section-head { display: flex; flex-direction: column; align-items: stretch; gap: 24px; }
  .reveal-heading .heading-line { max-width: 100%; white-space: normal; }
  .section-head h2, .work .section-head h2, .latest .section-head h2,
  .collections .section-head h2 { font-size: clamp(36px, 11.8vw, 76px); line-height: 1.02; }
  .section-head .text-link { align-self: flex-start; font-size: 14px; max-width: 100%; }
  .latest-intro { max-width: none; font-size: 13px; }
  #orbit-fallback:not([hidden]) { display: block !important; padding: 0; }
  .orbit-fallback > .eyebrow { font-size: 9px; margin-bottom: 14px; }
  .orbit-fallback-grid {
    grid-template-columns: none; grid-template-rows: repeat(2, auto); grid-auto-flow: column;
    grid-auto-columns: 78%; gap: 18px; max-height: none; padding: 4px 4px 20px;
    overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory;
    scroll-padding-inline: 4px; align-items: stretch; -webkit-overflow-scrolling: touch;
  }
  .orbit-fallback .film-card { min-width: 0; scroll-snap-align: start; padding: 9px; border: 1px solid #e8657c80; border-radius: 20px; background: linear-gradient(140deg,#e5d6e51c,#70203a1c); }
  .orbit-fallback .image { aspect-ratio: 16 / 9; overflow: hidden; border-radius: 13px; }
  .orbit-fallback .image img { width: 100%; height: 100%; object-fit: cover; }
  .orbit-fallback strong { padding: 14px 6px 8px; font-size: 14px; line-height: 1.45; }
  .work-tail { gap: 20px; margin-top: 22px; font-size: 14px; line-height: 1.6; }
  .work-tail .round-link { width: 48px; height: 48px; flex-shrink: 0; }

  .release-screen > img { border-radius: 14px; }
  .release-readout { flex-direction: column; align-items: stretch; gap: 20px; margin-top: 24px; }
  .release-readout h3 { font-size: 26px; line-height: 1.2; }
  .release-readout .eyebrow { font-size: 10px; }
  .release-play { align-self: flex-start; min-height: 44px; font-size: 11px; padding: 12px 18px; }
  .release-transport { gap: 12px; }
  .release-transport > button { width: 44px; height: 44px; flex-shrink: 0; }
  .release-transport p { min-width: 0; flex: 1; font-size: 11px; }
  .release-transport small { font-size: 9px; line-height: 1.5; letter-spacing: 0; }
  .jog-wheel { width: 48px; height: 48px; flex-shrink: 0; }
  .release-index { grid-template-columns: 1fr; }
  .release-index button { font-size: 13px; line-height: 1.5; padding: 16px 10px; }

  .summary-intro { margin-top: 0; max-width: none; }
  .services-summary .section-head { display: flex; }
  .summary-intro > p { font-size: 14px; line-height: 1.75; }
  .service-tile-grid { grid-template-columns: 1fr; gap: 18px; margin-top: 28px; padding-bottom: 0; }
  .service-tile, .service-tile:nth-child(4) { transform: none; }
  .service-tile a { padding: 26px; min-height: 0; }
  .service-tile h3 { font-size: 30px; line-height: 1.15; min-height: 0; }
  .service-tile p { font-size: 14px; line-height: 1.7; }
  .service-tile-number, .service-tile-cta { font-size: 10px; line-height: 1.6; }
  .service-mark { margin: 26px auto 20px; }

  .folder-grid { grid-template-columns: 1fr; gap: 76px; max-width: 360px; margin: 86px auto 35px; padding: 0 12px; }
  .glass-folder { height: 255px; }
  .folder-posters img { height: 178px; }
  .folder-label b { font-size: 24px; }
  .folder-label small { font-size: 10px; }
  .other-collections { gap: 10px; }
  .other-collections button { min-height: 44px; font-size: 12px; }
  .services-entry { margin-top: 36px; line-height: 1.7; }

  .studio-heading, .team-heading { padding: 24px 20px; }
  .studio-heading h2, .team-heading h2 { font-size: clamp(28px, 8.5vw, 54px); line-height: 1.1; }
  .studio-heading > p, .team-heading > p { font-size: 14px; line-height: 1.75; }
  .founders { grid-template-columns: 1fr; gap: 24px; padding: 0; }
  .founder, .founder:nth-child(2) { margin: 0; height: auto; transform: none; }
  .founder-image { height: auto; aspect-ratio: 4 / 3; transform: none; }
  .founder-caption { min-height: 0; transform: none; padding: 22px 14px; }
  .founder-caption h3 { font-size: 29px; line-height: 1.2; max-width: 100%; }
  .founder-caption .bio, .founder-caption .role { font-size: 14px; line-height: 1.7; }
  .crew-section { padding: 52px 0 0; }
  .team-hint { display: block; font-size: 10px; line-height: 1.7; }
  .team-hint span { display: block; margin-top: 8px; font-size: 9px; }
  .team-stage .crew-portrait { aspect-ratio: 4 / 3; }
  .team-stage .crew-caption { min-height: 0; padding: 24px 14px; transform: none; }
  .team-stage .crew-caption h3 { font-size: 28px; line-height: 1.2; }
  .team-stage .crew-caption > p { font-size: 14px; min-height: 0; }
  .team-stage .crew-profile-link { font-size: 12px; min-height: 44px; }
  .team-controls { margin-top: 24px; gap: 16px; }
  .team-controls button { width: 44px; height: 44px; }
  .team-controls p { font-size: 12px; line-height: 1.5; }
  .team-index { padding: 22px 0 0; flex-wrap: wrap; }
  .team-index button { min-width: 44px; min-height: 44px; }

  .contact { padding: 52px var(--pad) 28px; }
  .contact h2 { font-size: clamp(42px, 12.5vw, 84px); line-height: 1; }
  .contact-arrow { font-size: 16vw; }
  .contact-bottom { grid-template-columns: 1fr; margin-top: 36px; gap: 24px; font-size: 14px; }
  .contact-bottom > div:first-child > a:first-child { font-size: clamp(13px, 4.1vw, 20px); }
  .contact footer, .service-footer { flex-wrap: wrap; gap: 18px; font-size: 10px; line-height: 1.7; }

  .services-hero { padding: 110px var(--pad) 0; min-height: 0; }
  .services-hero h1 { font-size: clamp(38px, 11.5vw, 76px); line-height: 1.08; }
  .services-intro { font-size: 14px; line-height: 1.75; }
  .service-hero-footer { line-height: 1.7; font-size: 9px; }
  .service-section { padding: 52px var(--pad); }
  .service-section-head h2 { font-size: clamp(34px, 10.5vw, 70px); line-height: 1.08; }
  .service-section-head > p:last-child { font-size: 14px; line-height: 1.75; }
  .capability-tabs { gap: 12px; }
  .capability-tabs button { min-height: 112px; font-size: 15px; line-height: 1.4; padding: 16px; }
  .capability-panel { grid-template-columns: minmax(0, 1fr); margin-bottom: 0; padding: 12px; }
  .capability-art { min-height: 0; aspect-ratio: 4 / 3; }
  .capability-copy { min-width: 0; padding: 22px 10px; }
  .capability-copy h3 { font-size: 32px; line-height: 1.15; }
  .capability-copy > p:not(.eyebrow), .capability-copy li { font-size: 14px; line-height: 1.7; }
  .production-process { grid-template-columns: 1fr; gap: 18px; padding-bottom: 0; }
  .production-process li { min-height: 0; padding: 26px; transform: none; }
  .production-process p { font-size: 14px; line-height: 1.7; }
  .production-process li > span { font-size: 10px; }
  .service-contact h2 { font-size: 12.5vw; line-height: 1.08; }

  .cinema { height: 100dvh; max-height: 100dvh; padding: 0; }
  .cinema[open] { display: flex; flex-direction: column; }
  .cinema-header { position: relative; inset: auto; flex-shrink: 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; padding: 14px var(--pad); }
  .cinema-header .back-button { text-align: left; min-height: 44px; font-size: 12px; }
  .cinema-header .icon-button { grid-column: 2; grid-row: 1; width: 44px; height: 44px; }
  .cinema-view { grid-column: 1 / -1; justify-self: start; }
  .cinema-view button { min-height: 40px; font-size: 12px; }
  .cinema-filters { position: relative; inset: auto; flex-shrink: 0; margin: 0 var(--pad) 12px; padding: 0 0 8px; }
  .cinema-filters button { min-height: 40px; font-size: 12px; flex-shrink: 0; }
  #wall-space { position: relative; inset: auto; height: auto; flex: 1; min-height: 0; }
  .index-panel { position: relative; inset: auto; flex: 1; min-height: 0; margin: 0 var(--pad); padding: 12px; }
  .film-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 14px; }
  .film-card strong { line-height: 1.45; font-size: 13px; }
  .search-label input { font-size: 16px; }
  .cinema-info { position: relative; inset: auto; flex-shrink: 0; width: 100%; max-width: none; padding: 20px var(--pad) max(20px, env(safe-area-inset-bottom)); }
  .cinema-info h2 { font-size: 26px; line-height: 1.15; padding-right: 110px; }
  .showing-index .cinema-info h2 { padding-right: 0; }
  .showing-index #hover-title { display: none; }
  .cinema-info .eyebrow { font-size: 9px; line-height: 1.6; }
  #hover-title { display: none; }
  .cinema-controls { right: var(--pad); bottom: max(20px, env(safe-area-inset-bottom)); padding: 3px; gap: 4px; }
  .cinema-controls button { width: 36px; height: 40px; }
  .cinema-controls #page-count { min-width: 12px; font-size: 11px; }
  .film-dialog, .profile-dialog, .brands-dialog { max-height: calc(100dvh - 24px); overflow-y: auto; max-width: calc(100vw - 24px); }
  .film-meta h2, .profile-content h2 { font-size: 28px; line-height: 1.2; }
  .film-meta > p:not(.eyebrow), #profile-bio { font-size: 14px; line-height: 1.7; }
  .brands-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .brands-dialog h2 { font-size: 30px; line-height: 1.15; }
  .profile-content { padding: 28px 22px; }
}

@media (max-width: 360px) {
  .header { gap: 6px; }
  .header .wordmark b { font-size: 12px; }
  .capability-tabs { grid-template-columns: 1fr; }
  .capability-tabs button { min-height: 80px; }
  .film-grid { grid-template-columns: 1fr; }
}

/* Same rendering and motion as desktop, inside phone-sized scene containers. */
@media (max-width: 699px) {
  .hero, .work, .latest, .people { overflow: hidden; }
  .ribbon-stage { height: clamp(350px, 100vw, 480px); margin: 18px calc(-1 * var(--pad)) 0; }
  #brand-space, #orbit-space { display: block; width: 100%; height: 100%; touch-action: pan-y; }
  #brand-space[hidden], #orbit-space[hidden] { display: none; }
  #brand-fallback[hidden], #orbit-fallback[hidden] { display: none !important; }
  #brand-work-link:not([hidden]) { display: block; text-align: center; font-size: 12px; min-height: 44px; padding: 10px 0; }
  .orbit-stage { height: clamp(370px, 110vw, 540px); min-height: 0; margin: 24px calc(-1 * var(--pad)) 0; }
  .has-film-fallback.orbit-stage { height: auto; margin-inline: 0; }
  .orbit-instruction { bottom: 0; left: var(--pad); max-width: 44%; font-size: 8px; }
  .orbit-instruction small { font-size: 7px; }
  .orbit-tools { right: var(--pad); bottom: 0; }
  .orbit-tools button { min-height: 44px; }
  .release-stage { height: clamp(280px, 80vw, 440px); width: 100vw; margin: 22px calc(-1 * var(--pad)) 0; perspective: 1000px; overflow: hidden; }
  .release-frame { width: 72%; aspect-ratio: 16 / 10; }
  .release-readout { margin-top: 8px; }
  .team-stage { height: 600px; margin-top: 24px; perspective: 900px; }
  .team-stage .crew-card { top: 39%; width: 68vw; max-width: 300px; }
  .team-stage .crew-caption { padding: 20px 12px; }
  .team-stage .crew-caption h3 { font-size: 24px; }
  .team-stage .crew-caption > p { font-size: 12px; }
  .team-stage .crew-profile-link { margin-top: 10px; }
  .team-controls { margin-top: 0; }
  .service-tile-grid { gap: 145px; padding-bottom: 130px; }
  .service-tile { transform: rotateY(-5deg); }
  .founders { gap: 230px; padding-bottom: 200px; }
  .capability-panel { margin-bottom: 260px; }
  .production-process { gap: 120px; padding-bottom: 110px; }
  .craft-object { height: 390px; width: 100%; max-width: 460px; margin: 12px auto 0; }
}

/* Phone composition: shared centre line and independent space for each control. */
@media (max-width: 699px) {
  .header, .past-opening .header { border-bottom: 0; background: linear-gradient(#08090bf7 72%,#08090bd9 90%,#08090b00); box-shadow: none; }
  .hero, .work, .latest, .collections, .people, .services-summary { border: 0; background-color: #08090b; background-image: radial-gradient(ellipse at 50% 48%,#74172b24,transparent 72%); }
  .hero-top, .section-head, .latest .section-head, .services-summary .section-head { display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:20px; width:100%; }
  .section-head > div, .section-head > p, .hero-top > * { width:100%; min-width:0; }
  .hero-top .eyebrow, .section-head .eyebrow { margin-bottom:16px; }
  .hero #hero-title, .section-head h2, .work .section-head h2, .latest .section-head h2, .collections .section-head h2 { font-size:clamp(34px,10.5vw,64px); line-height:1.08; letter-spacing:-.045em; max-width:100%; margin-inline:auto; text-wrap:balance; }
  .section-head .text-link, .summary-intro .text-link { align-self:center; margin-inline:auto; }
  .latest-intro { max-width:30ch; padding:0; margin:0 auto; line-height:1.7; text-align:center; }
  .hero-bottom { display:flex; flex-direction:column; align-items:center; text-align:center; gap:20px; margin-top:16px; }
  .hero-bottom .text-link { justify-content:center; gap:28px; }
  .hero-bottom .round-link { position:static; margin:0; transform:none; }
  .brand-orbit-tools { margin-top:20px; display:flex; flex-direction:column; align-items:center; gap:12px; }
  .brand-orbit-tools > div { margin:0; display:flex; justify-content:center; flex-wrap:wrap; }
  #brand-work-link:not([hidden]) { width:100%; max-width:100%; line-height:1.6; border:0; }
  .ribbon-stage:before,.ribbon-stage:after,.orbit-stage:before,.orbit-stage:after { display:none; }
  .orbit-stage { padding-bottom:76px; height:clamp(440px,125vw,600px); }
  #orbit-space { height:calc(100% - 76px); }
  .orbit-instruction { bottom:51px; left:0; right:0; max-width:none; justify-content:center; text-align:center; }
  .orbit-instruction small { display:none; }
  .orbit-tools { bottom:0; left:0; right:0; justify-content:center; }
  .has-film-fallback.orbit-stage { padding-bottom:0; }
  .work-tail { flex-direction:column; text-align:center; gap:18px; }
  .release-console { border:0; box-shadow:none; }
  .release-stage { height:clamp(235px,68vw,330px); margin-top:28px; }
  .release-frame { width:76%; aspect-ratio:16/10; top:48%; }
  .release-readout { border:0; padding:20px 0 8px; margin-top:0; text-align:center; align-items:center; gap:18px; }
  .release-readout h3 { font-size:clamp(23px,6.4vw,30px); line-height:1.3; text-wrap:balance; }
  .release-play { align-self:center; }
  .release-transport { display:grid; grid-template-columns:44px 48px minmax(0,1fr) 44px; gap:10px; padding:24px 0; }
  .release-transport p { min-width:0; text-align:center; line-height:1.5; }
  .release-transport small { font-size:8px; }
  .release-index { border:0; gap:4px; }
  .release-index button { border:0; border-radius:10px; }
  .release-index button[aria-pressed=true] { background:linear-gradient(90deg,#8a203326,transparent); }
  .text-link, .dark-link { border-bottom:0; }
  .studio-heading, .team-heading { text-align:center; }
  .studio-heading > p, .team-heading > p { max-width:38ch; margin-inline:auto; }
  .summary-intro { text-align:center; }
  .contact h2 { padding-right:0; text-align:center; }
  .contact-arrow { position:static; display:block; text-align:center; margin-top:24px; font-size:44px; }
}
@media (max-width:360px) {
  .release-transport { grid-template-columns:44px minmax(0,1fr) 44px; }
  .release-transport .jog-wheel { display:none; }
}

/* Original studio badge beside the wordmark on every screen. */
.header .wordmark b{display:flex;align-items:center;gap:7px}
.header .studio-logo{display:inline-block;width:48px;height:48px;object-fit:cover;flex-shrink:0;margin-block:-13px}
@media(max-width:699px){.header .studio-logo{width:38px;height:38px;margin-block:-10px}.header .wordmark b{gap:4px}}
/* Keep the full hairline visible in Lovesh's supplied studio portrait. */
img[src$="lovesh-nagar-studio-v2-20261028.png"]{object-position:50% 0%!important}
