:root {
  
  --paper:       #FBFAF8;   
  --paper-warm:  #F2EDE4;   
  --paper-media: #E7E1D6;   
  --paper-tile:  #E2DCD0;   

  
  --ink:        #16150F;    
  --ink-lift:   #2E2C20;    
  --ink-70:     rgba(22, 21, 15, 0.70);
  --ink-66:     rgba(22, 21, 15, 0.66);   
  --ink-62:     rgba(22, 21, 15, 0.62);   
  --ink-60:     rgba(22, 21, 15, 0.60);   
  --ink-58:     rgba(22, 21, 15, 0.58);   
  --ink-56:     rgba(22, 21, 15, 0.56);   
  --ink-55:     rgba(22, 21, 15, 0.55);   
  --ink-45:     rgba(22, 21, 15, 0.45);   
  --ink-42:     rgba(22, 21, 15, 0.42);   
  --ink-18:     rgba(22, 21, 15, 0.18);   
  --ink-12:     rgba(22, 21, 15, 0.12);
  --ink-08:     rgba(22, 21, 15, 0.08);

  
  --bone:       #F6F3EC;    
  --bone-72:    rgba(246, 243, 236, 0.72);
  --bone-60:    rgba(246, 243, 236, 0.60);
  --white-80:   rgba(255, 255, 255, 0.80);
  --white-66:   rgba(255, 255, 255, 0.66);

  
  --green:      #3E5C4B;
  --green-deep: #2F4739;
  --brass:      #D9C79A;
  --brass-lift: #EBDCB6;    
  
  --star:       #C9922F;
  --sand-line:  rgba(217, 199, 154, 0.40);
  --lime:       #C9E7A8;    

  
  --r-pill:  999px;
  --r-hero:  28px;   
  --r-glass: 26px;   
  --r-card:  24px;   
  --r-panel: 22px;   
  --r-tile:  20px;   
  --r-input: 18px;   

  
  --font-display: 'Instrument Serif', 'Iowan Old Style', Georgia, 'Times New Roman', serif;
  --font-ui:      'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    'Geist Mono', ui-monospace, SFMono-Regular, Menlo, monospace;

  
  
  --t-hero:    clamp(38px, 6.2vw, 84px);
  --t-h2:      clamp(32px, 4.4vw, 60px);      
  --t-h2-lg:   clamp(32px, 4.6vw, 64px);      
  --t-h2-md:   clamp(32px, 4.6vw, 62px);      
  --t-h2-sm:   clamp(30px, 4.2vw, 56px);      
  --t-h2-cl:   clamp(30px, 4.4vw, 60px);      
  --t-h3:      clamp(30px, 2.9vw, 42px);
  --t-h4:      clamp(22px, 2.2vw, 30px);
  --t-stat:    clamp(34px, 3.4vw, 48px);   
  
  --t-lead:    clamp(15.5px, 1.35vw, 19px);
  
  --t-sub:     clamp(15px, 1.15vw, 16.5px);
  
  --t-body:    1rem;
  --t-small:   0.875rem;
  --t-fine:    0.8125rem;
  --t-foot:    14.5px;       
  --t-nav:     14.5px;       
  --t-mono:    0.65625rem;   

  --lh-tight:  1.04;    
  --lh-hero:   1.02;
  --lh-h3:     1.06;
  --lh-snug:   1.25;
  --lh-body:   1.6;

  
  
  --gutter:  clamp(16px, 4vw, 48px);
  --band:    clamp(52px, 7vw, 110px);
  --band-lg: clamp(56px, 8vw, 124px);   
  --band-xl: clamp(56px, 8vw, 130px);   
  --band-sm: clamp(46px, 6vw, 80px);    
  --gutter-narrow: clamp(14px, 3vw, 40px);   
  --measure: 66ch;
  --max:     1360px;
  --max-tight: 1240px;

  
  --ease-out:  cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-soft: cubic-bezier(0.2, 0.75, 0.2, 1);
  --t-fast:  180ms;
  --t-base:  360ms;
  --t-slow:  900ms;
  --t-drift: 1100ms;   

  
  --glass-light:  rgba(255, 255, 255, 0.15);
  
  --glass-smoke:  rgba(18, 16, 11, 0.44);
  --glass-smoke-lift: rgba(18, 16, 11, 0.52);
  --glass-lift:   rgba(255, 255, 255, 0.22);
  --glass-dark:   rgba(255, 255, 255, 0.10);
  --glass-chip:   rgba(255, 255, 255, 0.13);
  --glass-paper:  rgba(251, 250, 248, 0.60);
  --glass-edge:   rgba(255, 255, 255, 0.34);
  --glass-edge-soft: rgba(255, 255, 255, 0.18);
  --blur-sm: blur(16px) saturate(1.6);
  --blur-md: blur(22px) saturate(1.5);
  --blur-lg: blur(30px) saturate(1.7);
  --blur-fp: blur(26px) saturate(1.7);   

  
  --sh-card:  0 1px 2px rgba(22, 21, 15, 0.05), 0 24px 50px -40px rgba(22, 21, 15, 0.5);
  --sh-glass: 0 24px 60px -30px rgba(0, 0, 0, 0.6);
  --sh-deep:  0 30px 70px -34px rgba(0, 0, 0, 0.7);
  --sh-panel: 0 30px 70px -40px rgba(22, 21, 15, 0.5);

  
  --z-scrim:  55;
  --z-nav:    60;
  --z-drawer: 300;
}


