/* ==========================================================================
   M1 · Skeleton
   Values from the Shopify Editions Winter '26 stylesheet: colors #f7f7ee / #292919 /
   #909083 / #5c5c4e / #dcdcd0, container 105rem, grid gap 12px -> clamp(12px,1vw,16px),
   breakpoints 769 / 940 / 1080 / 1280.
   Fonts are free look-alikes: Neue Montreal Bold -> Inter Tight 700,
   HW Cigars (a soft high-contrast display serif) -> Fraunces 400,
   Imperial Script is the same face (free on Google Fonts),
   the italic "ai" of the title lettering -> Instrument Serif Italic.
   ========================================================================== */
:root{
  color-scheme:dark;
  --light:#f7f7ee; --dark:#292919; --grey-mid:#909083; --grey-dark:#5c5c4e; --grey-border:#dcdcd0;
  --ink:#000; --white:#fff; --night:#14140c; --gold:#bf9752;
  --f-sans:"Inter Tight",Helvetica,Arial,sans-serif;
  --f-serif:"Fraunces","Fraunces Variable",Georgia,"Times New Roman",serif;
  --f-script:"Imperial Script",Georgia,serif;
  --f-ital:"Instrument Serif",Georgia,serif;
  --grey-light:#dcdcd0;
  --gs:12px;                       /* --spacing-grid-spacing */
  --gs-md:clamp(12px,1vw,16px);    /* --spacing-grid-spacing-md */
  --container:105rem;
  --hdr:60px;
  --ease-out-cubic:cubic-bezier(.33,1,.68,1);
  --ease-out-back:cubic-bezier(.34,1.56,.64,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
}
@media (min-width:940px){:root{--hdr:50px}}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--night)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{margin:0;background:var(--night);color:var(--light);font-family:var(--f-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip}
body.lock{overflow:hidden}
h1,h2,h3,h4,h5,p,ul,ol,figure,blockquote{margin:0}
ul,ol{list-style:none;padding:0}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
img,svg,canvas,video{display:block;max-width:100%}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.focus-ring:focus-visible,a:focus-visible,button:focus-visible{outline:1px solid #739bff;outline-offset:-1px}
.skip{position:fixed;left:12px;top:-60px;z-index:10000;background:var(--white);color:var(--ink);padding:10px 16px;border-radius:4px;font:700 14px var(--f-sans);text-decoration:none;transition:top .2s}
.skip:focus{top:8px}

/* ---------- 字号体系（与原版 class 同名同值） ---------- */
.headline-1,.headline-2,.headline-3,.headline-4,.headline-5,.headline-6,.bodycopy-1,.bodycopy-2{font-family:var(--f-sans);font-weight:700;text-wrap:pretty}
.headline-1{font-size:72px;line-height:.9;letter-spacing:-.03em}
.headline-3{font-size:54px;line-height:.9;letter-spacing:-.02em}
.headline-4{font-size:32px;line-height:.95;letter-spacing:-.03em}
.headline-5{font-size:24px;line-height:.95;letter-spacing:-.02em}
.headline-6{font-size:18px;line-height:.95;letter-spacing:-.02em}
.narrative-1,.narrative-2,.narrative-3,.narrative-4{font-family:var(--f-serif);font-weight:400;text-wrap:pretty;font-feature-settings:"liga" 1,"kern" 1;font-optical-sizing:auto;font-variation-settings:"SOFT" 40,"WONK" 0}
/* HW Cigars is set at -.05em; Fraunces is already tighter at display sizes, so it gets a little less */
.narrative-1{font-size:28px;line-height:.98;letter-spacing:-.035em}
.narrative-2{font-size:24px;line-height:1;letter-spacing:-.03em}
.narrative-3{font-size:20px;line-height:1.02;letter-spacing:-.025em}
.narrative-4{font-size:12px;line-height:1.07}
.bodycopy-1{font-size:16px;line-height:1.1}
.bodycopy-2{font-size:14px;line-height:1.1}
@media (min-width:769px){
  .headline-1{font-size:clamp(7.5rem,35.7895px + 10.9649vw,13.75rem)}
  .headline-3{font-size:clamp(3.375rem,45.579px + 1.09649vw,4rem)}
  .narrative-1{font-size:clamp(2rem,18.5263px + 1.75439vw,3rem)}
  .narrative-2{font-size:clamp(1.5625rem,21.6316px + .438597vw,1.8125rem)}
  .bodycopy-1{font-size:14px}
  .bodycopy-2{font-size:11px}
}
.text-light{color:var(--light)} .text-dark{color:var(--dark)} .text-grey-mid{color:var(--grey-mid)} .text-grey-dark{color:var(--grey-dark)}

/* Drop caps, exactly as the original: an inline Imperial Script capital (no float),
   70px -> clamp(6rem,…,7.5rem), line-height 0; .drop-cap hangs the first line by one gutter */
.drop-cap::first-letter,.drop-cap-aligned::first-letter{font-family:var(--f-script);font-size:70px;line-height:0;letter-spacing:-.02em;font-weight:400;font-variation-settings:normal}
.drop-cap-aligned{padding-inline:var(--gs-md)}
@media (min-width:769px){
  .drop-cap{padding-inline:var(--gs-md);text-indent:calc(var(--gs) * -1);transform:translate(calc(var(--gs) * -1))}
  .drop-cap::first-letter,.drop-cap-aligned::first-letter{font-size:clamp(6rem,75.7895px + 2.63158vw,7.5rem)}
  .drop-cap.narrative-2::first-letter{font-size:clamp(4.375rem,48.1053px + 2.85088vw,6rem)}
}
@media (min-width:940px){
  .drop-cap{padding-right:0;text-indent:calc(var(--gs-md) * -1);transform:translate(calc(var(--gs-md) * -1))}
  .drop-cap-aligned{padding-inline:0}
}

/* ---------- 布局 ---------- */
.wrapper{position:relative;z-index:2;width:100%;max-width:var(--container);margin:0 auto;container:main / inline-size;pointer-events:none}
.wrapper a,.wrapper button,.wrapper input,.wrapper [data-interactive]{pointer-events:auto}
.grid-padding{padding-inline:var(--gs)}
@media (min-width:769px){.grid-padding{padding-inline:var(--gs-md)}}
.grid12{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--gs);row-gap:2.5rem}
@media (min-width:769px){.grid12{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gs-md)}}
@media (min-width:1080px){.grid12{row-gap:4rem}}

/* 纸张纹理：覆盖在画布之上的全局细纹（原版 texture-src-90.jpg） */
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;background:url(../img/paper.jpg) 0 0/384px;mix-blend-mode:multiply;opacity:.14}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}