/** Shopify CDN: Minification failed

Line 6:2 Unexpected "="

**/
* ============================================================
   CREATINGS STUDIO — SHOPIFY THEME CSS
   Psyminimal · Applied Structural Intelligence
   ============================================================ */

/* ── Google Fonts ── */
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400&display=swap");

@font-face {
  font-family: "Futura";
  src: url("/cdn/shop/files/Futura-Medium.woff2?v=1781493917") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* ── Design Tokens ── */
:root {
  --ink: #0e0e13;
  --bone: #f0ece3;
  --ember: #c4602a;
  --ink-soft: #16161e;
  --ink-subtle: #1e1e26;
  --bone-muted: rgba(240, 236, 227, 0.55);
  --border: rgba(240, 236, 227, 0.1);
  --font-display: "Futura", "Century Gothic", "AppleGothic", "Gill Sans MT", sans-serif;
  --font-sans: "Century Gothic", "AppleGothic", "Gill Sans", "Gill Sans MT", Calibri, sans-serif;
  --font-mono: "JetBrains Mono", monospace;
}

/* ── Reset & Base ── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  background: var(--ink);
  scroll-behavior: smooth;
}

body {
  background: var(--ink);
  color: var(--bone);
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

::selection { background: var(--ember); color: var(--ink); }

a { color: inherit; text-decoration: none; }
img, video { display: block; max-width: 100%; }
button { cursor: pointer; background: none; border: none; color: inherit; font: inherit; }
input, textarea, select { font: inherit; color: inherit; }
ul, ol { list-style: none; }

h1, h2, h3, h4, h5 {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: -0.02em;
  line-height: 1.05;
}

/* ── Utility Classes ── */
.container-edge { padding-left: 1.5rem; padding-right: 1.5rem; }
@media (min-width: 768px) { .container-edge { padding-left: 2.5rem; padding-right: 2.5rem; } }
@media (min-width: 1024px) { .container-edge { padding-left: 3.5rem; padding-right: 3.5rem; } }

.hairline { border-top: 1px solid var(--border); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

.font-display { font-family: var(--font-display); font-weight: 500; letter-spacing: -0.02em; }
.font-mono-xs {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}

/* Grain texture overlay */
.grain::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9999;
  opacity: 0.05;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ── Announcement Bar ── */
.announcement-bar { position: relative; z-index: 60; }
.announcement-bar__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 0.6rem;
  padding-bottom: 0.6rem;
  gap: 1rem;
}
.announcement-bar__text {
  font-family: var(--font-mono);
  font-size: 0.68rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
a.announcement-bar__text:hover { opacity: 0.7; }
.announcement-bar__close {
  position: absolute;
  right: 1.5rem;
  opacity: 0.7;
  transition: opacity 0.2s;
  padding: 0.25rem;
}
.announcement-bar__close:hover { opacity: 1; }

/* ── Header ── */
.site-header {
  position: fixed;
  inset-inline: 0;
  top: 0;
  z-index: 50;
  background: transparent;
  transition: background 0.5s;
}
.site-header.is-scrolled {
  background: rgba(14, 14, 19, 0.75);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.site-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 4rem;
}
.site-header__logo { transition: opacity 0.2s; }
.site-header__logo:hover { opacity: 0.7; }
.site-header__logo-sub { color: var(--bone-muted); }
.site-header__logo-img { display: block; }
.site-header__nav {
  display: none;
  align-items: center;
  gap: 1.75rem;
}
@media (min-width: 1024px) { .site-header__nav { display: flex; } }
.site-header__nav-link {
  color: var(--bone-muted);
  transition: color 0.2s;
}
.site-header__nav-link:hover,
.site-header__nav-link.is-active { color: var(--bone); }
.site-header__actions { display: flex; align-items: center; gap: 1.25rem; }
.site-header__action-btn,
.site-header__cart { color: var(--bone-muted); transition: color 0.2s; }
.site-header__action-btn:hover,
.site-header__cart:hover { color: var(--bone); }
.site-header__cart-count { color: var(--ember); }
.site-header__mobile-toggle { display: block; }
@media (min-width: 1024px) { .site-header__mobile-toggle { display: none; } }

/* Offset body for fixed header */
main { padding-top: 4rem; }

/* ── Mobile Menu ── */
.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 70;
  background: var(--ink);
  transform: translateX(100%);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  display: flex;
  flex-direction: column;
}
.mobile-menu.is-open { transform: translateX(0); }
.mobile-menu__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 4rem;
  flex-shrink: 0;
}
.mobile-menu__nav {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  flex: 1;
}
.mobile-menu__link {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
  font-size: clamp(2.5rem, 10vw, 4rem);
  transition: color 0.2s;
}
.mobile-menu__link:hover { color: var(--ember); }
.mobile-menu__link-num { color: var(--bone-muted); }
.mobile-menu__footer { padding-top: 2rem; }