:root {
  --gold-line:  #D8B678;   
  --gold-text:  #E9D5AF;   
  --gold-fill:  #F4E7D0;   
}




@font-face {
  font-family: 'Instrument Serif';
  src: url('/assets/fonts/instrument-serif-400.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Instrument Serif';
  src: url('/assets/fonts/instrument-serif-400-italic.woff2') format('woff2');
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: 'Geist';
  src: url('/assets/fonts/geist.woff2') format('woff2');
  font-weight: 300 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Geist Mono';
  src: url('/assets/fonts/geist-mono.woff2') format('woff2');
  font-weight: 400 500; font-style: normal; font-display: swap;
}


*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-behavior: smooth;
  
  scroll-padding-top: clamp(84px, 9vw, 118px);
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: var(--t-body);
  font-weight: 400;
  line-height: var(--lh-body);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  
  overflow-x: hidden;
}

img, svg, video { display: block; max-width: 100%; }
img { height: auto; }

a { color: inherit; text-decoration: none; }
a:hover { color: var(--green); }

button, input, select, textarea { font: inherit; color: inherit; }
button { background: none; border: 0; padding: 0; cursor: pointer; }

ul, ol { margin: 0; padding: 0; list-style: none; }
p { margin: 0; text-wrap: pretty; }


h1, h2, h3, h4 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 400;
  line-height: var(--lh-tight);
  letter-spacing: -0.025em;
  text-wrap: balance;
}

h1 { font-size: var(--t-hero); line-height: var(--lh-hero); }
h2 { font-size: var(--t-h2); }
h3 { font-size: var(--t-h3); line-height: var(--lh-h3); letter-spacing: -0.02em; }
h4 { font-size: var(--t-h4); letter-spacing: -0.015em; line-height: var(--lh-snug); }


em, .u-em { font-style: italic; }

.u-mono {
  font-family: var(--font-mono);
  font-size: var(--t-mono);
  font-weight: 400;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  line-height: 1;
}

.u-lead { font-size: var(--t-lead); line-height: 1.55; color: var(--ink-58); }
.u-small { font-size: var(--t-small); }
.u-fine { font-size: var(--t-fine); }
.u-measure { max-width: var(--measure); }


.u-wrap { width: 100%; max-width: var(--max); margin-inline: auto; padding-inline: var(--gutter); }
.u-wrap--tight { max-width: var(--max-tight); }
.u-band { padding-block: var(--band); }


