/* heysept.com V5 — static rebuild of the V4 Squarespace theme */
:root {
  --white-hsl: 24,35.71%,94.51%;
  --black-hsl: 95,12.5%,18.82%;
  --accent-hsl: 230.79,100%,50.2%;
  --lightAccent-hsl: 33.33,32.14%,89.02%;
  --darkAccent-hsl: 67.5,16%,29.41%;
  --safeDarkAccent-hsl: 230.79,100%,50.2%;
  --bg: #f6f0ec;
  --ink: #2f362a;
  --accent: #0128ff;
  --light: #ece4da;
  --dark: #54573f;
  --sqs-site-gutter: 4vw;
  --sqs-mobile-site-gutter: 6vw;
  --sqs-site-max-width: 1337px;
  --maxPageWidth: 1337px;
  --heading-font: "Epilogue", system-ui, sans-serif;
  --body-font: "Chivo Mono", ui-monospace, monospace;
  /* Squarespace fluid type: min((v-1)*1.2vw + 1rem, max((v-1)*0.012*maxW + 1rem, v*1rem)) */
  --fs-h1: min(calc(2.5 * 1.2vw + 1rem), max(calc(2.5 * 0.012 * var(--maxPageWidth) + 1rem), 3.5rem));
  --fs-h2: min(calc(1.5 * 1.2vw + 1rem), max(calc(1.5 * 0.012 * var(--maxPageWidth) + 1rem), 2.5rem));
  --fs-h3: min(calc(0.7 * 1.2vw + 1rem), max(calc(0.7 * 0.012 * var(--maxPageWidth) + 1rem), 1.7rem));
  --fs-h4: min(calc(0.2 * 1.2vw + 1rem), max(calc(0.2 * 0.012 * var(--maxPageWidth) + 1rem), 1.2rem));
  --fs-p:  min(calc(-0.1 * 1.2vw + 1rem), max(calc(-0.1 * 0.012 * var(--maxPageWidth) + 1rem), 0.9rem));
  --fs-small: min(calc(-0.3 * 1.2vw + 1rem), max(calc(-0.3 * 0.012 * var(--maxPageWidth) + 1rem), 0.7rem));
  --fs-large: min(calc(0.4 * 1.2vw + 1rem), max(calc(0.4 * 0.012 * var(--maxPageWidth) + 1rem), 1.4rem));
}
@media (max-width: 767px) and (orientation: portrait) {
  :root {
    --u: calc(.012 * min(100vh, 900px));
    --fs-h1: calc(2.5 * var(--u) + 1rem);
    --fs-h2: calc(1.5 * var(--u) + 1rem);
    --fs-h3: calc(0.7 * var(--u) + 1rem);
    --fs-h4: calc(0.2 * var(--u) + 1rem);
    --fs-p: calc(-0.1 * var(--u) + 1rem);
    --fs-small: calc(-0.3 * var(--u) + 1rem);
    --fs-large: calc(0.4 * var(--u) + 1rem);
  }
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--body-font); font-size: var(--fs-p);
  letter-spacing: .01em; line-height: 2.3em;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: var(--accent); }

/* ---------- header ---------- */
.site-header {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: clamp(8px, 1.6vw, 26px);
  padding: clamp(14px, 1.6vw, 23px) var(--sqs-site-gutter) clamp(12px, 1.4vw, 20px);
  border-bottom: 2px solid var(--dark);
}
.logo {
  font-family: "Tinos", "Times New Roman", serif; font-weight: 700;
  font-size: clamp(30px, 3.1vw, 45px); line-height: 1; letter-spacing: .43em;
  margin-right: -.43em; color: var(--accent); text-decoration: none;
}
.site-nav { display: flex; gap: clamp(28px, 4.2vw, 60px); }
.site-nav a {
  font-family: var(--heading-font); font-size: var(--fs-h4); line-height: 1.4;
  color: var(--accent); text-decoration: none; padding-bottom: 2px;
  background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat;
  transition: background-size .25s ease;
}
.site-nav a:hover, .site-nav a.on { background-size: 100% 1px; }