/* ── Hero Section ── */
.hero {
  position: relative;
  width: 100%;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.hero__media { position: absolute; inset: 0; }
.hero__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero__video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero__img-placeholder {
  width: 100%;
  height: 100%;
  background: var(--ink-soft);
}
.hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(14,14,19,0.4) 0%, rgba(14,14,19,0.15) 40%, rgba(14,14,19,1) 100%);
}
.hero__content {
  position: relative;
  z-index: 10;
  padding-bottom: 5rem;
}
.hero__eyebrow {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 2rem;
}
.hero__eyebrow-line {
  display: block;
  width: 3rem;
  height: 1px;
  background: rgba(240, 236, 227, 0.6);
}
.hero__eyebrow .font-mono-xs { color: var(--bone-muted); }
.hero__title {
  font-size: clamp(2.8rem, 9.5vw, 9.5rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
}
.hero__bottom {
  margin-top: 2.5rem;
  display: grid;
  gap: 2rem;
}
@media (min-width: 768px) {
  .hero__bottom { grid-template-columns: 1fr 1fr; align-items: end; }
}
.hero__desc { color: rgba(240, 236, 227, 0.8); max-width: 28rem; font-size: 1.05rem; }
.hero__ctas { display: flex; gap: 1rem; flex-wrap: wrap; }
@media (min-width: 768px) { .hero__ctas { justify-content: flex-end; } }
.hero__cta-primary {
  border: 1px solid rgba(240, 236, 227, 0.6);
  padding: 0.75rem 1.5rem;
  transition: background 0.2s, color 0.2s;
}
.hero__cta-primary:hover { background: var(--bone); color: var(--ink); }
.hero__cta-secondary { padding: 0.75rem 1.5rem; transition: color 0.2s; }
.hero__cta-secondary:hover { color: var(--ember); }
.hero__footer {
  position: relative;
  z-index: 10;
  display: flex;
  justify-content: space-between;
  padding-bottom: 1.5rem;
  color: var(--bone-muted);
}

/* ── Philosophy ── */
.philosophy { padding-top: 8rem; padding-bottom: 12rem; }
@media (min-width: 768px) { .philosophy { padding-top: 12rem; padding-bottom: 16rem; } }
.philosophy__label { color: var(--bone-muted); margin-bottom: 2.5rem; }
.philosophy__grid {
  display: grid;
  gap: 2.5rem;
  align-items: end;
}
@media (min-width: 768px) {
  .philosophy__grid {
    grid-template-columns: 8fr 4fr;
  }
}
.philosophy__statement {
  font-size: clamp(2rem, 5vw, 4.5rem);
  line-height: 1.02;
}
.philosophy__statement em { color: var(--bone-muted); }
.philosophy__statement strong { color: var(--ember); font-weight: 400; }
.philosophy__aside {
  font-size: 0.9rem;
  color: var(--bone-muted);
  line-height: 1.7;
  border-left: 1px solid var(--border);
  padding-left: 1rem;
}

/* ── Marquee ── */
.marquee-wrap { border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); overflow: hidden; }
.marquee {
  padding: 1rem 0;
  white-space: nowrap;
  overflow: hidden;
}
.marquee__track {
  display: inline-flex;
  gap: 2rem;
  animation: marquee-scroll var(--marquee-speed, 30s) linear infinite;
}
.marquee__item { color: var(--bone-muted); }
.marquee__sep { color: var(--ember); }
@keyframes marquee-scroll {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
.marquee:hover .marquee__track { animation-play-state: paused; }

/* ── Disciplines ── */
.disciplines { border-top: 1px solid var(--border); }
.disciplines__header {
  padding-top: 4rem;
  padding-bottom: 4rem;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.disciplines__label { color: var(--bone-muted); }
.disciplines__heading { font-size: clamp(1.8rem, 4vw, 3.5rem); }
.disciplines__grid {
  display: grid;
  grid-template-columns: 1fr;
  border-top: 1px solid var(--border);
}
@media (min-width: 768px) { .disciplines__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .disciplines__grid { grid-template-columns: 1fr 1fr 1fr; } }

.discipline-card {
  position: relative;
  padding: 2.5rem 3rem;
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
  min-height: 16rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  transition: background 0.2s;
}
.discipline-card:hover { background: var(--ink-soft); }
.discipline-card__num { color: var(--bone-muted); }
.discipline-card__title { font-size: clamp(1.8rem, 3vw, 2.8rem); margin-top: 0.5rem; margin-bottom: 0.5rem; }
.discipline-card__desc { font-size: 0.875rem; color: var(--bone-muted); max-width: 18rem; }
.discipline-card__arrow {
  position: absolute;
  top: 2.5rem;
  right: 2.5rem;
  opacity: 0;
  transition: opacity 0.2s;
  color: var(--ember);
}
.discipline-card:hover .discipline-card__arrow { opacity: 1; }

/* ── Selected Work ── */
.selected-work__header {
  padding-top: 8rem;
  padding-bottom: 3rem;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}
.selected-work__label { color: var(--bone-muted); margin-bottom: 1rem; }
.selected-work__heading { font-size: clamp(2.5rem, 6vw, 6rem); }
.selected-work__archive-link { display: none; }
@media (min-width: 768px) { .selected-work__archive-link { display: inline; color: var(--bone-muted); transition: color 0.2s; } }
.selected-work__archive-link:hover { color: var(--ember); }

.work-item__img-wrap {
  position: relative;
  overflow: hidden;
}
.work-item__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.8s ease;
}
.work-item__img-wrap:hover .work-item__img { transform: scale(1.02); }
.work-item__caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.5rem;
  display: flex;
  justify-content: space-between;
  background: linear-gradient(to top, rgba(14,14,19,0.8), transparent);
  color: var(--bone-muted);
}
.work-item__desc {
  display: grid;
  padding-top: 5rem;
  padding-bottom: 5rem;
  gap: 2rem;
}
@media (min-width: 768px) {
  .work-item__desc { grid-template-columns: 4fr 8fr; }
}
.work-item__desc-label { color: var(--bone-muted); }
.work-item__desc-text { font-size: clamp(1.5rem, 3vw, 2.8rem); line-height: 1.2; max-width: 40rem; }