.sechead {
  display: flex; flex-wrap: wrap;
  align-items: flex-end; justify-content: space-between;
  gap: clamp(1rem, 2vw, 1.5rem);
  margin-bottom: clamp(1.625rem, 3.4vw, 3.25rem);
}
.sechead > h2, .sechead > h3 { max-width: 17ch; flex: 1 1 22ch; }
.sechead__intro { flex: 1 1 30ch; max-width: 42ch; font-size: var(--t-sub); line-height: var(--lh-body); color: var(--ink-58); }

:not(.sechead) > h2 + .sechead__intro,
:not(.sechead) > h3 + .sechead__intro { margin-top: 1.125rem; }

.u-visually-hidden {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip-path: inset(50%); white-space: nowrap; border: 0;
}


:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: 3px;
  border-radius: 4px;
}
.on-dark :focus-visible, .sec--dark :focus-visible { outline-color: var(--brass-lift); }

.skip {
  position: absolute; left: 0; top: 0;
  transform: translateY(-120%);
  z-index: 999;
  padding: 0.75rem 1.25rem;
  background: var(--ink); color: var(--paper);
  border-radius: 0 0 var(--r-tile) 0;
}
.skip:focus { transform: none; color: var(--paper); }


[data-rise] {
  transform: translate3d(0, 20px, 0);
  transition: transform var(--t-slow) var(--ease-soft);
  will-change: transform;
}
[data-rise].is-in { transform: none; }
[data-rise].is-in { will-change: auto; }


[data-rise='head'] { transform: translate3d(0, 30px, 0); transition-duration: 1050ms; }

@media (prefers-reduced-motion: reduce) {
  [data-rise] { transform: none !important; transition: none !important; }
}




.holding {
  position: relative;
  min-height: 100svh;
  display: grid;
  
  grid-template-rows: auto 1fr auto;
  overflow: hidden;
  background: var(--ink);
  color: var(--bone);
}


.holding__bg {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center 58%;
}


.holding__wash {
  position: absolute; inset: 0;
  background: linear-gradient(180deg,
    rgba(22, 21, 15, 0.82) 0%,
    rgba(22, 21, 15, 0.52) 38%,
    rgba(22, 21, 15, 0.62) 68%,
    rgba(22, 21, 15, 0.88) 100%);
}

.holding__bar {
  position: relative;
  padding: clamp(18px, 2.4vw, 30px) clamp(16px, 4vw, 48px);
}

.holding__in {
  position: relative;
  display: flex; flex-direction: column; justify-content: center;
  gap: clamp(16px, 2vw, 22px);
  max-width: 1360px; width: 100%;
  margin: 0 auto;
  
  padding: clamp(20px, 3vw, 40px) clamp(16px, 4vw, 48px) clamp(24px, 3vw, 40px);
}

.holding__k {
  margin: 0;
  font-size: clamp(10.5px, 1vw, 12px); letter-spacing: 0.18em;
  color: var(--gold-line);
}


.holding__h {
  margin: 0;
  font-family: var(--font-display); font-weight: 400;
  font-size: clamp(38px, 6.4vw, 88px); line-height: 0.98; letter-spacing: -0.03em;
  max-width: 20ch; text-wrap: balance;
}
.holding__h em { font-style: italic; }

.holding__lead {
  margin: 0;
  font-size: clamp(16px, 1.6vw, 20px); line-height: 1.6;
  color: rgba(246, 243, 236, 0.78);
  max-width: 58ch; text-wrap: pretty;
}


.holding__when {
  margin: 0;
  font-size: clamp(15px, 1.4vw, 17.5px); line-height: 1.5;
  color: var(--bone);
}


.holding__act { margin: clamp(6px, 1vw, 12px) 0 0; }