/* ---------- sections + fluid engine ---------- */
.page-section { position: relative; display: flex; flex-direction: column; justify-content: center; }
.content-wrapper { width: 100%; padding: var(--pad, 3.3vw) 0; }
@media (max-width: 767px) { .content-wrapper { padding: calc(var(--pad, 3.3vw) * 2.22) 0; } }
.fluid-engine { display: grid; }
.fe-block { position: relative; min-width: 0; }
.fe-block > .sqs-block { height: 100%; display: flex; flex-direction: column; justify-content: flex-start; }
.sqs-block-content { width: 100%; }
.image-block .sqs-block-content, .video-block .sqs-block-content, .gallery-block .sqs-block-content { height: 100%; }
.sec-divider { position: absolute; left: 0; right: 0; bottom: -1px; z-index: 3; pointer-events: none; background-repeat: repeat-x; background-position: 0 100%; }
.site-footer .page-section { margin-top: 0; }

/* ---------- typography (Squarespace html block) ---------- */
h1, h2, h3, h4 {
  font-family: var(--heading-font); font-weight: 400; letter-spacing: .01em;
  margin: 2rem 0; color: var(--ink); white-space: pre-wrap;
}
h1 { font-size: var(--fs-h1); line-height: calc(1.4em * (1 + (1 - 3.5) / 25)); }
h2 { font-size: var(--fs-h2); line-height: calc(1.4em * (1 + (1 - 2.5) / 25)); }
h3 { font-size: var(--fs-h3); line-height: calc(1.4em * (1 + (1 - 1.7) / 25)); }
h4 { font-size: var(--fs-h4); line-height: calc(1.4em * (1 + (1 - 1.2) / 25)); }
p { margin: 1rem 0; line-height: 2.3em; white-space: pre-wrap; }
.sqsrte-small { font-size: var(--fs-small); }
.sqsrte-large { font-size: var(--fs-large); }
.sqs-html-content > :first-child { margin-top: 0; }
.sqs-html-content > :last-child { margin-bottom: 0; }
.sqs-html-content a { color: var(--accent); text-decoration: underline; text-underline-offset: .18em; text-decoration-thickness: 1px; }
.sqsrte-text-color--accent { color: var(--accent); }
.sqsrte-text-color--black { color: var(--ink); }
.sqsrte-text-color--white { color: var(--bg); }
.sqsrte-text-color--darkAccent { color: var(--dark); }
.sqsrte-text-color--lightAccent { color: var(--light); }
.sqs-block-html { background-color: var(--tweak-text-block-background-color, transparent); }
.sqs-block-html .sqs-html-content { padding: var(--tweak-text-block-padding, 0); }
.sqs-block-html.bg-off { background: none !important; }
.sqs-block-html.bg-off .sqs-html-content { padding: 0 !important; }
/* "-bold" colour themes: headings in accent blue (as in V4) */
.theme-white-bold :is(h1,h2,h3,h4) { color: var(--accent); }
.theme-light-bold hr, .theme-white-bold hr { background: var(--accent); }
/* hand-drawn underline highlight (home titles) */
.sqsrte-text-highlight {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 10' preserveAspectRatio='none'%3E%3Cpath d='M1 7.5 C 25 6.2, 50 4.4, 99 4.8' fill='none' stroke='%230128ff' stroke-width='2' stroke-linecap='round' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") 0 100% / 100% .32em no-repeat;
  padding-bottom: .22em;
}
.sqsrte-text-highlight a { text-decoration: none !important; }
hr { border: 0; height: 1px; background: var(--ink); margin: 0; width: 100%; }
.hr-block { justify-content: center !important; }

