@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500&family=Manrope:wght@400;500;600;700&display=swap');

:root {
  --black: #111111;
  --charcoal: #171717;
  --graphite: #2b2b2b;
  --white: #ffffff;
  --cream: #fafafa;
  --paper: #ececea;
  --silver: #9f9f9b;
  --silver-light: #d7d7d2;
  --muted: #686868;
  --copy: #505050;
  --rule: #dadad6;
  --display: 'Cormorant Garamond', Georgia, serif;
  --sans: 'Manrope', Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--cream); color: var(--black); font-family: var(--sans); }
a { color: inherit; text-decoration: none; }
.site { min-height: 100vh; overflow: hidden; }

.site-header {
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  right: 0;
  height: 100px;
  padding: 0 clamp(24px, 5vw, 76px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--white);
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.brand { display: flex; align-items: center; gap: 14px; }
.brand-mark {
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border: 1px solid var(--silver);
  color: var(--silver-light);
  font-family: var(--display);
  font-size: 17px;
}
.brand-name { font-size: 14px; font-weight: 600; letter-spacing: .04em; }
.header-link { padding-bottom: 7px; border-bottom: 1px solid var(--silver); font-size: 11px; font-weight: 700; letter-spacing: .15em; text-transform: uppercase; }

.hero {
  position: relative;
  min-height: 100svh;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr 94px;
  background: linear-gradient(115deg, rgba(0,0,0,.25), transparent 60%), radial-gradient(circle at 84% 16%, #3d3d3d 0, transparent 32%), var(--charcoal);
  color: var(--white);
}
.hero::before {
  content: '';
  position: absolute;
  width: 58vw;
  height: 58vw;
  max-width: 850px;
  max-height: 850px;
  right: -17vw;
  bottom: -39vw;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 50%;
  box-shadow: 0 0 0 90px rgba(255,255,255,.025), 0 0 0 180px rgba(255,255,255,.018);
}
.hero-glow { position: absolute; top: -150px; left: 20%; width: 400px; height: 400px; border-radius: 50%; background: rgba(255,255,255,.07); filter: blur(80px); }
.hero-content { position: relative; z-index: 1; width: min(100%, 1220px); margin: auto; padding: 158px clamp(24px, 6vw, 96px) 84px; }
.eyebrow { margin: 0 0 32px; display: flex; align-items: center; gap: 12px; color: var(--silver-light); font-size: 10px; font-weight: 700; letter-spacing: .21em; text-transform: uppercase; }
.eyebrow span { width: 28px; height: 1px; background: var(--silver); }
h1 { max-width: 900px; margin: 0; font-family: var(--display); font-size: clamp(58px, 8.2vw, 118px); font-weight: 500; line-height: .84; letter-spacing: -.045em; }
h1 em { color: var(--silver-light); font-weight: 500; }
.hero-intro { max-width: 665px; margin: 34px 0 0; color: rgba(255,255,255,.72); font-size: clamp(16px, 1.5vw, 19px); line-height: 1.8; }
.hero-intro strong { color: var(--white); }
.name-transition { max-width: 780px; margin-top: 48px; display: grid; grid-template-columns: 1fr 86px 1fr; border-top: 1px solid rgba(255,255,255,.18); border-bottom: 1px solid rgba(255,255,255,.18); }
.name-block { padding: 24px 0; }
.name-block span { display: block; margin-bottom: 10px; color: rgba(255,255,255,.44); font-size: 9px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; }
.name-block p { margin: 0; font-family: var(--display); font-size: clamp(23px, 2.4vw, 32px); line-height: 1.05; }
.name-block-new span, .name-block-new p { color: var(--silver-light); }
.transition-arrow { display: grid; place-items: center; border-left: 1px solid rgba(255,255,255,.12); border-right: 1px solid rgba(255,255,255,.12); color: var(--silver); font-size: 26px; }
.primary-action { display: inline-flex; align-items: center; gap: 24px; margin-top: 34px; color: var(--silver-light); font-size: 10px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }
.primary-action b { font-size: 18px; transition: transform .2s ease; }
.primary-action:hover b { transform: translateY(4px); }
.hero-aside { border-left: 1px solid rgba(255,255,255,.14); display: grid; place-items: center; }
.vertical-text { writing-mode: vertical-rl; transform: rotate(180deg); color: rgba(255,255,255,.32); font-size: 8px; font-weight: 700; letter-spacing: .28em; }

.notice-section { position: relative; max-width: 1280px; margin: 0 auto; padding: 128px clamp(24px, 6vw, 92px) 138px; display: grid; grid-template-columns: minmax(280px,.9fr) 1.1fr; gap: clamp(60px,9vw,140px); }
.section-number { position: absolute; top: 72px; right: 38px; color: rgba(17,17,17,.05); font-family: var(--display); font-size: clamp(120px,18vw,260px); line-height: 1; }
.section-kicker { margin: 0 0 24px; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .23em; text-transform: uppercase; }
.notice-heading, .notice-copy { position: relative; z-index: 1; }
.notice-heading h2, .continuity-intro h2, .records-card h2 { margin: 0; font-family: var(--display); font-size: clamp(46px,5.2vw,74px); font-weight: 500; line-height: .97; letter-spacing: -.035em; }
.notice-heading::after { content: ''; display: block; width: 66px; height: 1px; margin-top: 38px; background: var(--silver); }
.notice-copy { max-width: 610px; padding-top: 34px; }
.notice-copy p { margin: 0 0 22px; color: var(--copy); font-size: 16px; line-height: 1.9; }
.notice-copy .salutation, .notice-copy strong { color: var(--black); }
.notice-copy .salutation { margin-bottom: 28px; font-weight: 700; }
.signature-line { margin-top: 42px; padding-top: 22px; border-top: 1px solid var(--rule); display: flex; flex-direction: column; gap: 8px; font-size: 13px; }
.signature-line span { color: var(--muted); }
.signature-line strong { font-family: var(--display); font-size: 24px; }

.continuity-section { padding: 118px clamp(24px,7vw,104px) 126px; background: var(--black); color: var(--white); }
.continuity-intro { max-width: 1180px; margin: 0 auto 70px; display: grid; grid-template-columns: 1.1fr .8fr; column-gap: 90px; }
.section-kicker.light { grid-column: 1 / -1; color: var(--silver-light); }
.continuity-intro h2 { font-size: clamp(44px,5.5vw,78px); }
.continuity-intro h2 em { color: var(--silver-light); font-weight: 500; }
.continuity-intro > p:last-child { align-self: end; margin: 0; color: rgba(255,255,255,.58); font-size: 15px; line-height: 1.9; }
.continuity-grid { max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: repeat(3,1fr); border-top: 1px solid rgba(255,255,255,.15); border-bottom: 1px solid rgba(255,255,255,.15); }
.continuity-grid article { min-height: 255px; padding: 34px 38px 38px 0; }
.continuity-grid article + article { padding-left: 38px; border-left: 1px solid rgba(255,255,255,.15); }
.card-index { color: var(--silver); font-size: 9px; font-weight: 700; letter-spacing: .18em; }
.continuity-grid h3 { margin: 54px 0 12px; font-family: var(--display); font-size: 28px; font-weight: 600; }
.continuity-grid p { margin: 0; color: rgba(255,255,255,.53); font-size: 13px; line-height: 1.8; }

.website-section { position: relative; min-height: 620px; overflow: hidden; padding: 120px clamp(24px,8vw,120px); display: flex; align-items: center; justify-content: flex-end; background: radial-gradient(circle at 22% 50%, rgba(110,110,110,.28), transparent 32%), linear-gradient(120deg,#252525,#111 72%); color: var(--white); }
.website-section::before { content: ''; position: absolute; inset: 0; opacity: .35; background-image: linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px); background-size: 64px 64px; }
.website-orbit { position: absolute; left: clamp(-210px,-8vw,-80px); top: 50%; width: clamp(430px,48vw,690px); aspect-ratio: 1; transform: translateY(-50%); display: grid; place-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; box-shadow: 0 0 0 70px rgba(255,255,255,.025),0 0 0 140px rgba(255,255,255,.018); }
.website-orbit::before, .website-orbit::after { content: ''; position: absolute; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; }
.website-orbit::before { inset: 18%; }
.website-orbit::after { inset: 37%; background: rgba(255,255,255,.035); }
.website-orbit span { position: relative; z-index: 1; font-family: var(--display); font-size: clamp(48px,7vw,92px); color: var(--silver-light); }
.website-copy { position: relative; z-index: 1; width: min(49%,620px); }
.website-copy h2 { margin: 0; font-family: var(--display); font-size: clamp(48px,6vw,82px); font-weight: 500; line-height: .96; letter-spacing: -.035em; }
.website-copy h2 em { color: var(--silver-light); font-weight: 500; }
.website-copy > p:not(.section-kicker) { margin: 30px 0; color: rgba(255,255,255,.64); font-size: 15px; line-height: 1.9; }
.launch-note { display: inline-flex; align-items: center; gap: 12px; padding: 13px 18px; border: 1px solid rgba(255,255,255,.25); color: var(--silver-light); font-size: 9px; letter-spacing: .15em; text-transform: uppercase; }
.launch-pulse { width: 7px; height: 7px; border-radius: 50%; background: var(--silver); box-shadow: 0 0 0 5px rgba(255,255,255,.08); }

.records-section { max-width: 1280px; margin: 0 auto; padding: 120px clamp(24px,6vw,92px); display: grid; grid-template-columns: 1fr .85fr; gap: clamp(48px,10vw,140px); align-items: center; }
.records-card { padding: clamp(34px,5vw,64px); background: var(--paper); border-top: 4px solid var(--silver); }
.records-label { color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .22em; text-transform: uppercase; }
.records-card h2 { margin-top: 22px; }
.records-card > p { margin: 28px 0; color: var(--copy); font-size: 15px; line-height: 1.85; }
.records-name { padding-top: 22px; border-top: 1px solid var(--rule); display: flex; flex-direction: column; gap: 7px; }
.records-name span { color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.records-name strong { font-family: var(--display); font-size: clamp(26px,3vw,36px); }
.records-quote { position: relative; padding: 40px 0 30px; }
.quote-mark { position: absolute; top: -28px; left: -24px; color: rgba(17,17,17,.08); font-family: var(--display); font-size: 170px; line-height: 1; }
.records-quote blockquote { position: relative; margin: 0; font-family: var(--display); font-size: clamp(35px,4vw,56px); line-height: 1.07; }
.records-quote p { margin: 34px 0 0; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .17em; text-transform: uppercase; }

footer { min-height: 150px; padding: 38px clamp(24px,6vw,92px); background: var(--charcoal); color: var(--white); display: flex; align-items: center; justify-content: space-between; gap: 30px; }
footer > p { margin: 0; color: rgba(255,255,255,.42); font-size: 9px; font-weight: 600; letter-spacing: .15em; text-transform: uppercase; }
.back-top { color: var(--silver-light); font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }

@media (max-width: 720px) {
  .site-header { height: 82px; }
  .brand-name { display: none; }
  .hero { grid-template-columns: 1fr; }
  .hero-aside { display: none; }
  .hero-content { padding-top: 126px; padding-bottom: 64px; }
  .name-transition { grid-template-columns: 1fr 54px 1fr; }
  .name-block p { font-size: 21px; }
  .notice-section { grid-template-columns: 1fr; gap: 32px; padding-top: 92px; padding-bottom: 94px; }
  .notice-copy { padding-top: 0; }
  .section-number { top: 36px; right: 16px; }
  .continuity-section { padding-top: 86px; padding-bottom: 88px; }
  .continuity-intro { grid-template-columns: 1fr; gap: 30px; margin-bottom: 50px; }
  .continuity-grid { grid-template-columns: 1fr; }
  .continuity-grid article { min-height: auto; padding: 30px 0; }
  .continuity-grid article + article { padding-left: 0; border-left: 0; border-top: 1px solid rgba(255,255,255,.15); }
  .continuity-grid h3 { margin-top: 28px; }
  .website-section { min-height: auto; padding-top: 92px; padding-bottom: 380px; align-items: flex-start; }
  .website-copy { width: 100%; }
  .website-orbit { left: 50%; top: auto; bottom: -190px; width: 480px; transform: translateX(-50%); }
  .records-section { grid-template-columns: 1fr; padding-top: 82px; padding-bottom: 82px; }
  footer { flex-wrap: wrap; }
}

@media (max-width: 470px) {
  .header-link { font-size: 9px; }
  .name-transition { grid-template-columns: 1fr; }
  .transition-arrow { min-height: 45px; border: 0; border-top: 1px solid rgba(255,255,255,.12); border-bottom: 1px solid rgba(255,255,255,.12); }
  .transition-arrow span { transform: rotate(90deg); }
  .name-block { padding: 20px 0; }
  footer > p { order: 3; width: 100%; }
}

@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }