/* Sunday Flowers v2: an illustrated flower book for a Brunswick East florist.
   The look and rhythm follow Lewis Miller Design (New York); every rule here is
   original. Edit by hand; the pages themselves come from
   design/showcase/sunday-flowers-v2/build.py. */

@font-face{font-family:'Sunday Display';src:url('/static/bodoni-moda-latin-opsz-normal-c032219ef636.woff2') format('woff2');font-style:normal;font-weight:400 900;font-display:swap}
@font-face{font-family:'Sunday Display';src:url('/static/bodoni-moda-latin-opsz-italic-b737328c13b9.woff2') format('woff2');font-style:italic;font-weight:400 900;font-display:swap}
@font-face{font-family:'Sunday Text';src:url('/static/eb-garamond-latin-400-normal-912929dba0fa.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Sunday Text';src:url('/static/eb-garamond-latin-400-italic-fc5851c4466e.woff2') format('woff2');font-style:italic;font-weight:400;font-display:swap}

:root{
  --cream:#fef7ee;
  --chalk:#f0ece5;
  --petal:#faf2ec;
  --rose:#f3ebe7;
  --card:#f1ebe6;
  --parchment:#f3ead6;
  --navy:#243858;
  --navy-deep:#1a2a47;
  --sage:#759b81;
  --sage-deep:#4f7559;
  --sage-band:#5d8469;
  --mustard:#efb444;
  --plum:#6a3e4f;
  --plum-deep:#43233a;
  --ink:#4a3540;
  --display:'Sunday Display','Bodoni 72',Didot,'Times New Roman',serif;
  --text:'Sunday Text',Garamond,'Times New Roman',serif;
  --edge:clamp(20px,5vw,72px);
  --slide:cubic-bezier(.4,0,.2,1);
  --ribbon:34px;
  --rosette:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='%23243858'%3E%3Cellipse cx='20' cy='10.5' rx='5' ry='7'/%3E%3Cellipse cx='20' cy='29.5' rx='5' ry='7'/%3E%3Cellipse cx='10.5' cy='20' rx='7' ry='5'/%3E%3Cellipse cx='29.5' cy='20' rx='7' ry='5'/%3E%3C/g%3E%3Cg fill='%23f0ece5'%3E%3Ccircle cx='13' cy='13' r='3.4'/%3E%3Ccircle cx='27' cy='13' r='3.4'/%3E%3Ccircle cx='27' cy='27' r='3.4'/%3E%3Ccircle cx='13' cy='27' r='3.4'/%3E%3C/g%3E%3Ccircle cx='20' cy='20' r='4.2' fill='%23efb444'/%3E%3C/svg%3E");
}

html{scroll-padding-top:24px;background:var(--plum-deep)}
/* The display face is a variable Bodoni with an optical size axis. Left on
   auto, large headings get the hairline fashion cut; the static text cut
   (opsz 11) has the sturdier, bookish hairlines this design wants. */
body{background:var(--cream);color:var(--ink);font:400 18px/1.5 var(--text);font-optical-sizing:none;overflow-x:hidden}
h1,h2,h3,p,figure,ul,ol,dl,dd{margin:0}
ul{padding:0;list-style:none}
h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1;letter-spacing:-.02em;text-wrap:balance}
a{color:inherit}
p{text-wrap:pretty}
p+p{margin-top:.9em}
img{height:auto}
::selection{background:var(--mustard);color:var(--navy-deep)}
:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.sn-visually-hidden{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* ---------- Display headings: a roman phrase with an italic keyword ----------
   The capitalised keyword with a trailing ellipsis is the signature, saved for
   a handful of moments (.sn-say--caps); elsewhere the keyword stays lowercase. */
.sn-say{font-size:clamp(32px,1.4vw + 26px,48px);color:var(--plum)}
.sn-say em,.sn-title em{font-style:italic}
.sn-say--caps em{text-transform:uppercase;letter-spacing:-.01em}
.sn-say--sm{font-size:clamp(30px,.8vw + 25px,38px)}
.sn-say--lg{font-size:clamp(36px,2.2vw + 29px,64px)}
.sn-say--xl{font-size:clamp(40px,3.8vw + 28px,86px)}
.sn-say--stack{font-size:clamp(28px,1.6vw + 22px,46px);color:var(--chalk)}
.sn-say--stack em{display:inline-block;font-size:1.75em;line-height:.9;margin-left:.08em}
.sn-title{font-size:clamp(34px,1.6vw + 26px,50px);color:var(--plum)}

/* ---------- Buttons and links ---------- */
.sn-btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:10px 24px;border:1px solid transparent;background:var(--plum);color:var(--chalk);font:400 18px/1.2 var(--text);letter-spacing:.01em;text-decoration:none;transition:background-color .25s ease,color .25s ease}
.sn-btn:hover{background:var(--plum-deep)}
.sn-btn--ghost{background:transparent;border-color:currentColor;color:var(--plum)}
.sn-btn--ghost:hover{background:var(--plum);color:var(--chalk);border-color:var(--plum)}
.sn-btn:disabled{opacity:.55}
.sn-link{display:inline-block;font-style:italic;font-size:19px;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.28em;transition:text-underline-offset .2s ease}
.sn-link:hover{text-underline-offset:.4em}