/* ── Scroll reveal image ── */
.js-scroll-img-wrap { overflow: hidden; position: relative; }
.js-scroll-img { will-change: transform; }

/* ── Experiments ── */
.experiments { border-top: 1px solid var(--border); }
.experiments__header {
  display: grid;
  gap: 2rem;
  padding-top: 5rem;
  padding-bottom: 5rem;
}
@media (min-width: 768px) {
  .experiments__header { grid-template-columns: 7fr 5fr; align-items: end; }
}
.experiments__label { color: var(--bone-muted); margin-bottom: 1rem; }
.experiments__heading { font-size: clamp(2.5rem, 6vw, 6rem); }
.experiments__desc { color: var(--bone-muted); max-width: 26rem; }
.experiments__grid {
  display: grid;
  gap: 1px;
  background: var(--border);
}
@media (min-width: 768px) { .experiments__grid { grid-template-columns: 1fr 1fr; } }
.experiment-item { background: var(--ink); position: relative; }
.experiment-item__img-wrap { aspect-ratio: 3/4; overflow: hidden; }
.experiment-item__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 1.6s ease;
}
.experiment-item:hover .experiment-item__img { transform: scale(1.05); }
.experiment-item__caption {
  padding: 1.5rem;
  display: flex;
  justify-content: space-between;
}
.experiments__footer { padding-top: 2.5rem; padding-bottom: 2.5rem; display: flex; justify-content: flex-end; }
.experiments__footer a { color: var(--bone-muted); transition: color 0.2s; }
.experiments__footer a:hover { color: var(--ember); }

/* ── Frameworks ── */
.frameworks { border-top: 1px solid var(--border); background: rgba(22, 22, 30, 0.4); }
.frameworks__inner {
  display: grid;
  gap: 2.5rem;
  padding-top: 6rem;
  padding-bottom: 6rem;
}
@media (min-width: 768px) { .frameworks__inner { grid-template-columns: 5fr 7fr; } }
.frameworks__label { color: var(--bone-muted); margin-bottom: 1rem; }
.frameworks__heading { font-size: clamp(2.5rem, 5vw, 5rem); line-height: 1.05; }
.frameworks__subheading { font-size: clamp(2.5rem, 5vw, 5rem); color: var(--bone-muted); line-height: 1.05; display: block; }
.frameworks__desc { margin-top: 2rem; font-size: 0.9rem; color: var(--bone-muted); max-width: 22rem; }
.frameworks__form {
  display: flex;
  border: 1px solid var(--border);
  max-width: 22rem;
  margin-top: 2.5rem;
}
.frameworks__email-input {
  flex: 1;
  background: transparent;
  border: none;
  padding: 0.75rem 1rem;
  font-size: 0.9rem;
  outline: none;
}
.frameworks__email-input::placeholder { color: var(--bone-muted); }
.frameworks__email-btn {
  padding: 0 1.25rem;
  background: var(--bone);
  color: var(--ink);
  transition: background 0.2s;
  flex-shrink: 0;
}
.frameworks__email-btn:hover { background: var(--ember); }
.frameworks__form-success { color: var(--ember); margin-top: 1.5rem; }
.frameworks__list { border-left: 1px solid var(--border); padding-left: 2.5rem; }
.frameworks__item {
  display: flex;
  align-items: baseline;
  gap: 1rem;
  padding: 1.75rem 0;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
}
.frameworks__item:last-child { border-bottom: none; }
.frameworks__item-num { color: var(--bone-muted); width: 2.5rem; flex-shrink: 0; }
.frameworks__item-title { flex: 1; font-size: clamp(1.5rem, 3vw, 2.5rem); transition: color 0.2s; }
.frameworks__item:hover .frameworks__item-title { color: var(--ember); }
.frameworks__item-status { color: var(--bone-muted); flex-shrink: 0; }