.holding__cta {
  display: inline-flex; align-items: center; gap: 0.75rem;
  padding: 12px 12px 12px 22px;
  border-radius: var(--r-pill);
  background: var(--ink); color: var(--bone);
  font-size: 14.5px; line-height: 1;
  text-decoration: none; white-space: nowrap;
  transition: background 0.2s;
}
.holding__cta:hover { background: var(--ink-lift); color: var(--bone); }

.holding__cta .btn__ico {
  display: grid; place-items: center; flex: none;
  width: 26px; height: 26px;
  border-radius: var(--r-pill);
  background: var(--gold-line); color: var(--ink);
  font-size: 12px; line-height: 1;
}


.holding__trade {
  margin: clamp(14px, 2.2vw, 26px) 0 0;
  padding-top: clamp(14px, 2vw, 20px);
  border-top: 1px solid rgba(246, 243, 236, 0.18);
  max-width: 62ch;
}

.holding__trade-k {
  margin: 0 0 6px;
  font-size: 10px; letter-spacing: 0.16em;
  color: rgba(246, 243, 236, 0.5);
}

.holding__trade-h {
  margin: 0 0 6px;
  font-family: var(--font-display); font-weight: 400;
  font-size: clamp(19px, 1.9vw, 24px); line-height: 1.15; letter-spacing: -0.015em;
  color: var(--bone);
}

.holding__trade-b {
  margin: 0;
  font-size: 14px; line-height: 1.6;
  color: rgba(246, 243, 236, 0.72);
  text-wrap: pretty;
}
.holding__trade-b a {
  color: var(--bone);
  text-decoration: none;
  border-bottom: 1px solid rgba(246, 243, 236, 0.4);
  transition: border-color 0.2s;
}
.holding__trade-b a:hover { border-color: var(--bone); }


.holding .wordmark {
  display: inline-flex; align-items: center;
  color: var(--bone);
  text-decoration: none;
}
.holding .wordmark__img {
  display: block;
  height: clamp(21px, 2.4vw, 30px);
  width: auto; aspect-ratio: 2030 / 203;
  background: currentColor;
  -webkit-mask: url('/assets/brand/umh-lockup.webp') center / contain no-repeat;
  mask: url('/assets/brand/umh-lockup.webp') center / contain no-repeat;
  filter: drop-shadow(0 2px 14px rgba(0, 0, 0, 0.35));
}


.holding__by {
  position: relative;
  margin: 0;
  padding: 0 clamp(16px, 4vw, 48px) clamp(20px, 3vw, 34px);
  max-width: 1360px; width: 100%;
  margin-inline: auto;
  font-size: 12.5px; letter-spacing: 0.02em;
}
.holding__by a {
  color: rgba(246, 243, 236, 0.6);
  text-decoration: none;
  border-bottom: 1px solid rgba(246, 243, 236, 0.22);
  transition: color 0.2s, border-color 0.2s;
}
.holding__by a:hover { color: var(--bone); border-color: rgba(246, 243, 236, 0.55); }


@media (min-width: 900px) and (max-height: 850px) {
  .holding__in { gap: clamp(10px, 1.2vw, 14px); padding-top: clamp(12px, 1.6vw, 20px); padding-bottom: clamp(12px, 1.6vw, 20px); }
  .holding__h { font-size: clamp(34px, 4.4vw, 58px); }
  .holding__lead { font-size: clamp(15px, 1.2vw, 17px); }
  .holding__trade { margin-top: clamp(10px, 1.4vw, 16px); padding-top: clamp(10px, 1.2vw, 14px); }
  .holding__trade-h { font-size: clamp(17px, 1.5vw, 20px); }
  .holding__bar { padding-top: clamp(12px, 1.6vw, 18px); padding-bottom: clamp(12px, 1.6vw, 18px); }
  .holding__by { padding-bottom: clamp(12px, 1.6vw, 20px); }
}

@media (max-width: 600px) {
  .holding__in { justify-content: flex-end; }
}