/* ---------- Masthead: illustrative ribbon, then a header laid over the hero ---------- */
.sn-masthead{position:absolute;inset:0 0 auto;z-index:30}
.sn-ribbon{min-height:var(--ribbon);display:flex;align-items:center;justify-content:center;padding:6px 16px;background:var(--plum-deep);color:var(--chalk);font-size:14px;line-height:1.3;text-align:center}
.sn-ribbon p{margin:0}
.sn-ribbon a{margin-left:.7em;color:var(--mustard);text-underline-offset:.22em}
.sn-header{position:relative;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:20px clamp(16px,4.6vw,84px);color:var(--chalk)}
.sn-toggle{position:relative;z-index:3;justify-self:start;display:inline-grid;place-items:center;width:52px;height:52px;margin-left:-12px;padding:0;border:0;background:transparent;color:inherit}
.sn-toggle-lines{position:relative;display:block;width:28px;height:17px}
.sn-toggle-lines i{position:absolute;left:0;width:100%;height:1.5px;background:currentColor;transition:transform .4s var(--slide),opacity .25s ease,top .4s var(--slide)}
.sn-toggle-lines i:nth-child(1){top:0}
.sn-toggle-lines i:nth-child(2){top:7.75px}
.sn-toggle-lines i:nth-child(3){top:15.5px}
.sn-toggle[aria-expanded="true"]{color:#e3a3ad}
.sn-toggle[aria-expanded="true"] i:nth-child(1){top:7.75px;transform:rotate(45deg)}
.sn-toggle[aria-expanded="true"] i:nth-child(2){opacity:0}
.sn-toggle[aria-expanded="true"] i:nth-child(3){top:7.75px;transform:rotate(-45deg)}
.sn-brand{display:inline-flex;flex-direction:column;align-items:center;color:inherit;text-decoration:none}
.sn-mono{display:inline-flex;align-items:baseline;font-family:var(--display);font-size:62px;line-height:.9;text-shadow:0 1px 18px rgba(0,0,0,.25)}
.sn-mono b{font-weight:400}
.sn-mono i{margin-left:-.2em;transform:translateY(.16em)}
.sn-brand small{margin-top:21px;font:400 10px/1 var(--text);letter-spacing:.34em;text-transform:uppercase;margin-right:-.34em;text-shadow:0 1px 8px rgba(0,0,0,.45)}
.sn-header .sn-brand{position:relative;grid-column:2}
/* A soft shade behind the monogram keeps its small caps clear of pale petals. */
.sn-header .sn-brand::before{content:"";position:absolute;inset:-24px -70px -34px;z-index:-1;background:radial-gradient(closest-side,rgba(14,12,16,.55),rgba(14,12,16,.3) 62%,rgba(14,12,16,0));transition:opacity .3s ease}
body.menu-open .sn-header .sn-brand::before{opacity:0}
/* One Enquire style: cream on the photo heroes, navy with mustard while the menu is open. */
.sn-header-cta{grid-column:3;justify-self:end;display:inline-flex;align-items:center;min-height:42px;padding:8px 20px;background:var(--cream);color:var(--navy);font-size:17px;text-decoration:none;transition:background-color .3s ease,color .3s ease}
.sn-header-cta:hover{background:var(--mustard);color:var(--navy-deep)}
body.menu-open .sn-header-cta{background:var(--navy);color:var(--mustard)}
body.menu-open .sn-header .sn-mono,body.menu-open .sn-header .sn-brand small{text-shadow:none}
/* Without JavaScript the menu is a plain row of links under the monogram. */
.sn-menu{grid-column:1/-1;display:flex;flex-wrap:wrap;justify-content:center;gap:4px 20px;padding-top:14px;font-size:17px}
.sn-menu a{color:inherit;text-decoration:none}
.sn-toggle{display:none}
.has-js .sn-toggle{display:inline-grid}
.has-js .sn-menu{position:fixed;z-index:2;inset:0 auto 0 0;width:min(475px,100%);flex-direction:column;flex-wrap:nowrap;align-items:center;justify-content:flex-start;gap:0;padding:clamp(130px,21vh,200px) 24px clamp(36px,7vh,64px);overflow-y:auto;overscroll-behavior:contain;background:var(--navy);color:#fff;transform:translateX(-100%);visibility:hidden;transition:transform .4s var(--slide),visibility 0s .4s}
.has-js .sn-menu[data-open]{transform:none;visibility:visible;transition:transform .4s var(--slide)}
.has-js .sn-menu a{padding:12px;font:400 28px/1.2 var(--text);transition:opacity .2s ease}
.has-js .sn-menu a:hover{opacity:.8}
.has-js .sn-menu a[aria-current="page"]{font-style:italic}
.has-js .sn-menu .sn-menu-cta{margin-top:auto;padding-top:clamp(28px,6vh,64px);font-size:22px;color:var(--chalk)}

/* ---------- Heroes ---------- */
.sn-hero{position:relative;display:grid;place-items:center;min-height:max(600px,100svh);overflow:hidden;background:var(--plum-deep);color:var(--chalk)}
.sn-hero-media,.sn-hero-media img{position:absolute;inset:0;width:100%;height:100%}
.sn-hero-media img{object-fit:cover;object-position:var(--focus,50% 50%)}
.sn-hero::before{content:"";position:absolute;inset:0 0 auto;height:260px;background:linear-gradient(rgba(20,16,24,.5),rgba(20,16,24,0));z-index:1}
.sn-hero--short{min-height:max(560px,78svh)}
.sn-hero--scrim::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 58% 46% at 50% 55%,rgba(18,14,22,.6),rgba(18,14,22,.1) 80%),rgba(18,14,22,.22)}
.sn-hero--deep::after{background:radial-gradient(ellipse 60% 48% at 50% 55%,rgba(24,10,18,.72),rgba(24,10,18,0) 78%),rgba(24,10,18,.3)}
.sn-hero--soft::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 50% 30% at 50% 54%,rgba(30,18,14,.5),rgba(30,18,14,0) 80%)}
.sn-hero-title{position:relative;z-index:2;padding:150px var(--edge) 70px;text-align:center;text-shadow:0 2px 30px rgba(10,8,14,.45)}
.sn-hero-title h1{font-size:clamp(54px,6.6vw + 10px,118px);line-height:.98;color:var(--chalk)}
.sn-hero-title h1 em{font-style:italic}
.sn-hero-title p{max-width:30ch;margin:22px auto 0;font-size:clamp(20px,.6vw + 16px,25px);font-style:italic;line-height:1.35}
/* The wordmark is set close, as one name, with the italic word just clear of the y. */
.sn-wordmark{font-size:clamp(58px,8.4vw + 10px,140px)!important;letter-spacing:-.035em!important;white-space:nowrap}
.sn-wordmark span,.sn-wordmark em{display:inline-block}
.sn-wordmark em{margin-left:.06em}
.sn-hero--left{place-items:end start}
.sn-hero--left .sn-hero-title{padding-bottom:clamp(48px,9vh,110px);text-align:left}
.sn-hero--left .sn-hero-title h1{font-size:clamp(60px,7.4vw + 12px,138px)}
.sn-hero--left::after{content:"";position:absolute;inset:auto 0 0;height:60%;background:linear-gradient(rgba(16,14,20,0),rgba(16,14,20,.5))}
.sn-hero--story{--focus:50% 84%}
.sn-hero--low{place-items:end center}
.sn-hero--low .sn-hero-title{padding-bottom:clamp(64px,13vh,150px)}
/* Collection: a deeper top shade keeps the monogram clear of the flowers, and a
   small label at the foot of the photo names the page. */