/* ── CTA Section ── */
.cta-section {
  padding-top: 8rem;
  padding-bottom: 12rem;
  text-align: center;
}
@media (min-width: 768px) { .cta-section { padding-top: 12rem; padding-bottom: 16rem; } }
.cta-section__label { color: var(--bone-muted); margin-bottom: 2rem; }
.cta-section__heading {
  font-size: clamp(3rem, 10vw, 9rem);
  line-height: 1.05;
}
.cta-section__heading em { color: inherit; }
.cta-section__btn {
  display: inline-block;
  margin-top: 3rem;
  border: 1px solid var(--bone);
  padding: 1rem 2rem;
  transition: background 0.2s, color 0.2s;
}
.cta-section__btn:hover { background: var(--bone); color: var(--ink); }

/* ── Footer ── */
.site-footer { border-top: 1px solid var(--border); margin-top: 8rem; }
.site-footer__body {
  padding-top: 4rem;
  padding-bottom: 4rem;
  display: grid;
  gap: 3rem;
}
@media (min-width: 768px) { .site-footer__body { grid-template-columns: 6fr 3fr 3fr; } }
.site-footer__headline {
  font-size: clamp(2rem, 4vw, 4rem);
  line-height: 1.05;
  max-width: 32rem;
}
.site-footer__headline em { font-style: italic; }
.site-footer__cta-btn {
  display: inline-block;
  margin-top: 2rem;
  border: 1px solid var(--border);
  padding: 0.75rem 1.25rem;
  transition: background 0.2s, color 0.2s;
}
.site-footer__cta-btn:hover { background: var(--bone); color: var(--ink); }
.site-footer__col-heading { color: var(--bone-muted); margin-bottom: 1rem; }
.site-footer__links { display: flex; flex-direction: column; gap: 0.5rem; font-size: 0.9rem; }
.site-footer__links a { transition: color 0.2s; }
.site-footer__links a:hover { color: var(--ember); }
.site-footer__bottom-inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.75rem;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  color: var(--bone-muted);
}

/* ── Cart Drawer ── */
.cart-overlay {
  position: fixed;
  inset: 0;
  z-index: 79;
  background: rgba(14, 14, 19, 0.6);
  backdrop-filter: blur(4px);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s;
}
.cart-overlay.is-visible { opacity: 1; pointer-events: all; }
.cart-drawer {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  width: min(440px, 100vw);
  background: var(--ink-soft);
  border-left: 1px solid var(--border);
  z-index: 80;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}
.cart-drawer.is-open { transform: translateX(0); }
.cart-drawer__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5rem;
  border-bottom: 1px solid var(--border);
}
.cart-drawer__close { transition: color 0.2s; }
.cart-drawer__close:hover { color: var(--ember); }
.cart-drawer__body { flex: 1; overflow-y: auto; padding: 1.5rem; }
.cart-drawer__empty { color: var(--bone-muted); }
.cart-drawer__footer {
  padding: 1.5rem;
  border-top: 1px solid var(--border);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.cart-drawer__subtotal { display: flex; justify-content: space-between; }
.cart-drawer__checkout {
  display: block;
  text-align: center;
  padding: 0.875rem;
  border: 1px solid var(--border);
  transition: background 0.2s, color 0.2s;
}
.cart-drawer__checkout:hover { background: var(--bone); color: var(--ink); }
.cart-drawer__checkout-primary {
  display: block;
  text-align: center;
  padding: 0.875rem;
  background: var(--bone);
  color: var(--ink);
  transition: background 0.2s;
}
.cart-drawer__checkout-primary:hover { background: var(--ember); }

.cart-item { display: grid; grid-template-columns: 80px 1fr auto; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--border); }
.cart-item:last-child { border-bottom: none; }
.cart-item__img img { width: 80px; height: 100px; object-fit: cover; }
.cart-item__title { font-size: 0.9rem; margin-bottom: 0.25rem; }
.cart-item__variant { color: var(--bone-muted); margin-bottom: 0.5rem; }
.cart-item__qty { display: flex; align-items: center; gap: 0.75rem; margin-top: 0.5rem; }
.cart-item__qty-btn { width: 1.5rem; height: 1.5rem; border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; transition: background 0.2s; }
.cart-item__qty-btn:hover { background: var(--bone); color: var(--ink); }
.cart-item__price { color: var(--bone-muted); white-space: nowrap; }

