/* UR v32 — mobile-first museum experience + viewport-fit hardening.
   Includes v31 mobile treatment and fixes intrinsic grid sizing / RTL off-canvas width. */
.ur-mobile-quick{display:none}
.mobile-next-chapter{display:none}

/* Keep the accessibility skip link out of intrinsic layout width in LTR and RTL. */
.dynamic-site .skip-link:not(:focus){left:auto;right:auto;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}

@media (max-width:760px){
  /* Comfortable phone canvas */
  /* Use fixed logical gutters instead of percentage width inside grid containers.
     A percentage-width grid item can size its auto track from max-content, which made
     the hero 600–1100px wide on 320–480px phones and then silently clipped it. */
  .dynamic-site .container{width:auto;max-width:none;margin-inline:14px;min-width:0}
  .dynamic-site main{overflow-x:clip;overflow-y:visible}

  .dynamic-site :where(p,li,dd,small){text-wrap:pretty}

  /* Compact parent trail: always readable, never a second bulky header. */
  .dynamic-site .ur-parent-bar-inner{min-height:42px;padding-block:7px;gap:10px}
  .dynamic-site .ur-parent-primary{font-size:10px;line-height:1.35;white-space:normal}
  .dynamic-site .ur-parent-home{font-size:7.5px;white-space:nowrap}

  /* Cinematic hero that feels like a mobile cover, not a desktop crop. */
  .dynamic-site .hero{min-height:82svh;align-items:end}
  .dynamic-site .hero-media{background-position:58% center;transform:scale(1.035) translate3d(0,var(--hero-shift,0px),0)}
  .dynamic-site .hero-overlay{background:
    linear-gradient(180deg,rgba(9,8,7,.08) 0%,rgba(10,8,7,.17) 24%,rgba(10,8,7,.64) 60%,rgba(12,9,7,.97) 100%),
    linear-gradient(90deg,rgba(8,7,6,.34),transparent 78%)}
  .dynamic-site .hero-content{padding:3.4rem 0 1.6rem}
  .dynamic-site .hero .eyebrow{font-size:.66rem;line-height:1.55;margin:0 0 .45rem;max-width:96%;opacity:.96}
  .dynamic-site .hero h1{font-size:clamp(5.5rem,29vw,8rem);line-height:.9;margin:.55rem 0 1rem;letter-spacing:-.045em}
  .dynamic-site .hero-deck{font-size:clamp(1rem,4.5vw,1.2rem);line-height:1.52;margin-bottom:1.15rem;max-width:34rem;text-shadow:0 2px 12px rgba(0,0,0,.35)}
  html[lang="ar"] .dynamic-site .hero h1{font-size:clamp(5.25rem,27vw,7.2rem);line-height:1.05;margin:.5rem 0 1rem;letter-spacing:0}
  html[lang="ar"] .dynamic-site .hero .eyebrow{line-height:1.72}
  html[lang="ar"] .dynamic-site .hero-deck{line-height:1.72}
  html[lang="he"] .dynamic-site .hero h1{line-height:1.02;letter-spacing:0}
  html[lang="he"] .dynamic-site .hero-deck{line-height:1.62}

  /* Embassy publisher stamp becomes a compact identity card. */
  .dynamic-site .ur-embassy-stamp{width:100%;max-width:100%;grid-template-columns:38px minmax(0,1fr);gap:9px;margin:0 0 1rem;padding:8px 10px 8px 8px;border-radius:13px;background:rgba(6,18,28,.72);box-shadow:0 10px 28px rgba(0,0,0,.16)}
  .dynamic-site .ur-embassy-stamp-mark{width:38px;height:38px;font-size:9.5px}
  .dynamic-site .ur-embassy-stamp-copy small{font-size:7px}
  .dynamic-site .ur-embassy-stamp-copy strong{font-size:10.7px;line-height:1.35}
  .dynamic-site .ur-embassy-stamp-copy em{font-size:7.8px}

  /* Two obvious actions, thumb-sized and balanced. */
  .dynamic-site .hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem}
  .dynamic-site .hero-actions .button{min-height:47px;padding:.65rem .75rem;border-radius:13px;font-size:.78rem;line-height:1.25;text-align:center}
  .dynamic-site .hero-actions .button.primary{box-shadow:0 8px 20px rgba(200,162,95,.18)}

  /* Key facts become a swipeable fact reel instead of a tall 2x2 block. */
  .dynamic-site .hero-stats{display:grid!important;grid-auto-flow:column;grid-template-columns:none!important;grid-auto-columns:minmax(154px,68vw);gap:.65rem;margin:1.25rem -14px 0;padding:1rem 14px .45rem;border-top:1px solid rgba(255,255,255,.22);overflow-x:auto;scroll-snap-type:inline mandatory;overscroll-behavior-inline:contain;scrollbar-width:none}
  .dynamic-site .hero-stats::-webkit-scrollbar{display:none}
  .dynamic-site .hero-stats>div{min-height:82px;padding:.75rem .85rem;border-radius:14px;scroll-snap-align:start;background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.045));border-color:rgba(255,255,255,.16)}
  .dynamic-site .hero-stats dt{font-size:.57rem;line-height:1.35}
  .dynamic-site .hero-stats dd{font-size:.94rem;line-height:1.35}

  /* A fast four-stop tour appears only on phones. */
  .ur-mobile-quick{display:block;position:relative;z-index:8;background:#15100c;color:#fff;padding:12px 0 16px;border-top:1px solid rgba(255,255,255,.08)}
  .ur-mobile-quick .container{width:100%;margin-inline:0;padding-inline:14px}
  .ur-mobile-quick-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 9px}
  .ur-mobile-quick-head strong{font-size:.69rem;letter-spacing:.09em;text-transform:uppercase;color:#d9bd86}
  .ur-mobile-quick-head small{color:#948b80;font-size:.64rem}
  html[dir="rtl"] .ur-mobile-quick-head strong{letter-spacing:0;text-transform:none}
  .ur-mobile-quick-track{display:grid;grid-auto-flow:column;grid-template-columns:none;grid-auto-columns:minmax(142px,43vw);gap:8px;overflow-x:auto;scroll-snap-type:inline mandatory;scrollbar-width:none;padding-bottom:2px}
  .ur-mobile-quick-track::-webkit-scrollbar{display:none}
  .ur-mobile-quick a{display:grid;grid-template-columns:34px minmax(0,1fr);align-items:center;gap:9px;min-height:58px;padding:9px 10px;border:1px solid rgba(255,255,255,.11);border-radius:14px;background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025));color:#f6efe7;text-decoration:none;scroll-snap-align:start}
  .ur-mobile-quick a:active{transform:scale(.985);background:rgba(214,168,95,.15)}
  .ur-mobile-quick a span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:rgba(214,168,95,.13);color:#dfbf85;font-size:.62rem;font-weight:900;letter-spacing:.04em}
  .ur-mobile-quick a b{font-size:.76rem;line-height:1.25;font-weight:800}
  html[lang="ar"] .ur-mobile-quick a b{line-height:1.55}
  html[lang="he"] .ur-mobile-quick a b{line-height:1.4}

  /* Intro becomes a friendly sheet rising from the dark opening sequence. */
  .dynamic-site .intro-band{position:relative;z-index:6;margin-top:-1px;padding:2.75rem 0 2.9rem;border-radius:24px 24px 0 0;background:#fffaf1}
  .dynamic-site .intro-grid{display:block}
  .dynamic-site .intro-grid h2{font-size:clamp(2.1rem,10vw,2.8rem);line-height:1.12;margin:.35rem 0 1.25rem}
  .dynamic-site .intro-copy{font-size:1rem;line-height:1.72}
  .dynamic-site .intro-copy p{margin-bottom:1rem}
  html[lang="ar"] .dynamic-site .intro-grid h2{font-size:clamp(2rem,9.5vw,2.65rem);line-height:1.32}
  html[lang="ar"] .dynamic-site .intro-copy{line-height:1.86}

  /* Evidence controls remain available but stop occupying the viewport. */
  .dynamic-site .evidence-strip{position:relative;top:auto;z-index:3;padding:.6rem 0;background:#eee1cc}
  .dynamic-site .evidence-grid{display:flex;flex-wrap:nowrap;gap:.42rem;overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none;padding-bottom:2px}
  .dynamic-site .evidence-grid::-webkit-scrollbar{display:none}
  .dynamic-site .evidence-label{width:auto;flex:0 0 auto;align-self:center;margin:0 .2rem 0 0;font-size:.62rem}
  .dynamic-site .evidence-chip,.dynamic-site .evidence-reset{flex:0 0 auto;min-height:34px;padding:.4rem .65rem;background:rgba(255,255,255,.62);font-size:.66rem;white-space:nowrap}

  /* Chapter chooser: visible peek + stronger visual rhythm. */
  .dynamic-site .explore-deck{padding:3rem 0 3.3rem}
  .dynamic-site .explore-deck-head{display:block;margin-bottom:1.4rem}
  .dynamic-site .explore-deck h2{font-size:clamp(2.15rem,10vw,2.8rem);line-height:1.08;margin:.3rem 0 0}
  .dynamic-site .explore-deck-head>p{margin:.8rem 0 0;font-size:.9rem;line-height:1.62;color:#c1b7aa}
  html[lang="ar"] .dynamic-site .explore-deck h2{line-height:1.3}
  .dynamic-site .chapter-cards{grid-auto-columns:82vw;gap:.7rem;margin-inline:-14px;padding-inline:14px 12vw;padding-bottom:.35rem}
  .dynamic-site .chapter-card{min-height:154px;padding:1rem;border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.085),rgba(255,255,255,.025));box-shadow:0 12px 28px rgba(0,0,0,.1)}
  .dynamic-site .chapter-card:nth-child(4n+1){background:linear-gradient(145deg,rgba(214,168,95,.16),rgba(255,255,255,.025))}
  .dynamic-site .chapter-card:nth-child(4n+2){background:linear-gradient(145deg,rgba(62,101,109,.18),rgba(255,255,255,.025))}
  .dynamic-site .chapter-card:nth-child(4n+3){background:linear-gradient(145deg,rgba(125,73,48,.18),rgba(255,255,255,.025))}
  .dynamic-site .chapter-card strong{font-size:1.28rem;line-height:1.22}
  .dynamic-site .chapter-card em{font-size:.73rem;line-height:1.45}
  .dynamic-site .chapter-arrow{width:32px;height:32px}
  html[lang="ar"] .dynamic-site .chapter-card strong{line-height:1.45}

  /* Section pacing: shorter, clearer, less like an endless article. */
  .dynamic-site .section{padding:3.7rem 0}
  .dynamic-site .section-heading{display:block;margin-bottom:1.85rem}
  .dynamic-site .section-heading h2{font-size:clamp(2.05rem,9.6vw,2.65rem);line-height:1.13;margin:.32rem 0 .85rem}
  .dynamic-site .section-heading>p:last-child{font-size:.91rem;line-height:1.65;margin:0;color:#6b625a}
  .dynamic-site .midnight .section-heading>p:last-child,.dynamic-site .sources-section .section-heading>p:last-child{color:#c5bbb0}
  html[lang="ar"] .dynamic-site .section-heading h2{font-size:clamp(2rem,9vw,2.55rem);line-height:1.34}
  html[lang="ar"] .dynamic-site .section-heading>p:last-child{line-height:1.82}
  html[lang="he"] .dynamic-site .section-heading h2{line-height:1.27}

  /* Filter chips stay on one swipe row. */
  .dynamic-site .timeline-controls{display:flex;flex-wrap:nowrap;gap:.4rem;overflow-x:auto;scrollbar-width:none;margin:0 0 1rem;padding-bottom:2px}
  .dynamic-site .timeline-controls::-webkit-scrollbar{display:none}
  .dynamic-site .timeline-filter{flex:0 0 auto;min-height:36px;padding:.42rem .72rem;font-size:.67rem;white-space:nowrap}

  /* Museum rails: one focused card with a peek of the next. */
  .dynamic-site .timeline,.dynamic-site .feature-grid.three,.dynamic-site .ruler-grid,.dynamic-site .topic-grid,.dynamic-site .legacy-grid,.dynamic-site .az-grid,.dynamic-site .source-grid{grid-auto-columns:86vw!important;gap:.72rem!important;margin-inline:-14px!important;padding-inline:14px 14vw!important;padding-bottom:.75rem!important}
  .dynamic-site .az-grid{grid-auto-columns:72vw!important}
  .dynamic-site .source-grid{grid-auto-columns:88vw!important}
  .dynamic-site .rail-toolbar{justify-content:flex-start;margin:.3rem 0 .55rem}
  .dynamic-site .rail-toolbar .rail-button{display:none}
  .dynamic-site .rail-toolbar .rail-hint{margin:0;font-size:.61rem!important;color:#8c8175}
  .dynamic-site .rail-toolbar .rail-hint::after{content:"  →";color:#a87942}
  html[dir="rtl"] .dynamic-site .rail-toolbar .rail-hint::after{content:"  ←"}
  .dynamic-site .timeline-item,.dynamic-site .feature-grid.three>.feature-card,.dynamic-site .ruler-grid>article,.dynamic-site .topic-grid>article,.dynamic-site .legacy-grid>article,.dynamic-site .az-grid>article{min-height:0!important}
  .dynamic-site .timeline-item{padding:1.25rem!important;border-radius:17px}
  .dynamic-site .timeline-item time{margin-bottom:.9rem}
  .dynamic-site .timeline-item h3{font-size:1.4rem!important;line-height:1.25!important;margin:0 0 .55rem!important}
  .dynamic-site .timeline-item p{font-size:.92rem;line-height:1.66}
  html[lang="ar"] .dynamic-site .timeline-item h3{line-height:1.48!important}
  html[lang="ar"] .dynamic-site .timeline-item p{line-height:1.84}

  /* Cards: tighter content, touch feedback, subtle variety. */
  .dynamic-site .feature-card,.dynamic-site .topic,.dynamic-site .legacy-grid article,.dynamic-site .az-grid article,.dynamic-site .faiths-grid article{border-radius:17px;padding:1.25rem}
  .dynamic-site .feature-card:active,.dynamic-site .topic:active,.dynamic-site .legacy-grid article:active,.dynamic-site .az-grid article:active{transform:scale(.992)}
  .dynamic-site .feature-card h3,.dynamic-site .topic h3,.dynamic-site .legacy-grid h3{font-size:1.3rem}
  .dynamic-site .feature-card p,.dynamic-site .topic p,.dynamic-site .legacy-grid p,.dynamic-site .az-grid p{font-size:.9rem;line-height:1.65}

  /* Diagrams and exhibit visuals get breathing room. */
  .dynamic-site .split-panel{margin-top:2.3rem;gap:1.5rem}
  .dynamic-site .split-copy h3{font-size:2rem;line-height:1.18}
  .dynamic-site .city-diagram{min-height:300px;border-radius:18px}
  .dynamic-site .monument-grid,.dynamic-site .artifact-layout{gap:1.5rem}
  .dynamic-site .monument-copy h2{font-size:clamp(2.35rem,11vw,3.1rem);line-height:1.1}
  .dynamic-site .artifact-copy h3{font-size:2rem;line-height:1.18}
  .dynamic-site .lead{font-size:1.08rem;line-height:1.55}

  /* On phones, captions live below images — never over archaeological art. */
  .dynamic-site .story-illustration{border-radius:18px;overflow:hidden}
  .dynamic-site .story-illustration img{max-height:340px;object-fit:contain;padding:.3rem .2rem 0}
  .dynamic-site .story-illustration figcaption{position:relative!important;inset:auto!important;margin:0!important;padding:1rem 1.05rem!important;border:0!important;border-top:1px solid rgba(255,255,255,.1)!important;border-radius:0!important;background:#201811!important;color:#fff!important;box-shadow:none!important}
  .dynamic-site .story-illustration figcaption span{color:#ddb778!important}
  .dynamic-site .story-illustration figcaption strong{font-size:1.18rem;line-height:1.35}
  .dynamic-site .story-illustration figcaption small{font-size:.72rem;line-height:1.55;color:#d7cec2!important}
  html[lang="ar"] .dynamic-site .story-illustration figcaption strong{line-height:1.55}
  html[lang="ar"] .dynamic-site .story-illustration figcaption small{line-height:1.75}

  .dynamic-site .illustrated-interlude{border-radius:0}
  .dynamic-site .interlude-grid{gap:.25rem;padding-block:2.2rem 2.7rem}
  .dynamic-site .interlude-copy h3{font-size:2.15rem;line-height:1.15;margin:.7rem 0}
  .dynamic-site .interlude-copy p{font-size:.92rem;line-height:1.7}
  .dynamic-site .interlude-art img{max-height:290px}

  .dynamic-site .royal-visual,.dynamic-site .scribe-visual,.dynamic-site .route-illustration{border-radius:18px;overflow:hidden;margin:1.5rem 0}
  .dynamic-site .royal-visual img,.dynamic-site .scribe-visual img,.dynamic-site .route-illustration img{max-height:310px}
  .dynamic-site .royal-visual figcaption,.dynamic-site .scribe-visual figcaption,.dynamic-site .route-illustration figcaption{margin:0!important;padding:1rem 1.05rem!important;border-radius:0!important}

  /* Abraham chapter: tabs become a swipeable story selector. */
  .dynamic-site .abraham-title h2{font-size:clamp(2.35rem,10.5vw,3.1rem);line-height:1.12}
  html[lang="ar"] .dynamic-site .abraham-title h2{line-height:1.34}
  .dynamic-site .abraham-tabs{display:flex;width:auto;max-width:none;margin:1.45rem -14px 1rem;padding:.35rem 14px;gap:.45rem;border:0;border-radius:0;background:transparent;overflow-x:auto;scroll-snap-type:inline mandatory}
  .dynamic-site .abraham-tab{flex:0 0 min(74vw,290px);min-height:48px;padding:.7rem .9rem;border:1px solid rgba(47,33,20,.12);border-radius:13px;background:#efe2cf;scroll-snap-align:start;font-size:.72rem;line-height:1.35}
  .dynamic-site .abraham-tab[aria-selected="true"]{background:#1a1410;color:#f4e7d4;border-color:#1a1410}
  html[lang="ar"] .dynamic-site .abraham-tab{line-height:1.55}
  .dynamic-site .abraham-tab-panel .evidence-summary,.dynamic-site .abraham-tab-panel .faiths-grid{grid-auto-columns:86vw;margin-inline:-14px;padding-inline:14px 14vw}
  .dynamic-site .scripture-panel,.dynamic-site .debate-panel{padding:1.25rem;border-radius:17px}
  .dynamic-site .scripture-panel h3,.dynamic-site .debate-panel h3{font-size:1.55rem;line-height:1.3}
  .dynamic-site .route-card{margin:1rem 0;padding:1rem;border-radius:17px}

  /* A friendly next-chapter cue breaks the long-scroll feeling. */
  .mobile-next-chapter{display:grid;grid-template-columns:minmax(0,1fr) 38px;align-items:center;gap:12px;margin-top:2.2rem;padding:13px 14px;border:1px solid rgba(25,20,15,.12);border-radius:16px;background:linear-gradient(135deg,#fffaf0,#eadcc5);color:#241a13;text-decoration:none;box-shadow:0 10px 26px rgba(43,29,16,.07)}
  .midnight .mobile-next-chapter,.sources-section .mobile-next-chapter{background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.035));border-color:rgba(255,255,255,.14);color:#fff}
  .mobile-next-chapter small{display:block;margin-bottom:2px;color:#91613e;font-size:.6rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
  .mobile-next-chapter strong{display:block;font-size:.96rem;line-height:1.35}
  .mobile-next-chapter i{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#1c1712;color:#f0d397;font-style:normal;font-size:1rem}
  .midnight .mobile-next-chapter small{color:#d8b477}
  .midnight .mobile-next-chapter i{background:#d7ad67;color:#1b1510}
  html[dir="rtl"] .mobile-next-chapter small{letter-spacing:0;text-transform:none}
  html[lang="ar"] .mobile-next-chapter strong{line-height:1.55}

  /* Source cards and footer stay compact at the end of a long exhibit. */
  .dynamic-site .source-grid a{min-height:0;padding:1.15rem;border-radius:15px}
  .dynamic-site .source-grid strong{font-size:1.08rem;line-height:1.4}
  .dynamic-site .method-note{margin-top:1.4rem;padding-top:1.4rem}
  .dynamic-site .site-footer{padding:3rem 0 1.2rem}
  .dynamic-site .footer-grid{gap:1.7rem}
  .dynamic-site .footer-bottom{margin-top:2rem;gap:.6rem;flex-direction:column}
}

@media (max-width:380px){
  .dynamic-site .hero{min-height:86svh}
  .dynamic-site .hero-content{padding-top:2.8rem}
  .dynamic-site .hero h1{font-size:clamp(5rem,27vw,6.4rem)}
  html[lang="ar"] .dynamic-site .hero h1{font-size:clamp(4.8rem,25vw,6rem)}
  .dynamic-site .hero-actions{grid-template-columns:1fr}
  .dynamic-site .hero-stats{grid-auto-columns:76vw}
  .ur-mobile-quick-track{grid-auto-columns:52vw}
  .dynamic-site .chapter-cards{grid-auto-columns:86vw}
  .dynamic-site .timeline,.dynamic-site .feature-grid.three,.dynamic-site .ruler-grid,.dynamic-site .topic-grid,.dynamic-site .legacy-grid,.dynamic-site .source-grid{grid-auto-columns:89vw!important}
  .dynamic-site .az-grid{grid-auto-columns:77vw!important}
}

@media (prefers-reduced-motion:reduce){
  .ur-mobile-quick a:active,.mobile-next-chapter:active{transform:none!important}
}

/* v31: keep the Evidence Lens available on larger screens, but remove the filter strip from the mobile experience. */
@media (max-width: 720px){
  .dynamic-site .evidence-strip{display:none!important;}
}

/* UR v33 — deep mobile containment audit.
   Keep every readable label, illustration and exhibit caption inside its own frame. */
@media (max-width:760px){
  /* The foreground ziggurat illustration used to bleed 36vw outside the hero on phones.
     Keep the decorative layer fully inside the hero frame instead. */
  .dynamic-site .hero-illustration{
    width:min(86vw,430px)!important;
    inset-inline-end:0!important;
    bottom:25%!important;
    max-width:100%!important;
  }

  /* Mobile exhibit images use their intrinsic aspect ratio. This prevents fixed-height
     desktop figure rules from clipping captions after captions move below the artwork. */
  .dynamic-site .story-illustration{
    width:100%;
    max-width:100%;
    min-width:0;
    height:auto!important;
  }
  .dynamic-site .story-illustration img{
    width:100%;
    max-width:100%;
    height:auto!important;
    object-fit:contain!important;
  }
  .dynamic-site .market-visual{
    height:auto!important;
    min-height:0!important;
  }
  .dynamic-site .market-visual img{
    height:auto!important;
    max-height:340px!important;
  }
  .dynamic-site .story-illustration figcaption{
    width:auto;
    max-width:100%;
    min-width:0;
    overflow:visible;
  }

  /* Hard containment for other media/card frames without changing the intentional
     horizontal swipe rails themselves. */
  .dynamic-site :where(.monument-photo,.artifact-image,.interlude-art,.royal-visual,.scribe-visual,.route-illustration,.city-diagram){
    max-width:100%;
    min-width:0;
  }
  .dynamic-site :where(.monument-photo img,.artifact-image img,.interlude-art img,.royal-visual img,.scribe-visual img,.route-illustration img){
    max-width:100%;
  }
  .dynamic-site .city-diagram .diagram-label{
    max-width:calc(100% - 24px);
    white-space:normal;
    overflow-wrap:anywhere;
  }

  /* Anchor jumps should not land underneath the sticky Ur chapter header. */
  .dynamic-site :where(#start,#history,#city,#ziggurat,#archaeology,#ur3,#religion,#abraham,#legacy,#az,#sources){
    scroll-margin-top:78px;
  }
}