.sn-hero--collection{--focus:50% 22%}
.sn-hero--collection::before{height:340px;background:linear-gradient(rgba(14,10,18,.78),rgba(14,10,18,.38) 55%,rgba(14,10,18,0))}
.sn-hero--collection::after{content:"";position:absolute;inset:auto 0 0;height:34%;background:linear-gradient(rgba(10,8,12,0),rgba(10,8,12,.6))}
.sn-hero-label{position:absolute;z-index:2;left:50%;bottom:clamp(28px,5vh,48px);display:grid;justify-items:center;gap:6px;width:max-content;max-width:calc(100% - 40px);transform:translateX(-50%);font-size:clamp(19px,.5vw + 16px,23px);font-style:italic;text-align:center;text-shadow:0 1px 12px rgba(0,0,0,.5)}
.sn-hero-label span{font-size:13px;font-style:normal;letter-spacing:.3em;text-transform:uppercase;margin-right:-.3em}

/* ---------- Marbled paper bands ----------
   Tinted scans of antique marbled papers (tools/marble.py). The sheet shows
   at full strength at the edges; the words sit on a soft pool of the paper's
   own deepest colour (--pool), so every line stays clear of the drops. */
.sn-marble{--tint:12 32 28;--pool:12 38 34;position:relative;isolation:isolate;overflow:hidden;padding:clamp(64px,6.4vw,104px) var(--edge);background:#1d3b31;color:var(--chalk);text-align:center}
.sn-marble--ink{--tint:22 30 74;--pool:24 32 86;background:#2f3f86}
.sn-marble--plum{--tint:34 12 28;--pool:40 14 34;background:#4b2440}
.sn-paper{position:absolute;inset:0;z-index:-2}
.sn-paper img{width:100%;height:100%;object-fit:cover}
.sn-marble::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 70% 80% at 50% 50%,rgb(var(--tint) / .24),rgb(var(--tint) / .06))}
.sn-marble-copy,.sn-journal-head{position:relative;isolation:isolate;max-width:860px;margin-inline:auto}
.sn-marble-copy::before,.sn-journal-head::before{content:"";position:absolute;inset:-30px -54px;z-index:-1;border-radius:46%;background:rgb(var(--pool) / .84);filter:blur(30px)}
.sn-marble-copy h2,.sn-journal-head h2{text-shadow:0 1px 3px rgb(var(--pool) / .7)}
.sn-lede{max-width:38em;margin:26px auto 0;font:400 clamp(20px,.3vw + 18px,22px)/1.5 var(--text);text-shadow:0 1px 2px rgb(var(--pool) / .9)}

/* ---------- Colour splits: 1/2, 2/3 or 3/4 photo beside a jewel panel ---------- */
.sn-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:clamp(560px,48vw,820px)}
.sn-split--wide{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.sn-split--wide.sn-split--flip{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.sn-split--wider{grid-template-columns:minmax(0,3fr) minmax(0,1fr)}
.sn-split--wider.sn-split--flip{grid-template-columns:minmax(0,1fr) minmax(0,3fr)}
.sn-shot{position:relative;min-height:100%;overflow:hidden;background:var(--rose)}
.sn-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%)}
.sn-shot--print{background:#f1e8d6}
.sn-shot--print img{inset:7% 9%;width:82%;height:86%;object-fit:contain;mix-blend-mode:multiply}
.sn-pair{display:grid;grid-template-columns:1fr 1fr}
.sn-panel{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:clamp(56px,6vw,104px) clamp(26px,4.6vw,80px);text-align:center}
.sn-panel>p,.sn-panel>ul,.sn-panel>dl{max-width:34em}
.sn-panel>p+p{margin-top:-8px}
.sn-panel em{font-style:italic}
.sn-panel--paper{background:var(--petal)}
.sn-panel--blush{background:var(--rose)}
.sn-panel--navy{background:var(--navy);color:var(--mustard)}
.sn-panel--navy .sn-say,.sn-panel--navy .sn-step{color:var(--mustard)}
.sn-panel--sage{background:var(--sage);color:var(--navy-deep)}
.sn-panel--sage .sn-say,.sn-panel--sage .sn-step{color:var(--navy-deep)}
.sn-panel--plum{background:var(--plum);color:var(--chalk)}
.sn-panel--plum .sn-say,.sn-panel--plum .sn-title{color:var(--chalk)}
.sn-panel--plum .sn-say em,.sn-panel--plum .sn-title em{color:var(--mustard)}
.sn-panel--mustard{background:var(--mustard);color:var(--navy-deep)}
.sn-panel--mustard .sn-say{color:var(--navy-deep)}
.sn-panel--navy .sn-btn,.sn-panel--plum .sn-btn{background:var(--mustard);color:var(--navy-deep)}
.sn-panel--navy .sn-btn:hover,.sn-panel--plum .sn-btn:hover{background:#f5c66b}
.sn-panel-note{font-style:italic;color:#f3dfc0}
.sn-panel--story{align-items:flex-start;text-align:left}
.sn-panel--story .sn-title{margin-bottom:4px}
.sn-step{display:flex;align-items:center;gap:14px;margin-bottom:-8px;font-style:italic;font-size:19px;letter-spacing:.14em;text-transform:uppercase;color:var(--plum)}
.sn-step::before,.sn-step::after{content:"";width:28px;height:1px;background:currentColor;opacity:.6}

/* ---------- Lists, prices and ticks ---------- */
.sn-prices{width:min(100%,400px);text-align:left}
.sn-prices div{display:flex;align-items:baseline;justify-content:space-between;gap:18px;padding:11px 0;border-bottom:1px solid rgba(106,62,79,.24)}
.sn-prices dt{font-style:italic}
.sn-prices dd{font-family:var(--display);font-size:19px;white-space:nowrap;color:var(--plum)}
.sn-panel--sage .sn-prices div{border-bottom-color:rgba(26,42,71,.3)}
.sn-panel--sage .sn-prices dd{color:var(--navy-deep)}
.sn-ticks{display:grid;gap:12px;width:min(100%,430px);text-align:left}
.sn-ticks li{position:relative;padding-left:32px}
.sn-ticks li::before{content:"";position:absolute;left:0;top:.36em;width:16px;height:16px;background:var(--rosette) center/contain no-repeat}

/* ---------- Moving list of flowers ----------
   The names run in their own window, which fades out before the pause button,
   so they never pass underneath it. */
.sn-strip{display:flex;align-items:center;gap:10px;min-height:clamp(84px,8vw,124px);padding-right:clamp(10px,1.4vw,20px);overflow:hidden;background:var(--mustard);color:var(--navy-deep)}
.sn-strip-window{flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 24px),transparent)}
.sn-strip-track{display:flex;width:max-content;animation:sn-drift 70s linear infinite}
.sn-strip ul{display:flex;align-items:center;flex-shrink:0}
.sn-strip li{display:flex;align-items:center;gap:34px;padding-right:34px;font:italic 400 clamp(28px,1.4vw + 16px,38px)/1 var(--display);white-space:nowrap}
.sn-strip li::after{content:"";width:26px;height:26px;background:var(--rosette) center/contain no-repeat}
.sn-strip.is-paused .sn-strip-track,.sn-strip:hover .sn-strip-track,.sn-strip:focus-within .sn-strip-track{animation-play-state:paused}
.sn-strip-toggle{flex:none;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid rgba(26,42,71,.45);background:transparent;color:var(--navy-deep);transition:background-color .2s ease}
.sn-strip-toggle:hover{background:rgba(26,42,71,.08)}
.sn-strip-toggle svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linejoin:round}
.sn-strip-toggle .sn-icon-play{display:none}
.sn-strip.is-paused .sn-icon-pause{display:none}
.sn-strip.is-paused .sn-icon-play{display:block;fill:currentColor;stroke:none}
@keyframes sn-drift{to{transform:translateX(-50%)}}