/* ── Page Header ── */
.page-header { padding-top: 6rem; padding-bottom: 4rem; }
.page-header__eyebrow { color: var(--bone-muted); margin-bottom: 1.5rem; }
.page-header__title { font-size: clamp(2.6rem, 8vw, 7rem); line-height: 1.05; letter-spacing: -0.025em; }
.page-header__title em { font-style: italic; }
.page-header__desc { margin-top: 2rem; max-width: 28rem; color: var(--bone-muted); }

/* ── Contact Page ── */
.contact-section {
  display: grid;
  gap: 2.5rem;
  padding-bottom: 8rem;
  border-top: 1px solid var(--border);
  padding-top: 4rem;
}
@media (min-width: 768px) { .contact-section { grid-template-columns: 4fr 8fr; } }
.contact-section__info { margin-bottom: 2rem; }
.contact-section__info-label { color: var(--bone-muted); margin-bottom: 0.35rem; }
.contact-section__info a:hover { color: var(--ember); }
.contact-section__success { border: 1px solid var(--border); padding: 2.5rem 4rem; }
.contact-section__success h2 { font-size: clamp(2rem, 4vw, 4rem); line-height: 1.05; margin-top: 1.5rem; }
.contact-section__errors { color: #c0392b; margin-bottom: 1.5rem; }
.contact-section__form { display: flex; flex-direction: column; gap: 2.5rem; }
.contact-field__label { color: var(--bone-muted); margin-bottom: 0.75rem; }
.contact-field__pills { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.contact-pill {
  border: 1px solid var(--border);
  padding: 0.5rem 1rem;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.contact-pill:hover { background: var(--bone); color: var(--ink); }
.contact-pill:has(input:checked) { background: var(--bone); color: var(--ink); }
.contact-input {
  width: 100%;
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--border);
  padding: 0.875rem 0;
  font-size: 1rem;
  outline: none;
  transition: border-color 0.2s;
}
.contact-input:focus { border-color: var(--bone); }
.contact-input::placeholder { color: var(--bone-muted); }
.contact-textarea { resize: none; }
.contact-submit {
  align-self: flex-start;
  border: 1px solid var(--bone);
  padding: 1rem 2rem;
  transition: background 0.2s, color 0.2s;
}
.contact-submit:hover { background: var(--bone); color: var(--ink); }

/* ── Services Page ── */
.services-grid {
  display: grid;
  border-top: 1px solid var(--border);
}
@media (min-width: 768px) { .services-grid { grid-template-columns: 1fr 1fr 1fr; } }
.service-tier {
  padding: 2.5rem 3rem;
  border-bottom: 1px solid var(--border);
  border-right: 1px solid var(--border);
}
@media (min-width: 768px) { .service-tier { border-bottom: none; } }
.service-tier--highlighted { background: var(--ink-soft); }
.service-tier__top { display: flex; justify-content: space-between; align-items: flex-start; }
.service-tier__numeral { font-size: 5rem; line-height: 1; }
@media (min-width: 768px) { .service-tier__numeral { font-size: 7rem; } }
.service-tier__tag { color: var(--ember); }
.service-tier__name { font-size: clamp(1.8rem, 3vw, 2.8rem); margin-top: 1.5rem; }
.service-tier__audience { color: var(--bone-muted); margin-top: 0.75rem; }
.service-tier__summary { font-size: 0.9rem; margin-top: 1.5rem; line-height: 1.65; color: rgba(240, 236, 227, 0.8); }
.service-tier__list { margin-top: 2rem; border-top: 1px solid var(--border); padding-top: 1.5rem; display: flex; flex-direction: column; gap: 0.75rem; }
.service-tier__list-item { display: flex; gap: 0.75rem; font-size: 0.9rem; }
.service-tier__list-item span:first-child { color: var(--bone-muted); }
.service-tier__cta {
  display: inline-block;
  margin-top: 2.5rem;
  border: 1px solid var(--border);
  padding: 0.75rem 1.25rem;
  transition: background 0.2s, color 0.2s;
}
.service-tier__cta:hover { background: var(--bone); color: var(--ink); }
.streams-section { padding-top: 8rem; padding-bottom: 8rem; }
.streams-section__heading { font-size: clamp(2rem, 4vw, 4rem); max-width: 40rem; }
.streams-grid { display: grid; gap: 2.5rem; margin-top: 3rem; }
@media (min-width: 768px) { .streams-grid { grid-template-columns: 1fr 1fr; } }
.stream { border-top: 1px solid var(--border); padding-top: 1.5rem; }
.stream__label { color: var(--bone-muted); }
.stream__title { font-size: clamp(1.5rem, 2.5vw, 2rem); margin-top: 0.5rem; }
.stream__desc { font-size: 0.9rem; color: var(--bone-muted); margin-top: 0.75rem; }

/* ── Studio Page ── */
.studio-section {
  display: grid;
  gap: 2.5rem;
  padding-top: 5rem;
  padding-bottom: 5rem;
}
@media (min-width: 768px) { .studio-section { grid-template-columns: 4fr 8fr; } }
.studio-section--border { border-top: 1px solid var(--border); }
.studio-section__content--large { font-size: clamp(1.8rem, 3.5vw, 3.5rem); line-height: 1.08; }
.studio-section__content--large em { font-style: italic; }
.studio-section__ethos { display: flex; flex-direction: column; gap: 1.5rem; font-size: 1.1rem; color: rgba(240, 236, 227, 0.85); }
.studio-process-grid { display: grid; gap: 1.5rem; }
@media (min-width: 768px) { .studio-process-grid { grid-template-columns: 1fr 1fr; } }
.studio-process-step { border-top: 1px solid var(--border); padding-top: 1.25rem; }
.studio-process-step__num { color: var(--bone-muted); }
.studio-process-step__title { font-size: clamp(1.5rem, 2.5vw, 2.2rem); margin-top: 0.5rem; }
.studio-process-step__desc { font-size: 0.875rem; color: var(--bone-muted); margin-top: 0.5rem; }
.scroll-img-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.5rem;
  display: flex;
  justify-content: space-between;
  color: var(--bone-muted);
}

/* ── Work Archive ── */
.work-filter-bar { margin-top: 2rem; }
.work-filter { display: flex; flex-wrap: wrap; gap: 1.5rem; padding-top: 1.5rem; padding-bottom: 1.5rem; }
.work-filter__btn { color: var(--bone-muted); transition: color 0.2s; }
.work-filter__btn:hover, .work-filter__btn.is-active { color: var(--bone); }
.work-list { padding-bottom: 8rem; }
.work-list__items { border-top: 1px solid var(--border); }
.work-list__item {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  gap: 0.35rem 1rem;
  align-items: center;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--border);
  cursor: pointer;
  transition: background 0.2s;
}
.work-list__item:hover { background: rgba(22, 22, 30, 0.4); }
.work-list__num {
  color: var(--bone-muted);
  grid-row: 1;
  grid-column: 1;
  align-self: start;
  padding-top: 0.3em;
}
.work-list__title {
  font-size: clamp(1.5rem, 3vw, 3rem);
  transition: color 0.2s;
  grid-row: 1;
  grid-column: 2;
}
.work-list__item:hover .work-list__title { color: var(--ember); }
.work-list__cat {
  color: var(--bone-muted);
  grid-row: 2;
  grid-column: 2;
  display: block;
}
.work-list__year {
  color: var(--bone-muted);
  display: none;
}
@media (min-width: 768px) {
  .work-list__item {
    grid-template-columns: auto 1fr auto auto;
    grid-template-rows: auto;
    gap: 1rem;
    align-items: center;
    padding: 2rem 0;
  }
  .work-list__num { grid-row: auto; grid-column: auto; align-self: auto; padding-top: 0; }
  .work-list__title { grid-row: auto; grid-column: auto; }
  .work-list__cat { grid-row: auto; grid-column: auto; }
  .work-list__year { display: block; }
}
.work-hero-img { position: relative; overflow: hidden; }
.work-hero-img img { width: 100%; height: 100%; object-fit: cover; }
.work-hero-img__caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1.5rem;
  display: flex;
  justify-content: space-between;
  color: var(--bone-muted);
}