/* ---------- images ---------- */
.fluid-image-component-root, .fluid-image-animation-wrapper, .fluid-image-container { position: relative; width: 100%; height: 100%; }
.fluid-image-container img, .fluid-image-container .img-link { position: absolute; inset: 0; width: 100%; height: 100%; }
.fluid-image-container img {
  object-fit: var(--image-component-object-fit, cover);
  object-position: var(--image-component-focal-point, 50% 50%);
}
.img-link img { transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.img-link:hover img { transform: scale(1.03); }
.img-missing { width: 100%; height: 100%; background: hsla(var(--lightAccent-hsl), 1); }
.image-caption { font-size: var(--fs-small); margin-top: .5em; }

/* ---------- video ---------- */
.video-wrap { position: relative; width: 100%; height: 100%; min-height: 120px; background: #111; overflow: hidden; }
.video-wrap iframe, .video-wrap video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
.video-ph { position: absolute; inset: 0; display: grid; place-items: center; align-content: center; gap: 10px;
  background: repeating-linear-gradient(135deg, #1b1d18 0 14px, #20231c 14px 28px); color: #cfd2c4; }
.vp-play { width: 56px; height: 56px; border-radius: 50%; border: 2px solid currentColor; position: relative; }
.vp-play::after { content: ""; position: absolute; left: 22px; top: 17px; border-left: 16px solid currentColor; border-top: 10px solid transparent; border-bottom: 10px solid transparent; }
.vp-label { font-size: 12px; letter-spacing: .08em; line-height: 1.4; }
.video-caption { font-size: var(--fs-small); margin-top: .3em; }
.video-caption p { margin: 0; }

/* ---------- galleries ---------- */
.g-grid { display: grid; grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); gap: var(--gap); }
.g-cell { aspect-ratio: var(--ar); overflow: hidden; background: hsla(var(--lightAccent-hsl), .6); }
.g-cell a, .g-cell img { display: block; width: 100%; height: 100%; }
.g-cell img { object-fit: var(--fit, cover); transition: transform .5s ease; }
.g-cell a:hover img { transform: scale(1.03); }
@media (max-width: 767px) { .g-grid { grid-template-columns: repeat(min(var(--cols), 2), minmax(0, 1fr)); gap: min(var(--gap), 8px); } }

.g-show { display: flex; flex-direction: column; height: 100%; min-height: 280px; gap: 8px; }
.gs-main { position: relative; flex: 1 1 auto; min-height: 220px; overflow: hidden; }
.gs-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .45s ease; }
.gs-slide.on { opacity: 1; z-index: 1; }
.gs-slide img { width: 100%; height: 100%; object-fit: var(--fit, contain); }
.gs-nav { position: absolute; top: 50%; z-index: 2; transform: translateY(-50%); width: 42px; height: 42px; border-radius: 50%;
  border: 0; background: rgba(246,240,236,.85); color: var(--ink); font-size: 20px; cursor: pointer; }
.gs-nav.prev { left: 10px; } .gs-nav.next { right: 10px; }
.gs-thumbs { display: flex; gap: 6px; overflow-x: auto; flex: 0 0 auto; scrollbar-width: thin; padding-bottom: 2px; }
.gs-th { flex: 0 0 auto; width: 64px; height: 44px; padding: 0; border: 0; background: none; opacity: .5; cursor: pointer; }
.gs-th img { width: 100%; height: 100%; object-fit: cover; }
.gs-th.on, .gs-th:hover { opacity: 1; }

.g-slider { display: flex; gap: 12px; height: 100%; min-height: 220px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; }
.g-sl { flex: 0 0 auto; height: 100%; scroll-snap-align: start; }
.g-sl img { height: 100%; width: auto; max-width: none; }

/* ---------- marquee ---------- */
.marquee-block { justify-content: center !important; overflow: hidden; }
.marquee { display: block; overflow: hidden; text-decoration: none; padding: 1.5% 0; }
.mq-track { display: flex; width: max-content; animation: mq 40s linear infinite; }
.marquee:hover .mq-track { animation-play-state: paused; }
.mq-run { display: flex; }
.mq-run span { font-family: var(--heading-font); font-size: calc(var(--fs-h2) * 0.83); line-height: 1.4; color: var(--accent); padding: 0 .5em; white-space: nowrap; }
@keyframes mq { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .mq-track { animation: none; } }

/* ---------- lightbox ---------- */
.lightbox { position: fixed; inset: 0; z-index: 100; background: rgba(246,240,236,.97); display: grid; place-items: center; padding: 3vw; }
.lightbox[hidden] { display: none; }
.lightbox img { max-width: 100%; max-height: 92vh; object-fit: contain; }
.lb-close { position: absolute; top: 14px; right: 18px; font-size: 34px; line-height: 1; border: 0; background: none; color: var(--ink); cursor: pointer; }