/* ---------- Carousels ---------- */
.sn-carousel{position:relative;min-width:0}
.sn-track{display:flex;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none}
.sn-track::-webkit-scrollbar{display:none}
.sn-track:focus-visible{outline-offset:-3px}
.sn-slide{flex:0 0 100%;scroll-snap-align:center}
.sn-carousel-nav{display:flex;align-items:center;justify-content:center}
.sn-carousel-nav p{min-width:5.5em;font-size:15px;letter-spacing:.12em;text-transform:uppercase;text-align:center}
.sn-carousel-nav button{position:absolute;top:var(--arrow-top,50%);display:grid;place-items:center;width:48px;height:48px;padding:0;border:0;background:transparent;color:inherit;transform:translateY(-50%);transition:transform .25s ease}
.sn-carousel-nav button svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.2}
.sn-carousel-nav [data-carousel-prev]{left:0}
.sn-carousel-nav [data-carousel-next]{right:0}
.sn-carousel-nav [data-carousel-prev]:hover{transform:translate(-3px,-50%)}
.sn-carousel-nav [data-carousel-next]:hover{transform:translate(3px,-50%)}

/* Vessels on mustard, beside a sage panel */
.sn-treasure{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.sn-treasure-shelf{display:flex;align-items:center;padding:56px clamp(16px,2.4vw,40px) 40px;background:var(--mustard);color:var(--navy-deep)}
.sn-treasure-shelf .sn-carousel{width:100%;--arrow-top:42%}
.sn-carousel--vessels .sn-slide figure{display:flex;flex-direction:column;align-items:center;padding:0 56px}
.sn-carousel--vessels img{width:min(100%,380px);aspect-ratio:2/3;object-fit:cover;box-shadow:0 22px 40px -26px rgba(64,40,10,.55)}
.sn-carousel--vessels figcaption{display:grid;gap:4px;margin-top:22px;text-align:center}
.sn-carousel--vessels figcaption strong{font:400 27px/1.1 var(--display)}
.sn-carousel--vessels figcaption span{font-size:17px;font-style:italic}
.sn-carousel--vessels .sn-carousel-nav{margin-top:18px}
.sn-panel--keep{gap:26px}
.sn-panel--keep .sn-prices{width:min(100%,420px)}

/* Studio notes on ink marble: the title sits on the paper under each photo,
   and small mustard squares on the photo's edges turn the pages. */
.sn-journal{padding-bottom:clamp(48px,5vw,80px)}
.sn-journal-head{max-width:760px;margin-bottom:clamp(30px,3.6vw,52px)}
.sn-journal-head .sn-say{color:var(--chalk)}
.sn-journal-head p{margin-top:16px;font:400 clamp(19px,.3vw + 17px,21px)/1.5 var(--text);text-shadow:0 1px 2px rgb(var(--pool) / .9)}
.sn-carousel--notes{max-width:900px;margin:0 auto;container-type:inline-size}
.sn-carousel--notes .sn-track{padding-bottom:30px}
.sn-carousel--notes .sn-slide a{display:block;color:inherit;text-decoration:none}
.sn-carousel--notes img{width:100%;aspect-ratio:16/10;object-fit:cover;box-shadow:0 30px 60px -30px rgba(0,0,0,.7)}
.sn-slide-caption{position:relative;isolation:isolate;display:grid;justify-items:center;gap:8px;padding:24px 20px 6px;text-align:center}
.sn-slide-caption::before{content:"";position:absolute;inset:16px 16% 0;z-index:-1;border-radius:50%;background:rgb(var(--pool) / .74);filter:blur(22px)}
.sn-slide-caption strong{font:400 clamp(32px,2.6vw,48px)/1.08 var(--display);color:var(--chalk);text-shadow:0 1px 3px rgb(var(--pool) / .8),0 0 24px rgb(var(--pool) / .7)}
.sn-slide-caption span{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:#e6e2ef;text-shadow:0 1px 2px rgb(var(--pool) / .9)}
.sn-carousel--notes .sn-slide a:hover strong{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.16em}
.sn-carousel--notes .sn-carousel-nav{margin-top:-14px}
.sn-carousel--notes .sn-carousel-nav p{position:relative;isolation:isolate;min-width:0;font-size:16px;font-style:italic;letter-spacing:.02em;text-transform:none;color:#f0ecf4;text-shadow:0 1px 2px rgb(var(--pool) / .9)}
.sn-carousel--notes .sn-carousel-nav p::before{content:"";position:absolute;inset:-4px -22px;z-index:-1;border-radius:50%;background:rgb(var(--pool) / .8);filter:blur(10px)}
.sn-carousel--notes .sn-carousel-nav button{top:calc(100cqw * .3125);width:40px;height:40px;background:var(--mustard);color:var(--navy-deep);transition:background-color .2s ease,transform .25s ease}
.sn-carousel--notes .sn-carousel-nav button svg{width:22px;height:22px;stroke-width:1.7}
.sn-carousel--notes .sn-carousel-nav button:hover{background:#f5c66b}
.sn-carousel--notes [data-carousel-prev]{left:14px}
.sn-carousel--notes [data-carousel-next]{right:14px}

/* ---------- Rosette ribbon and mustard close ---------- */
.sn-rosettes{height:46px;background:var(--rosette) 0 50%/34px 34px repeat-x,var(--sage-band);border-block:4px solid var(--navy-deep);box-shadow:inset 0 3px 0 rgba(240,236,229,.5),inset 0 -3px 0 rgba(240,236,229,.5)}
.sn-closing{display:flex;flex-direction:column;align-items:center;gap:22px;padding:clamp(68px,7vw,110px) var(--edge);background:var(--mustard);color:var(--navy-deep);text-align:center}
.sn-closing h2{font-size:clamp(36px,1.8vw + 28px,58px);color:var(--navy-deep)}
.sn-closing h2 em{font-style:italic}
.sn-closing--caps h2{font-style:italic}
.sn-closing--caps h2 em{text-transform:uppercase}
.sn-closing p{max-width:36em}

/* ---------- Parchment plates with engravings ---------- */
.sn-plate{position:relative;isolation:isolate;display:grid;place-items:center;min-height:clamp(640px,56vw,860px);padding:clamp(150px,13vw,200px) var(--edge) clamp(120px,12vw,180px);overflow:hidden;background-color:#faf5ea;background-image:radial-gradient(ellipse 70% 60% at 50% 46%,rgba(255,253,247,.9),rgba(255,253,247,0) 76%),radial-gradient(circle at 9% 84%,rgba(170,132,78,.07),rgba(170,132,78,0) 26%),radial-gradient(circle at 91% 14%,rgba(170,132,78,.06),rgba(170,132,78,0) 24%),radial-gradient(circle at 70% 92%,rgba(170,132,78,.05),rgba(170,132,78,0) 22%),url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHdpZHRoPSczMDAnIGhlaWdodD0nMzAwJz48ZmlsdGVyIGlkPSdnJz48ZmVUdXJidWxlbmNlIHR5cGU9J2ZyYWN0YWxOb2lzZScgYmFzZUZyZXF1ZW5jeT0nLjgnIG51bU9jdGF2ZXM9JzMnIHN0aXRjaFRpbGVzPSdzdGl0Y2gnLz48ZmVDb2xvck1hdHJpeCB2YWx1ZXM9JzAgMCAwIDAgLjQgMCAwIDAgMCAuMyAwIDAgMCAwIC4xOCAwIDAgMCAuMTMgMCcvPjwvZmlsdGVyPjxyZWN0IHdpZHRoPScxMDAlJyBoZWlnaHQ9JzEwMCUnIGZpbHRlcj0ndXJsKCNnKScvPjwvc3ZnPg==")}
.sn-plate-art{position:absolute;inset:0;pointer-events:none}
/* Etchings print as one dark sepia ink (multiplied onto the paper), large
   enough that several run off the edges of the plate. */
.sn-etching{position:absolute;height:auto;mix-blend-mode:multiply}
.sn-etching--a{left:1%;top:-7%;width:19%}
.sn-etching--b{right:-4%;top:-3%;width:30%}
.sn-etching--c{left:17%;bottom:-13%;width:15%}
.sn-etching--d{right:8%;bottom:-17%;width:24%}
.sn-etching--e{left:-4%;bottom:-21%;width:19%}
.sn-etching--h{left:27%;top:8%;width:13%}
.sn-etching--f{left:-2%;bottom:-20%;width:21%}
.sn-etching--g{right:-3%;top:-12%;width:22%}
.sn-etching--i{left:7%;top:9%;width:14%}
.sn-plate-copy{position:relative;z-index:1;max-width:780px;text-align:center;color:var(--navy)}
.sn-plate-copy h1{font-size:clamp(56px,6.2vw + 8px,112px);letter-spacing:.01em;text-transform:uppercase;line-height:.9;color:var(--navy)}
.sn-plate-copy .sn-say{color:var(--navy)}
.sn-plate-copy p{max-width:40em;margin:clamp(22px,2.4vw,34px) auto 0;font:400 clamp(20px,.2vw + 18px,21px)/1.5 var(--text);color:var(--navy-deep)}
.sn-plate-copy em{font-style:italic}
.sn-plate--intro{min-height:clamp(460px,38vw,600px);padding-block:clamp(96px,8vw,128px)}
.sn-plate--intro .sn-plate-copy{max-width:720px}

/* ---------- Collection gallery on plum ---------- */
.sn-gallery{padding:clamp(40px,3.6vw,56px) clamp(10px,1.6vw,24px) clamp(56px,5vw,80px);background:var(--plum);color:var(--chalk)}
.sn-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:10px}
.sn-filters button{min-height:44px;padding:8px 20px;border:1px solid rgba(240,236,229,.6);background:transparent;color:var(--chalk);font:italic 400 18px/1 var(--text);transition:background-color .2s ease,color .2s ease}
.sn-filters button:hover{border-color:var(--chalk)}
.sn-filters button[aria-pressed="true"]{background:var(--chalk);border-color:var(--chalk);color:var(--plum);font-style:normal}
.sn-filter-status{margin-bottom:clamp(22px,2.4vw,34px);font-size:15px;letter-spacing:.14em;text-align:center;text-transform:uppercase;color:#e9d6dc}
.sn-masonry{columns:3;column-gap:clamp(8px,.9vw,14px)}
.sn-piece{break-inside:avoid;margin-bottom:clamp(12px,1.2vw,18px)}
.sn-piece a{display:block;overflow:hidden;color:inherit;cursor:zoom-in}
.sn-piece img{width:100%;transition:transform .7s var(--slide),filter .4s ease}
.sn-piece a:hover img{transform:scale(1.025);filter:brightness(1.05)}
.sn-piece a:focus-visible{outline:2px solid var(--chalk);outline-offset:3px}
.sn-piece figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:9px 2px 0}
.sn-piece figcaption span:first-child{font:400 clamp(19px,.5vw + 16px,24px)/1.15 var(--display)}
.sn-piece figcaption span:last-child{font-size:18px;color:var(--mustard)}

/* Lightbox (built by site.js) */
.sn-lightbox{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#3a1e2d;color:var(--chalk)}
.sn-lightbox::backdrop{background:rgba(20,10,16,.6)}
.sn-lightbox[open]{display:grid;grid-template-rows:auto minmax(0,1fr) auto;animation:sn-fade .3s ease}
.sn-lightbox-top{display:flex;justify-content:space-between;align-items:center;padding:12px 14px 0 24px;font-size:15px;letter-spacing:.14em;text-transform:uppercase}
.sn-lightbox button{display:grid;place-items:center;width:52px;height:52px;padding:0;border:0;background:transparent;color:inherit}
.sn-lightbox button svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.2}
.sn-lightbox-stage{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) 64px;align-items:center;min-height:0}
.sn-lightbox-stage img{justify-self:center;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;min-height:0}
.sn-lightbox-caption{display:grid;gap:6px;justify-items:center;padding:16px 24px 26px;text-align:center}
.sn-lightbox-caption h2{font-size:clamp(28px,1.4vw + 22px,40px)}
.sn-lightbox-caption h2 span{margin-left:.4em;font-style:italic;color:var(--mustard)}
.sn-lightbox-caption p{max-width:40em;font-size:18px}
.sn-lightbox-caption a{margin-top:6px;color:var(--mustard);font-style:italic;text-underline-offset:.24em}
@keyframes sn-fade{from{opacity:0}}

/* ---------- FAQ and budgets ---------- */
.sn-faq{padding:clamp(72px,7vw,112px) var(--edge);background:var(--cream)}
.sn-faq-inner{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,7fr);gap:clamp(32px,6vw,100px);max-width:1180px;margin:0 auto}
.sn-faq-head{display:flex;flex-direction:column;gap:20px}
.sn-faq-list{border-top:1px solid rgba(106,62,79,.28)}
.sn-faq details{border-bottom:1px solid rgba(106,62,79,.28)}
.sn-faq summary{position:relative;display:block;padding:22px 52px 22px 0;font:400 clamp(21px,.5vw + 18px,25px)/1.25 var(--display);color:var(--plum);list-style:none}
.sn-faq summary::-webkit-details-marker{display:none}
.sn-faq summary::before,.sn-faq summary::after{content:"";position:absolute;right:8px;top:50%;width:18px;height:1.5px;background:currentColor;transition:transform .3s var(--slide)}
.sn-faq summary::after{transform:rotate(90deg)}
.sn-faq details[open] summary::after{transform:rotate(0)}
.sn-faq details p{max-width:40em;padding:0 0 24px}
.sn-budget{display:flex;flex-direction:column;align-items:center;gap:22px;padding:clamp(72px,7vw,112px) var(--edge);background:var(--petal);text-align:center}
.sn-budget>p{max-width:38em}
.sn-prices--wide{display:grid;grid-template-columns:1fr 1fr;column-gap:56px;width:min(100%,860px)}

/* ---------- Our story ---------- */
.sn-banner{position:relative;isolation:isolate;display:flex;align-items:flex-start;min-height:clamp(560px,52vw,840px);overflow:hidden;color:var(--chalk)}
.sn-banner-photo{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:50% 80%}
.sn-banner::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(6,8,6,.7),rgba(6,8,6,.36) 50%,rgba(6,8,6,0) 74%),linear-gradient(rgba(6,8,6,.46),rgba(6,8,6,0) 70%)}
.sn-banner-copy{max-width:760px;padding:clamp(56px,6vw,96px) var(--edge)}
.sn-banner h2{font-size:clamp(46px,4.4vw + 22px,104px);line-height:.98;color:var(--chalk);text-shadow:0 2px 24px rgba(0,0,0,.4)}
.sn-banner h2 em{font-style:italic}
.sn-banner p{max-width:31em;margin-top:26px;font-size:20px;line-height:1.45;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.sn-notes{padding:clamp(72px,7vw,112px) var(--edge);background:var(--cream)}
.sn-notes-head{max-width:720px;margin:0 auto clamp(36px,4vw,60px);text-align:center}
.sn-notes-head p{margin-top:16px}
.sn-notes-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px);max-width:1240px;margin:0 auto}
.sn-note{padding:34px 30px 38px;border-top:3px solid var(--plum);background:var(--petal);scroll-margin-top:24px;transition:background-color .4s ease,border-color .4s ease}
.sn-note:target{border-top-color:var(--mustard);background:#fbecd2}
.sn-kicker{font-size:14px;letter-spacing:.16em;text-transform:uppercase;color:var(--sage-deep)}
.sn-note h3{margin:12px 0 14px;font-size:clamp(26px,.8vw + 21px,32px);line-height:1.1;color:var(--plum)}
.sn-note h3 em{font-style:italic}

/* ---------- Enquiry: a cream card on a one ink engraved paper ---------- */
.sn-letter{position:relative;isolation:isolate;padding:clamp(56px,6vw,96px) var(--edge);overflow:hidden;background:#e5d8bc}
.sn-letter-paper{position:absolute;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover}
.sn-card{max-width:920px;margin:0 auto;padding:clamp(40px,5vw,64px) clamp(20px,6vw,72px) clamp(40px,4.4vw,56px);background:var(--card);box-shadow:0 30px 70px -40px rgba(60,40,16,.7),0 0 0 1px rgba(92,66,44,.12)}
.sn-card-title,.sn-result h2{font-size:clamp(32px,1.4vw + 26px,48px);color:var(--plum);text-align:center}
.sn-card-title em,.sn-result h2 em{font-style:italic}
.sn-card-note{margin:14px auto 34px;max-width:34em;text-align:center;font-style:italic}
.sn-fields{display:grid;gap:22px}
.sn-field-row{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.sn-field{display:grid;gap:8px;min-width:0}
.sn-field label{font-size:15px;letter-spacing:.12em;text-transform:uppercase;color:var(--sage-deep)}
.sn-field label span{margin-left:.3em;font-style:italic;letter-spacing:.02em;text-transform:none;color:#7c6870}
.sn-field input,.sn-field select,.sn-field textarea{width:100%;min-height:50px;padding:11px 14px;border:1px solid #3d2f35;border-radius:0;background:#fdfbf8;color:#2c2226;font:400 18px/1.35 var(--text)}
.sn-field select{appearance:none;padding-right:44px;background:#fdfbf8 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m6 9.5 6 6 6-6' fill='none' stroke='%233d2f35' stroke-width='1.4'/%3E%3C/svg%3E") right 14px center/18px no-repeat}
.sn-field textarea{min-height:150px;resize:vertical}
.sn-field input:focus-visible,.sn-field select:focus-visible,.sn-field textarea:focus-visible{outline:2px solid var(--plum);outline-offset:2px}
.sn-field small{font-size:16px;font-style:italic;color:#6e5a62}
.sn-form-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin-top:32px}
.sn-form-foot{margin-top:18px;font-size:16px;font-style:italic;text-align:center;color:#6e5a62}
.sn-result{display:grid;gap:18px}
.sn-result>p{text-align:center}
.sn-summary{padding:26px 28px;border:1px solid rgba(61,47,53,.4);background:#fdfbf8;font-size:18px;line-height:1.45}
.sn-result-note{font-style:italic;color:var(--sage-deep)}
.sn-details{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(28px,4vw,64px);padding:clamp(64px,6vw,96px) var(--edge);background:var(--plum);color:var(--chalk);text-align:center}
.sn-details h3{margin-bottom:16px;font-size:clamp(28px,.8vw + 22px,36px);color:var(--chalk)}
.sn-details h3 em{font-style:italic;color:var(--mustard)}

/* ---------- Footer ---------- */
.sn-footer{position:relative;isolation:isolate;overflow:hidden;background:#2a2a2a;color:var(--navy-deep)}
.sn-footer-photo{position:absolute;inset:0;z-index:-1;width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05)}
.sn-footer-body{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:clamp(20px,4vw,72px);max-width:1180px;margin:0 auto;padding:clamp(56px,6vw,96px) var(--edge) clamp(40px,4vw,64px)}
.sn-footer-body::before{content:"";position:absolute;inset:0;z-index:-1;background:rgba(14,14,16,.32)}
.sn-footer-card{padding:28px 24px;background:rgba(244,239,233,.96);text-align:center;font-size:15px;line-height:1.6;letter-spacing:.05em;text-transform:uppercase}
.sn-footer-card h2{margin-bottom:10px;font:italic 400 24px/1.1 var(--display);letter-spacing:0;text-transform:none;color:var(--plum)}
.sn-footer-card em{text-transform:none;letter-spacing:.02em;font-style:italic}
.sn-footer-card:first-child{justify-self:start;width:min(100%,350px)}
.sn-footer-card:nth-child(3){justify-self:end;width:min(100%,350px)}
.sn-footer-mark{position:relative;color:var(--chalk)}
/* A soft shade behind the monogram keeps its small caps clear of bright petals. */
.sn-footer-mark::before{content:"";position:absolute;inset:-30px -64px;z-index:-1;background:radial-gradient(closest-side,rgba(14,12,16,.66),rgba(14,12,16,.34) 62%,rgba(14,12,16,0))}
.sn-footer-mark .sn-mono{font-size:96px;text-shadow:0 2px 24px rgba(0,0,0,.55)}
.sn-footer-mark .sn-brand small{position:relative;isolation:isolate;margin-top:32px;font-size:11px;text-shadow:0 1px 10px rgba(0,0,0,.7)}
/* A small pool under the lettering, which can sit on a bright petal. */
.sn-footer-mark .sn-brand small::before{content:"";position:absolute;inset:-10px -24px;z-index:-1;border-radius:50%;background:rgba(14,12,16,.56);filter:blur(10px)}
.sn-footer-cta{grid-column:1/-1;justify-self:center}
.sn-footer-body--mark{grid-template-columns:1fr;justify-items:center;padding-block:clamp(72px,7vw,112px)}
/* The closing bar: a rosette and an italic sign-off, then the links, then the note. */
.sn-footer-base{display:grid;justify-items:center;gap:20px;padding:clamp(40px,4vw,56px) var(--edge) clamp(30px,3vw,40px);background:var(--plum-deep);color:var(--chalk);text-align:center}
.sn-footer-sign{display:grid;justify-items:center;gap:14px;font:italic 400 clamp(22px,.8vw + 18px,28px)/1.25 var(--display)}
.sn-footer-rosette{width:30px;height:30px;background:var(--rosette) center/contain no-repeat}
.sn-footer-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 34px;font-size:18px}
.sn-footer-nav a{padding:6px 0;text-decoration:none}
.sn-footer-nav a:hover{text-decoration:underline;text-underline-offset:.24em}
.sn-footer-note{max-width:46em;padding-top:18px;border-top:1px solid rgba(240,236,229,.18);font-size:15px;color:#e3d4d9}
.sn-footer-note a{margin-left:.5em;color:var(--mustard);text-underline-offset:.2em;white-space:nowrap}

/* ---------- Back to top: a small square once the reader is two screens in ---------- */
.sn-up{position:fixed;right:16px;bottom:16px;z-index:20;display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(36,56,88,.42);background:rgba(244,240,233,.86);color:var(--navy);opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .3s ease,transform .3s ease,background-color .2s ease,visibility 0s .3s;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.sn-up:hover{background:var(--chalk)}
.sn-up svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.3}
.sn-up.is-shown,.sn-up:focus-visible{opacity:1;visibility:visible;transform:none;transition:opacity .3s ease,transform .3s ease}
html:not(.has-js) .sn-up{opacity:1;visibility:visible;transform:none}
/* Keep text clear of the floating button: panels and question lists that reach
   the right edge leave a gutter at least as wide as the button and its margin. */
@media (min-width:761px){
  .sn-panel{padding-right:max(76px,clamp(26px,4.6vw,80px))}
  .sn-faq{padding-right:max(64px,var(--edge))}
  .sn-journal{padding-inline:max(64px,var(--edge))}
}

/* Small laptops: the three quarter splits ease to two thirds so the panel keeps room. */
@media (max-width:1180px){
  .sn-split--wider{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
  .sn-split--wider.sn-split--flip{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
}
/* ---------- Tablet ---------- */
@media (max-width:1020px){
  .sn-split,.sn-split--wide,.sn-split--wide.sn-split--flip,.sn-split--wider,.sn-split--wider.sn-split--flip{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .sn-masonry{columns:2}
  .sn-faq-inner{grid-template-columns:1fr}
  .sn-notes-grid{grid-template-columns:1fr 1fr}
  .sn-notes-grid .sn-note:last-child{grid-column:1/-1}
  .sn-details{grid-template-columns:1fr}
  .sn-footer-body{grid-template-columns:1fr 1fr}
  .sn-footer-mark{grid-column:1/-1;grid-row:1;justify-self:center}
  .sn-footer-card:first-child,.sn-footer-card:nth-child(3){justify-self:stretch;width:auto}
  .sn-etching--a{width:21%}.sn-etching--b{width:30%}.sn-etching--c{width:17%}.sn-etching--d{width:26%}.sn-etching--e{width:21%}.sn-etching--h{left:25%;width:15%}
  .sn-etching--f{width:24%}.sn-etching--g{width:25%}.sn-etching--i{left:4%;top:7%;width:17%}
}

/* ---------- Phone ---------- */
@media (max-width:760px){
  body{font-size:18px}
  :root{--ribbon:40px}
  .sn-ribbon{font-size:13px}
  .sn-header{grid-template-columns:auto 1fr auto;padding:14px 12px 14px 18px}
  .sn-header .sn-brand{position:relative;z-index:3;grid-column:1;grid-row:1;align-items:flex-start}
  .sn-mono{font-size:44px}
  .sn-brand small{font-size:9px;letter-spacing:.28em}
  .sn-toggle{grid-column:3;grid-row:1;justify-self:end;margin:0}
  .sn-header-cta{display:none}
  .sn-menu{grid-row:2}
  .has-js .sn-menu{width:100%;padding-top:150px}
  .has-js .sn-menu a{padding:11px 12px}
  .sn-hero-title{padding-top:130px}
  .sn-wordmark{font-size:clamp(58px,19vw,84px)!important;white-space:normal;line-height:.92!important}
  .sn-wordmark span,.sn-wordmark em{display:block}
  .sn-wordmark em{margin-left:0}
  .sn-hero--left .sn-hero-title{padding-bottom:56px}
  /* Only a tight shade behind the title, so the table and candles stay clear. */
  .sn-hero--scrim::after{background:radial-gradient(ellipse 80% 30% at 50% 52%,rgba(18,14,22,.66),rgba(18,14,22,.3) 60%,rgba(18,14,22,0) 100%)}
  .sn-hero--deep::after{background:radial-gradient(ellipse 84% 34% at 50% 52%,rgba(24,10,18,.74),rgba(24,10,18,.34) 60%,rgba(24,10,18,0) 100%),rgba(24,10,18,.1)}
  /* Our story: the photo sits low and fades into the wall colour above it,
     which leaves a quiet space for the title. */
  .sn-hero--story{place-items:start;background:#353a3d}
  .sn-hero--story .sn-hero-media img{inset:auto 0 0;height:80%;-webkit-mask-image:linear-gradient(transparent,#000 22%);mask-image:linear-gradient(transparent,#000 22%)}
  .sn-hero--story .sn-hero-title{padding-top:150px}
  .sn-hero--story::after{display:none}
  /* Home on a phone: the portrait crop puts dark timber behind the name, and a
     soft shade under the two stacked words keeps them clear of the petals. */
  .sn-hero--soft::after{background:radial-gradient(ellipse 92% 30% at 50% 53%,rgba(34,20,14,.62),rgba(34,20,14,0) 92%),rgba(34,20,14,.14)}
  .sn-hero--collection::before{height:220px}
  .sn-banner::before{background:linear-gradient(rgba(6,8,6,.74),rgba(6,8,6,.6) 58%,rgba(6,8,6,0) 86%)}
  .sn-split,.sn-split--wide,.sn-split--wide.sn-split--flip,.sn-split--wider,.sn-split--wider.sn-split--flip{grid-template-columns:minmax(0,1fr);min-height:0}
  .sn-split>.sn-panel{order:2}
  .sn-shot{min-height:0;aspect-ratio:4/5}
  .sn-shot--tall img{object-position:50% 50%}
  .sn-split--wide .sn-shot,.sn-split--wider .sn-shot{aspect-ratio:4/3}
  .sn-pair .sn-shot{aspect-ratio:3/4}
  .sn-panel{padding:64px 22px 72px}
  .sn-treasure{grid-template-columns:minmax(0,1fr)}
  .sn-treasure-shelf{padding:52px 6px 34px}
  .sn-carousel--vessels .sn-slide figure{padding:0 52px}
  .sn-carousel--notes img{aspect-ratio:4/3}
  .sn-carousel--notes .sn-carousel-nav button{top:calc(100cqw * .375)}
  .sn-carousel--notes [data-carousel-prev]{left:10px}
  .sn-carousel--notes [data-carousel-next]{right:10px}
  .sn-slide-caption{padding:20px 8px 4px}
  .sn-slide-caption::before{inset:12px 6% 0}
  .sn-marble-copy::before,.sn-journal-head::before{inset:-24px -12px}
  .sn-strip{min-height:70px;padding-right:8px}
  .sn-strip li{font-size:24px;gap:22px;padding-right:22px}
  /* Phones: the etchings crowd the top and bottom edges, so little bare paper
     is left above or below the words. */
  .sn-plate,.sn-plate--intro{min-height:0;padding:36vw 20px 30vw}
  .sn-etching--a{left:-2%;top:-18vw;width:30%}
  .sn-etching--b{right:-6%;top:-14vw;width:40%}
  .sn-etching--h{left:35%;top:6vw;width:28%}
  .sn-etching--c{left:6%;bottom:-12vw;width:22%}
  .sn-etching--d{right:3%;bottom:-16vw;width:34%}
  .sn-etching--e{left:36%;bottom:-22vw;width:26%}
  .sn-etching--f{left:-4%;bottom:-20vw;width:36%}
  .sn-etching--g{right:-6%;top:-16vw;width:36%}
  .sn-etching--i{left:6%;top:7vw;width:34%}
  .sn-plate-copy h1{font-size:clamp(38px,12.4vw,76px)}
  .sn-gallery{padding-inline:8px}
  .sn-masonry{column-gap:8px}
  .sn-piece{margin-bottom:14px}
  .sn-piece figcaption{flex-direction:column;gap:2px;padding:8px 4px 0}
  .sn-piece figcaption span:last-child{font-size:16px}
  .sn-prices--wide{grid-template-columns:1fr}
  .sn-notes-grid{grid-template-columns:1fr}
  .sn-note{padding:28px 22px 32px}
  .sn-banner{min-height:max(620px,150vw)}
  .sn-banner-photo{object-position:50% 50%}
  .sn-field-row{grid-template-columns:1fr}
  .sn-card{padding-inline:18px}
  .sn-letter{padding-inline:12px}
  .sn-footer-body{grid-template-columns:1fr;gap:16px}
  .sn-footer-mark .sn-mono{font-size:76px}
  .sn-footer-nav{gap:4px 22px}
  .sn-lightbox-stage{grid-template-columns:44px minmax(0,1fr) 44px}
  .sn-lightbox button{width:44px;height:44px}
  /* Phones scroll home with a flick, and a floating button would sit on the words. */
  .sn-up,html:not(.has-js) .sn-up{display:none}
  /* A little more shade under the phone header keeps the small caps clear. */
  .sn-hero:not(.sn-hero--collection)::before{height:220px;background:linear-gradient(rgba(20,16,24,.62),rgba(20,16,24,0))}
  .sn-header .sn-brand::before{inset:-18px -42px -24px -30px;background:radial-gradient(closest-side,rgba(14,12,16,.66),rgba(14,12,16,.36) 62%,rgba(14,12,16,0))}
  body.menu-open .sn-header .sn-brand::before{opacity:0}
}
@media (max-width:380px){
  .sn-masonry{columns:1}
  .sn-carousel--vessels .sn-slide figure{padding:0 44px}
  .sn-filters button{padding-inline:14px}
  .sn-ribbon a{display:inline-block}
  .sn-footer-card{padding:24px 10px;font-size:13.5px;letter-spacing:.02em}
}
@media (prefers-reduced-motion:reduce){
  .sn-strip-window{-webkit-mask-image:none;mask-image:none}
  .sn-strip-track{width:auto;animation:none}
  .sn-strip-track ul{flex:1 1 auto;min-width:0;flex-wrap:wrap;justify-content:center;padding:18px max(20px,min(72px,6vw));row-gap:12px}
  .sn-strip-track ul+ul,.sn-strip-toggle,.sn-strip-track li:last-child::after{display:none}
  .sn-piece a:hover img{transform:none}
}