/* ── Product Page ── */
.product-page {
  display: grid;
  gap: 3rem;
  padding-bottom: 8rem;
}
@media (min-width: 768px) { .product-page { grid-template-columns: 1fr 1fr; } }
.product-page__main-img img { width: 100%; max-height: 80vh; object-fit: contain; }
.product-page__thumbnails { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-top: 0.75rem; }
.product-page__thumb { padding: 0; border: 1px solid transparent; transition: border-color 0.2s; }
.product-page__thumb:hover { border-color: var(--bone); }
.product-page__thumb img { width: 70px; height: 90px; object-fit: cover; }
.product-page__vendor { color: var(--bone-muted); margin-bottom: 0.5rem; }
.product-page__title { font-size: clamp(2rem, 4vw, 4rem); line-height: 1; margin-bottom: 1rem; }
.product-page__price { color: var(--ember); margin-bottom: 2rem; font-size: 1.1rem; }
.product-option { margin-bottom: 1.5rem; }
.product-option__label { color: var(--bone-muted); margin-bottom: 0.5rem; }
.product-option__values { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.product-option__btn {
  border: 1px solid var(--border);
  padding: 0.5rem 1rem;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}
.product-option__btn:has(input:checked) { background: var(--bone); color: var(--ink); }
.product-option__btn:hover { border-color: var(--bone); }
.product-page__add-btn {
  display: block;
  width: 100%;
  padding: 1rem 1.5rem;
  background: var(--bone);
  color: var(--ink);
  text-align: center;
  margin-top: 1.5rem;
  transition: background 0.2s;
}
.product-page__add-btn:hover { background: var(--ember); }
.product-page__add-btn--unavailable { opacity: 0.4; cursor: not-allowed; }
.product-page__desc { margin-top: 2rem; font-size: 0.95rem; line-height: 1.7; color: rgba(240, 236, 227, 0.85); border-top: 1px solid var(--border); padding-top: 2rem; }
.product-page__desc a { text-decoration: underline; }
.product-page__share { display: flex; gap: 1rem; margin-top: 2rem; color: var(--bone-muted); border-top: 1px solid var(--border); padding-top: 1.5rem; }
.product-page__share a:hover { color: var(--ember); }

/* ── Collection Page ── */
.collection-page__toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 1rem;
  padding-bottom: 2rem;
}
.collection-page__sort { display: flex; align-items: center; gap: 0.75rem; }
.collection-page__sort-select {
  background: transparent;
  border: 1px solid var(--border);
  padding: 0.4rem 0.75rem;
  outline: none;
  cursor: pointer;
}
.collection-grid {
  display: grid;
  gap: 2rem;
  padding-bottom: 6rem;
}
@media (min-width: 640px) { .collection-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .collection-grid { grid-template-columns: 1fr 1fr 1fr; } }
.collection-page__empty { color: var(--bone-muted); padding: 4rem 0; }
.product-card { }
.product-card__img-wrap { position: relative; overflow: hidden; aspect-ratio: 3/4; margin-bottom: 1rem; background: var(--ink-soft); }
.product-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.product-card:hover .product-card__img { transform: scale(1.04); }
.product-card__badge {
  position: absolute;
  top: 1rem;
  left: 1rem;
  background: var(--ink);
  padding: 0.3rem 0.6rem;
  color: var(--bone-muted);
}
.product-card__img-placeholder { width: 100%; height: 100%; background: var(--ink-soft); }
.product-card__vendor { color: var(--bone-muted); margin-bottom: 0.25rem; }
.product-card__title { font-family: var(--font-display); font-size: 1.4rem; margin-bottom: 0.5rem; }
.product-card__price { color: var(--bone-muted); }

