/* Blueprint: home-page, shared-navigation, editorial-gallery, responsive-layout.
 * Authorized reference design; formatted CSS including its original reset.
 * Design tokens are in :root. Responsive widths: 980, 900, 768 and 420px.
 */
@layer theme {
  :root,:host {
    --font-sans:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    --font-mono:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    --spacing:.25rem;
    --default-font-family:var(--font-sans);
    --default-mono-font-family:var(--font-mono);
  }
}
@layer base {
  *,:after,:before,::backdrop {
    box-sizing:border-box;
    border:0 solid;
    margin:0;
    padding:0;
  }
  ::file-selector-button {
    box-sizing:border-box;
    border:0 solid;
    margin:0;
    padding:0;
  }
  html,:host {
    -webkit-text-size-adjust:100%;
    tab-size:4;
    line-height:1.5;
    font-family:var(--default-font-family,ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
    font-feature-settings:var(--default-font-feature-settings,normal);
    font-variation-settings:var(--default-font-variation-settings,normal);
    -webkit-tap-highlight-color:transparent;
  }
  hr {
    height:0;
    color:inherit;
    border-top-width:1px;
  }
  abbr:where([title]) {
    -webkit-text-decoration:underline dotted;
    text-decoration:underline dotted;
  }
  h1,h2,h3,h4,h5,h6 {
    font-size:inherit;
    font-weight:inherit;
  }
  a {
    color:inherit;
    -webkit-text-decoration:inherit;
    -webkit-text-decoration:inherit;
    -webkit-text-decoration:inherit;
    -webkit-text-decoration:inherit;
    text-decoration:inherit;
  }
  b,strong {
    font-weight:bolder;
  }
  code,kbd,samp,pre {
    font-family:var(--default-mono-font-family,ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
    font-feature-settings:var(--default-mono-font-feature-settings,normal);
    font-variation-settings:var(--default-mono-font-variation-settings,normal);
    font-size:1em;
  }
  small {
    font-size:80%;
  }
  sub,sup {
    vertical-align:baseline;
    font-size:75%;
    line-height:0;
    position:relative;
  }
  sub {
    bottom:-.25em;
  }
  sup {
    top:-.5em;
  }
  table {
    text-indent:0;
    border-color:inherit;
    border-collapse:collapse;
  }
  :-moz-focusring {
    outline:auto;
  }
  progress {
    vertical-align:baseline;
  }
  summary {
    display:list-item;
  }
  ol,ul,menu {
    list-style:none;
  }
  img,svg,video,canvas,audio,iframe,embed,object {
    vertical-align:middle;
    display:block;
  }
  img,video {
    max-width:100%;
    height:auto;
  }
  button,input,select,optgroup,textarea {
    font:inherit;
    font-feature-settings:inherit;
    font-variation-settings:inherit;
    letter-spacing:inherit;
    color:inherit;
    opacity:1;
    background-color:#0000;
    border-radius:0;
  }
  ::file-selector-button {
    font:inherit;
    font-feature-settings:inherit;
    font-variation-settings:inherit;
    letter-spacing:inherit;
    color:inherit;
    opacity:1;
    background-color:#0000;
    border-radius:0;
  }
  :where(select:is([multiple],[size])) optgroup {
    font-weight:bolder;
  }
  :where(select:is([multiple],[size])) optgroup option {
    padding-inline-start:20px;
  }
  ::file-selector-button {
    margin-inline-end:4px;
  }
  ::placeholder {
    opacity:1;
  }
  @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
    ::placeholder {
      color:currentColor;
    }
    @supports (color:color-mix(in lab, red, red)) {
      ::placeholder {
        color:color-mix(in oklab, currentcolor 50%, transparent);
      }
    }
  }
  textarea {
    resize:vertical;
  }
  ::-webkit-search-decoration {
    -webkit-appearance:none;
  }
  ::-webkit-date-and-time-value {
    min-height:1lh;
    text-align:inherit;
  }
  ::-webkit-datetime-edit {
    display:inline-flex;
  }
  ::-webkit-datetime-edit-fields-wrapper {
    padding:0;
  }
  ::-webkit-datetime-edit {
    padding-block:0;
  }
  ::-webkit-datetime-edit-year-field {
    padding-block:0;
  }
  ::-webkit-datetime-edit-month-field {
    padding-block:0;
  }
  ::-webkit-datetime-edit-day-field {
    padding-block:0;
  }
  ::-webkit-datetime-edit-hour-field {
    padding-block:0;
  }
  ::-webkit-datetime-edit-minute-field {
    padding-block:0;
  }
  ::-webkit-datetime-edit-second-field {
    padding-block:0;
  }
  ::-webkit-datetime-edit-millisecond-field {
    padding-block:0;
  }
  ::-webkit-datetime-edit-meridiem-field {
    padding-block:0;
  }
  ::-webkit-calendar-picker-indicator {
    line-height:1;
  }
  :-moz-ui-invalid {
    box-shadow:none;
  }
  button,input:where([type=button],[type=reset],[type=submit]) {
    appearance:button;
  }
  ::file-selector-button {
    appearance:button;
  }
  ::-webkit-inner-spin-button {
    height:auto;
  }
  ::-webkit-outer-spin-button {
    height:auto;
  }
  [hidden]:where(:not([hidden=until-found])) {
    display:none!important;
  }
}
@layer components;
@layer utilities {
  .relative {
    position:relative;
  }
  .start {
    inset-inline-start:var(--spacing);
  }
}
:root {
  --ink:#111010;
  --paper:#f8f7f5;
  --white:#fff;
  --grey:#6b6760;
  --muted:#8a8580;
  --soft:#5a5652;
  --line:#d8d4ce;
  --dark-muted:#ffffff94;
  --dark-line:#ffffff26;
  --display:"Cinzel", serif;
  --body:"Cormorant Garamond", Georgia, serif;
  --editorial:"EB Garamond", Georgia, serif;
}
* {
  box-sizing:border-box;
}
html {
  scroll-behavior:smooth;
  overflow-x:hidden;
}
body {
  background:var(--paper);
  color:var(--ink);
  font-family:var(--body);
  -webkit-font-smoothing:antialiased;
  min-width:0;
  margin:0;
  font-size:20px;
  line-height:1.75;
  overflow-x:hidden;
}
a {
  color:inherit;
  text-decoration:none;
}
figure {
  margin:0;
}
img {
  max-width:100%;
}
::selection {
  background:var(--soft);
  color:var(--white);
}
.nav-shell {
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);
  color:var(--ink);
  z-index:20;
  background:#fffffff0;
  justify-content:space-between;
  align-items:center;
  padding:28px 52px;
  display:flex;
  position:sticky;
  top:0;
}
.brand {
  align-items:center;
  display:inline-flex;
}
.brand-mark {
  display:none;
}
.brand-copy {
  line-height:1.2;
  display:grid;
}
.brand-name {
  font-family:var(--display);
  letter-spacing:.38em;
  text-transform:uppercase;
  font-size:13px;
  font-weight:400;
}
.nav-links {
  align-items:center;
  gap:28px;
  display:flex;
}
.nav-links a {
  color:var(--grey);
  font-family:var(--display);
  letter-spacing:.32em;
  text-transform:uppercase;
  min-height:44px;
  font-size:8px;
  font-weight:400;
}
.hero {
  background:var(--ink);
  color:var(--white);
  grid-template-columns:minmax(0,1.1fr) minmax(430px,.9fr);
  min-height:calc(100svh - 90px);
  display:grid;
}
.hero-visual {
  background:var(--ink);
  justify-content:center;
  align-items:center;
  min-width:0;
  padding:clamp(20px,3vw,52px);
  display:flex;
}
.hero-image {
  object-fit:contain;
  width:100%;
  height:calc(100svh - 130px);
  max-height:1080px;
  display:block;
}
.hero-copy {
  text-align:center;
  align-content:center;
  justify-items:center;
  padding:clamp(58px,6vw,108px) clamp(34px,5vw,86px);
  display:grid;
}
.hero-kicker {
  color:#ffffff52;
  font-family:var(--display);
  letter-spacing:.56em;
  text-transform:uppercase;
  margin:0 0 34px;
  font-size:8px;
  font-weight:400;
}
.hero h1 {
  font-family:var(--display);
  letter-spacing:normal;
  margin:0 0 18px;
  font-size:clamp(44px,7vw,82px);
  font-weight:400;
  line-height:1.08;
}
.hero h1 em {
  color:#ffffffa3;
  font-family:var(--body);
  margin-top:8px;
  font-size:clamp(34px,5vw,62px);
  font-style:italic;
  font-weight:300;
  display:block;
}
.hero-tagline {
  color:var(--dark-muted);
  font-family:var(--editorial);
  max-width:680px;
  margin:0 auto;
  font-size:clamp(22px,2vw,25px);
  font-style:italic;
  font-weight:400;
  line-height:1.7;
}
.fine-rule {
  background:#ffffff61;
  width:4px;
  height:4px;
  margin:44px auto;
  display:block;
  position:relative;
  transform:rotate(45deg);
}
.fine-rule:before,.fine-rule:after {
  content:"";
  background:#ffffff29;
  width:90px;
  height:1px;
  position:absolute;
  top:50%;
}
.fine-rule:before {
  transform-origin:100%;
  right:22px;
  transform:rotate(-45deg);
}
.fine-rule:after {
  transform-origin:0;
  left:22px;
  transform:rotate(-45deg);
}
.hero-sub {
  color:var(--dark-muted);
  font-family:var(--body);
  max-width:590px;
  margin:0 auto;
  font-size:18px;
  font-weight:300;
  line-height:1.75;
}
.scroll-cue {
  font-family:var(--display);
  letter-spacing:.26em;
  text-transform:uppercase;
  align-items:center;
  gap:14px;
  width:fit-content;
  min-height:44px;
  margin-top:34px;
  font-size:8px;
  display:flex;
}
.scroll-cue i {
  background:currentColor;
  width:55px;
  height:1px;
  display:block;
}
.hero-principle {
  max-width:610px;
  margin-top:44px;
}
.hero-principle h2 {
  color:#ffffff6b;
  font-family:var(--display);
  letter-spacing:.42em;
  text-transform:uppercase;
  margin:0 0 18px;
  font-size:8px;
  font-weight:400;
  line-height:1.4;
}
.hero-principle p {
  color:#ffffffe0;
  font-family:var(--body);
  max-width:580px;
  margin:0;
  font-size:clamp(20px,2.2vw,25px);
  font-weight:300;
  line-height:1.5;
}
.section-label {
  color:var(--grey);
  font-family:var(--display);
  letter-spacing:.45em;
  text-transform:uppercase;
  align-items:center;
  gap:14px;
  margin:0 0 18px;
  font-size:8px;
  font-weight:400;
  display:flex;
}
.section-label:before {
  content:"";
  background:#c8c3bb;
  width:60px;
  height:1px;
}
.section-label:after {
  background:var(--ink);
  content:"";
  width:4px;
  height:4px;
  transform:rotate(45deg);
}
.manifesto {
  min-height:86vh;
  padding:12vw 8vw 10vw;
}
.manifesto-grid {
  grid-template-columns:1fr 1fr;
  gap:9vw;
  max-width:1600px;
  margin:0 auto;
  display:grid;
}
.manifesto h2 {
  font-family:var(--display);
  letter-spacing:normal;
  margin:0;
  font-size:clamp(30px,4vw,46px);
  font-style:normal;
  font-weight:400;
  line-height:1.2;
}
.manifesto h2 em {
  color:var(--soft);
  font-family:var(--body);
  font-style:italic;
  font-weight:300;
}
.manifesto-copy {
  max-width:620px;
  padding-top:10px;
}
.manifesto-copy p {
  color:#2a2826;
  margin:0 0 38px;
  font-size:20px;
  font-weight:300;
  line-height:1.75;
}
.collection-intro {
  background:var(--ink);
  color:var(--white);
  align-items:center;
  min-height:72vh;
  padding:10vw 8vw;
  display:flex;
}
.collection-intro>div {
  max-width:1080px;
  margin-left:24%;
}
.collection-intro h2 {
  font-family:var(--display);
  letter-spacing:normal;
  margin:0 0 34px;
  font-size:clamp(30px,4vw,46px);
  font-weight:400;
  line-height:1.2;
}
.collection-intro h2 em {
  color:#ffffff94;
  font-family:var(--body);
  font-style:italic;
  font-weight:300;
}
.collection-intro>div>p:last-child {
  color:var(--dark-muted);
  font-family:var(--editorial);
  max-width:650px;
  margin:0;
  font-size:19px;
  font-style:italic;
  line-height:1.55;
}
.gallery {
  background:var(--paper);
  padding:12vw 0 7vw;
  overflow:hidden;
}
.group-heading {
  border-bottom:1px solid var(--line);
  justify-content:space-between;
  align-items:baseline;
  gap:28px;
  max-width:1600px;
  margin:0 auto 9vw;
  padding:0 5vw 22px;
  display:flex;
}
.group-heading h3 {
  font-family:var(--display);
  letter-spacing:normal;
  margin:0;
  font-size:clamp(30px,4vw,46px);
  font-weight:400;
}
.group-heading p {
  color:var(--muted);
  font-family:var(--editorial);
  margin:0;
  font-size:19px;
  font-style:italic;
  line-height:1.5;
}
.scene {
  max-width:1800px;
  margin:0 auto 17vw;
  padding:0 5vw;
}
.scene-figure {
  grid-template-columns:repeat(12,minmax(0,1fr));
  display:grid;
}
.scene-image-wrap {
  background:#eeeae5;
  grid-row:1;
}
.scene-image-wrap img {
  object-fit:contain;
  width:100%;
  height:auto;
  display:block;
}
.scene-caption {
  grid-row:1;
  align-self:end;
}
.scene--left .scene-image-wrap {
  grid-column:1/8;
}
.scene--left .scene-caption {
  grid-column:9/13;
}
.scene--right .scene-image-wrap {
  grid-column:6/13;
}
.scene--right .scene-caption {
  grid-column:1/5;
}
.scene--centre .scene-image-wrap {
  grid-column:2/12;
}
.scene--centre .scene-caption {
  grid-area:2/3/auto/9;
  padding-top:46px;
}
.scene-caption h3 {
  font-family:var(--display);
  letter-spacing:normal;
  margin:0 0 24px;
  font-size:clamp(30px,4vw,46px);
  font-weight:400;
  line-height:1.2;
}
.scene-caption>p {
  color:#2a2826;
  font-family:var(--body);
  max-width:560px;
  margin:0;
  font-size:20px;
  font-weight:300;
  line-height:1.75;
}
.warkah {
  background:var(--ink);
  color:var(--white);
  text-align:center;
  align-content:center;
  min-height:92vh;
  padding:12vw 8vw;
  display:grid;
  position:relative;
  overflow:hidden;
}
.craft-monogram {
  color:#ffffff0e;
  font-family:var(--display);
  pointer-events:none;
  font-size:58vw;
  line-height:.7;
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}
.warkah blockquote {
  font-family:var(--body);
  max-width:1160px;
  margin:0 auto 36px;
  font-size:clamp(26px,3.4vw,46px);
  font-style:italic;
  font-weight:300;
  line-height:1.25;
  position:relative;
}
.warkah cite {
  color:var(--dark-muted);
  font-family:var(--display);
  letter-spacing:.28em;
  text-transform:uppercase;
  font-size:9px;
  font-style:normal;
  position:relative;
}
footer {
  background:var(--white);
  border-top:1px solid var(--line);
  color:var(--grey);
  font-family:var(--display);
  letter-spacing:.14em;
  text-transform:uppercase;
  grid-template-columns:1.4fr 1fr 1.5fr 1fr;
  align-items:center;
  gap:26px;
  padding:38px 4vw;
  font-size:9px;
  display:grid;
}
footer p {
  margin:0;
}
.footer-brand {
  color:var(--ink);
  letter-spacing:.04em;
  text-transform:none;
  font-size:16px;
  font-weight:400;
}
footer .foot-line {
  color:var(--soft);
  font-family:var(--body);
  letter-spacing:0;
  text-transform:none;
  font-size:16px;
  font-style:italic;
}
@media (max-width:980px) {
  .hero {
    grid-template-columns:minmax(0,1fr) minmax(390px,.9fr);
  }
  .hero-copy {
    padding-left:36px;
    padding-right:36px;
  }
  .manifesto-grid {
    gap:6vw;
  }
  .scene--left .scene-image-wrap {
    grid-column:1/9;
  }
  .scene--left .scene-caption {
    grid-column:10/13;
  }
  .scene--right .scene-image-wrap {
    grid-column:5/13;
  }
  .scene--right .scene-caption {
    grid-column:1/4;
  }
}
@media (max-width:900px) {
  .nav-shell {
    flex-direction:column;
    align-items:flex-start;
    gap:18px;
  }
  .nav-links {
    flex-wrap:wrap;
    gap:16px 22px;
  }
}
@media (max-width:768px) {
  body {
    font-size:16px;
    line-height:1.6;
  }
  .nav-shell {
    align-items:stretch;
    gap:12px;
    padding:18px 20px 12px;
  }
  .brand {
    justify-content:center;
  }
  .brand-name {
    letter-spacing:.34em;
    font-size:12px;
  }
  .nav-links {
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:0;
    width:100%;
    display:grid;
  }
  .nav-links a {
    letter-spacing:.22em;
    white-space:nowrap;
    justify-content:center;
    align-items:center;
    min-height:32px;
    font-size:6.5px;
    display:flex;
  }
  .hero {
    flex-direction:column;
    min-height:auto;
    display:flex;
  }
  .hero-visual {
    order:2;
    padding:0 14px 14px;
  }
  .hero-image {
    object-fit:contain;
    width:100%;
    height:auto;
    max-height:none;
  }
  .hero-copy {
    order:1;
    padding:76px 24px 72px;
  }
  .hero-kicker {
    font-size:8px;
    line-height:1.7;
  }
  .hero h1 {
    font-size:44px;
    line-height:1.08;
  }
  .hero h1 em {
    font-size:34px;
  }
  .hero-tagline {
    font-size:18px;
    line-height:1.7;
  }
  .hero-sub {
    font-size:16px;
    line-height:1.7;
  }
  .scroll-cue {
    font-size:7px;
  }
  .hero-principle h2 {
    font-size:8px;
  }
  .hero-principle p {
    font-size:22px;
    line-height:1.45;
  }
  .manifesto {
    min-height:auto;
    padding:52px 24px;
  }
  .manifesto-grid {
    display:block;
  }
  .manifesto h2 {
    margin-bottom:50px;
    font-size:30px;
    line-height:1.2;
  }
  .manifesto-copy p {
    font-size:16px;
    line-height:1.75;
  }
  .collection-intro {
    min-height:auto;
    padding:58px 24px;
  }
  .collection-intro>div {
    margin-left:0;
  }
  .collection-intro h2 {
    font-size:30px;
    line-height:1.2;
  }
  .collection-intro>div>p:last-child {
    font-size:19px;
  }
  .gallery {
    padding:52px 0 20px;
  }
  .group-heading {
    align-items:flex-start;
    gap:10px;
    margin-bottom:52px;
    padding:0 24px 18px;
    display:grid;
  }
  .group-heading h3 {
    font-size:30px;
    line-height:1.2;
  }
  .group-heading p {
    font-size:19px;
  }
  .scene {
    margin-bottom:92px;
    padding:0 24px;
  }
  .scene-figure {
    display:block;
  }
  .scene-caption,.scene--centre .scene-caption {
    padding:32px 0 0;
  }
  .scene-caption h3 {
    margin-bottom:10px;
    font-size:30px;
    line-height:1.2;
  }
  .scene-caption>p {
    font-size:16px;
    line-height:1.75;
  }
  .warkah {
    min-height:72vh;
    padding:64px 24px;
  }
  .craft-monogram {
    font-size:92vw;
  }
  .warkah blockquote {
    font-size:26px;
    line-height:1.8;
  }
  footer {
    text-align:left;
    grid-template-columns:1fr;
    align-items:flex-start;
    padding:28px 24px;
  }
  .footer-brand {
    letter-spacing:.38em;
    text-transform:uppercase;
    font-size:13px;
  }
  footer .foot-line {
    font-size:14px;
  }
}
@media (max-width:420px) {
  .nav-shell {
    padding-left:14px;
    padding-right:14px;
  }
  .brand-name {
    letter-spacing:.3em;
  }
  .nav-links a {
    letter-spacing:.18em;
    font-size:6px;
  }
}
@media (prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto;
  }
  *,:before,:after {
    transition-duration:.01ms!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
  }
}