/* ── Journal / Blog ── */
.journal-grid {
  display: grid;
  gap: 4rem;
  padding-bottom: 6rem;
}
@media (min-width: 768px) { .journal-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1024px) { .journal-grid { grid-template-columns: 1fr 1fr 1fr; } }
.journal-card__img-wrap { display: block; aspect-ratio: 4/3; overflow: hidden; margin-bottom: 1.25rem; }
.journal-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.6s ease; }
.journal-card:hover .journal-card__img { transform: scale(1.04); }
.journal-card__meta { color: var(--bone-muted); display: flex; gap: 0.5rem; margin-bottom: 0.5rem; }
.journal-card__title { font-size: clamp(1.5rem, 2.5vw, 2rem); line-height: 1.1; }
.journal-card__title a:hover { color: var(--ember); }
.journal-card__excerpt { font-size: 0.9rem; color: var(--bone-muted); margin-top: 0.75rem; line-height: 1.6; }
.journal-card__link { display: inline-block; margin-top: 1rem; color: var(--bone-muted); transition: color 0.2s; }
.journal-card__link:hover { color: var(--ember); }

/* ── Article Page ── */
.article-page { padding-bottom: 8rem; }
.article-page__header { padding-top: 2rem; padding-bottom: 3rem; }
.article-page__meta { display: flex; gap: 1rem; flex-wrap: wrap; color: var(--bone-muted); margin-bottom: 1.5rem; }
.article-page__back { transition: color 0.2s; }
.article-page__back:hover { color: var(--ember); }
.article-page__title { font-size: clamp(2.5rem, 6vw, 6rem); line-height: 1.05; }
.article-page__author { color: var(--bone-muted); margin-top: 1rem; }
.article-page__hero-img { margin-bottom: 3rem; }
.article-page__hero-img img { width: 100%; max-height: 70vh; object-fit: cover; }
.article-page__body {
  max-width: 48rem;
  margin: 0 auto;
  font-size: 1.05rem;
  line-height: 1.75;
  color: rgba(240, 236, 227, 0.9);
}
.article-page__body h2, .article-page__body h3 { margin-top: 2.5rem; margin-bottom: 1rem; }
.article-page__body p { margin-bottom: 1.5rem; }
.article-page__body a { text-decoration: underline; }
.article-page__body a:hover { color: var(--ember); }
.article-page__body img { margin: 2rem 0; }
.article-page__share {
  display: flex;
  gap: 1rem;
  margin-top: 4rem;
  color: var(--bone-muted);
  border-top: 1px solid var(--border);
  padding-top: 2rem;
}
.article-page__share a:hover { color: var(--ember); }
.article-page__nav {
  display: flex;
  justify-content: space-between;
  margin-top: 3rem;
  border-top: 1px solid var(--border);
  padding-top: 2rem;
}
.article-page__nav-link { color: var(--bone-muted); transition: color 0.2s; }
.article-page__nav-link:hover { color: var(--bone); }

/* ── Cart Page ── */
.cart-page { padding-bottom: 8rem; }
.cart-page__items { display: flex; flex-direction: column; gap: 2rem; margin-bottom: 3rem; }
.cart-page__item { display: grid; grid-template-columns: 120px 1fr auto; gap: 1.5rem; padding-bottom: 2rem; border-bottom: 1px solid var(--border); }
.cart-page__item-img img { width: 120px; height: 150px; object-fit: cover; }
.cart-page__item-title { font-family: var(--font-display); font-size: 1.4rem; margin-bottom: 0.5rem; }
.cart-page__item-variant { color: var(--bone-muted); }
.cart-page__item-price { color: var(--bone-muted); margin-top: 0.5rem; }
.cart-page__qty-input {
  width: 4rem;
  background: transparent;
  border: 1px solid var(--border);
  padding: 0.4rem 0.5rem;
  text-align: center;
  outline: none;
  margin-top: 0.75rem;
}
.cart-page__item-remove { display: inline-block; margin-top: 0.75rem; color: var(--bone-muted); transition: color 0.2s; }
.cart-page__item-remove:hover { color: var(--ember); }
.cart-page__footer { max-width: 24rem; margin-left: auto; }
.cart-page__subtotal { display: flex; justify-content: space-between; margin-bottom: 0.5rem; }
.cart-page__tax-note { color: var(--bone-muted); margin-bottom: 1.5rem; }
.cart-page__checkout-btn {
  display: block;
  width: 100%;
  background: var(--bone);
  color: var(--ink);
  padding: 1rem;
  text-align: center;
  transition: background 0.2s;
  margin-bottom: 0.75rem;
}
.cart-page__checkout-btn:hover { background: var(--ember); }
.cart-page__update-btn {
  display: block;
  width: 100%;
  border: 1px solid var(--border);
  padding: 0.875rem;
  text-align: center;
  transition: background 0.2s, color 0.2s;
}
.cart-page__update-btn:hover { background: var(--bone); color: var(--ink); }
.cart-page__empty { padding: 4rem 0; }
.cart-page__continue { display: inline-block; margin-top: 1rem; color: var(--bone-muted); transition: color 0.2s; }
.cart-page__continue:hover { color: var(--ember); }

/* ── Account Pages ── */
.account-page { padding-bottom: 8rem; }
.account-page__grid { display: grid; gap: 3rem; margin-top: 2rem; }
@media (min-width: 768px) { .account-page__grid { grid-template-columns: 1fr 1fr; } }
.account-page__section-title { font-size: clamp(1.8rem, 3vw, 2.5rem); margin-bottom: 1.5rem; }
.account-orders { display: flex; flex-direction: column; gap: 1rem; }
.account-order { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr; gap: 1rem; border-bottom: 1px solid var(--border); padding-bottom: 0.75rem; }
.account-order a { color: var(--ember); }
.account-page__alt-link { display: block; color: var(--bone-muted); margin-top: 1rem; transition: color 0.2s; }
.account-page__alt-link:hover { color: var(--bone); }
.form-error { color: #c0392b; margin-bottom: 1.5rem; padding: 1rem; border: 1px solid rgba(192, 57, 43, 0.3); }

/* ── Pagination ── */
.pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2rem;
  padding: 3rem 0;
  color: var(--bone-muted);
}
.pagination__link { transition: color 0.2s; }
.pagination__link:hover { color: var(--bone); }

/* ── Main Page (generic) ── */
.main-page { padding-bottom: 8rem; }
.main-page__content { max-width: 48rem; font-size: 1rem; line-height: 1.75; color: rgba(240, 236, 227, 0.85); }
.main-page__content h2 { font-size: 2rem; margin-top: 3rem; margin-bottom: 1rem; }
.main-page__content p { margin-bottom: 1.5rem; }
.main-page__content a { text-decoration: underline; }
.main-page__content a:hover { color: var(--ember); }

/* ── Scroll Reveal Animation ── */
.fade-up {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.fade-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}