/* Functional catalog/detail surfaces added to the approved graphite design. */
.support-banner { border-bottom:1px solid #c7a66a45; background:linear-gradient(110deg,#171420,#2c2135 70%,#302638); color:#ddc9ab; }
.support-banner-inner { min-height:54px; display:flex; align-items:center; justify-content:space-between; gap:14px 24px; padding-block:7px; }
.support-banner p { margin:0; font-size:12px; line-height:1.7; letter-spacing:.015em; }
.support-banner a { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:44px; max-width:100%; padding:10px 16px; border:1px solid #e6c68f; border-radius:3px 9px; background:linear-gradient(115deg,#d9b77d,#ebc98f); color:#261c17; font-size:12px; font-weight:600; line-height:1.5; text-decoration:none; box-shadow:inset 0 0 0 2px #3e272312; }
.support-banner a:hover { background:#f0d4a1; }
.support-banner a:focus-visible { outline:3px solid #f1d7ae; outline-offset:4px; }
.support-spark { font-size:15px; line-height:1; }
.catalog-order-note { display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:8px 24px; color:#bcb0c8; padding-bottom:20px; margin:0 0 28px; border-bottom:1px solid #c7a66a32; font-size:12px; line-height:1.8; }
.catalog-order-note > span:first-child { color:#e0c18b; font-weight:600; letter-spacing:.025em; }
.catalog-order-note a { color:#d9c1e8; text-underline-offset:4px; }
.site-footer { flex-wrap:wrap; }
.site-footer .footer-interest-note { flex-basis:100%; max-width:none; text-align:left; margin:0; color:#b9abc5; font-size:12px; line-height:1.8; }
.footer-interest-note a { display:inline-flex; align-items:center; min-height:44px; color:#ddbc88; margin-left:8px; text-underline-offset:4px; }
.privacy-page { max-width:900px; padding-block:38px 85px; }
.privacy-page > .text-link { display:inline-flex; align-items:center; min-height:44px; margin-bottom:30px; }
.privacy-page > .eyebrow { color:#c3a371; }
.privacy-page h1 { font:400 clamp(39px,5vw,62px)/1.15 var(--serif); color:#f3eadb; letter-spacing:-1.5px; margin:0 0 25px; }
.privacy-page .privacy-intro { color:#d2c2db; font-size:17px; line-height:1.85; max-width:660px; margin:0 0 38px; }
.privacy-page section { border-top:1px solid #c7a66a32; padding-top:25px; margin-top:29px; }
.privacy-page h2 { font:400 clamp(25px,3vw,31px)/1.3 var(--serif); color:#e8d8bf; margin:0 0 19px; letter-spacing:-.4px; }
.privacy-page section p { color:#c1b6ca; font-size:15px; line-height:1.9; margin:0 0 17px; }
.privacy-page code { font-size:.9em; color:#e4cba5; overflow-wrap:anywhere; }
@media (max-width:560px) {
  .support-banner-inner { justify-content:center; padding-block:6px; }
  .support-banner p { display:none; }
  .support-banner a { min-height:44px; padding-inline:15px; }
  .catalog-order-note { margin-bottom:23px; padding-bottom:17px; gap:4px; }
  .catalog-order-note > span { flex-basis:100%; }
  .site-footer .footer-interest-note { font-size:11px; }
  .footer-interest-note a { margin-left:0; }
  .privacy-page { padding-block:28px 60px; }
  .privacy-page h1 { font-size:40px; }
  .privacy-page .privacy-intro { font-size:15px; }
  .privacy-page section p { font-size:14px; }
}
select, textarea { font: inherit; }
.skip-link { opacity: 0; }
.skip-link:focus { opacity: 1; }
select:focus-visible, summary:focus-visible { outline: 3px solid var(--amber); outline-offset: 5px; }
.catalog-toolbar { margin: 0 0 30px; }
.catalog-form { display: flex; align-items: flex-end; flex-wrap: wrap; gap: 14px; margin-bottom: 30px; }
.catalog-search, .catalog-category { display: grid; gap: 9px; min-width: 0; }
.catalog-form label { color: #c9c5bd; font-size: 12px; }
.catalog-form input, .catalog-form select {
  color: var(--ink); background: #1c1f24; border: 1px solid #777b80;
  border-radius: 5px; min-height: 46px; padding: 11px 13px;
  max-width: 100%; font-size: 14px;
}
.catalog-form input { width: min(340px, 100%); }
.catalog-form select { min-width: 205px; padding-right: 32px; }
.catalog-form input::placeholder { color: #aaa8a4; }
.catalog-form .button { min-height: 46px; }
.catalog-reset { font-size: 12px; color: #d3c5b1; padding: 14px 2px; }
.catalog-results { color: var(--muted); font-size: 12px; line-height: 1.7; margin: 18px 0 0; }
.catalog-pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 16px; padding-top: 34px; }
.catalog-pagination p { width: 100%; margin: 0; text-align: center; color: var(--muted); font-size: 12px; line-height: 1.7; }
.catalog-pagination .page-link { min-height: 44px; display: inline-flex; align-items: center; padding: 10px 15px; color: #ead1b0; font-size: 13px; }
.catalog-pagination [aria-busy="true"] { cursor: progress; }
.catalog-pagination:empty { display: none; }
.footer-owner { display:inline-flex; align-items:center; min-height:44px; color:#b9abc5; font-size:11px; text-decoration:none; }
.footer-owner:hover { color:var(--amber); }
.catalog-empty { grid-column: 1 / -1; padding: 58px 28px; border: 1px dashed #6a6c70; border-radius: 10px; text-align: center; }
.catalog-empty h3 { color: var(--ink); font: 32px/1.2 var(--serif); font-weight: 400; margin: 0 0 16px; }
.catalog-empty p { max-width: 480px; margin: 0 auto 20px; color: var(--muted); font-size: 14px; line-height: 1.8; }
.catalog-notice { border: 1px solid #7b674e; background: #dfb8840b; color: #d8c4a8; padding: 15px 18px; border-radius: 6px; font-size: 13px; line-height: 1.8; margin-bottom: 25px; }
.product-title-link { text-decoration: none; }
.product-title-link:hover { color: var(--amber); }
.product-title-link:focus-visible { border-radius: 3px; }
.product-card .product-bottom { flex-wrap: wrap; }
.product-card .details-link { width: auto; color: #d8d3c9; font-size: 12px; min-height: 44px; display: inline-flex; align-items: center; gap: 12px; }
.product-card .details-link:hover { color: var(--amber); }
.product-card .card-title .product-name-link { display: inline; width: auto; min-height: 0; font: inherit; color: inherit; letter-spacing: inherit; text-decoration: none; }
.product-card .card-title .product-name-link:hover { color: var(--amber); }
.product-card .product-bottom .product-link { flex: 1 1 auto; width: auto; }
.thumbnail-group { min-width: 0; max-width: 100%; overflow-x: auto; padding: 4px 3px; scrollbar-width: thin; }
.gallery-thumb { flex-shrink: 0; }
.product-media-empty { padding: 42px 24px; background: #15191d; text-align: center; min-height: 230px; display: grid; place-items: center; gap: 15px; }
.product-media-empty img { width: 180px; margin-inline: auto; }
.product-media-empty p { margin: 0; font-size: 12px; color: var(--muted); line-height: 1.7; }
.media-fallback { object-fit: contain; }
.stage-tag { color: #c9c4ba; font-size: 10px; border: 1px solid #666866; border-radius: 4px; padding: 5px 8px; }
.product-meta { display: flex; flex-wrap: wrap; gap: 9px; align-items: center; }
.detail-page { padding-block: 34px 72px; }
.detail-back { display: inline-flex; gap: 12px; align-items: center; color: #d4c3a9; font-size: 13px; min-height: 44px; margin-bottom: 32px; }
.detail-page > [data-back-to-catalog] { min-height: 44px; margin-bottom: 30px; }
.detail-header { max-width: 830px; padding-bottom: 36px; }
.detail-header h1 { font-size: clamp(38px, 5vw, 68px); line-height: 1.1; letter-spacing: -2px; margin-bottom: 22px; }
.detail-header .product-meta { margin-bottom: 21px; }
.detail-header .detail-promise { font: 30px/1.3 var(--serif); color: #e8dccb; letter-spacing: -.5px; margin: 0; }
.detail-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .9fr); gap: 42px; align-items: start; }
.detail-gallery.product-card { width: 100%; min-width: 0; }
.detail-gallery .product-visual { margin-top: 11px; }
.detail-gallery .thumbnail-bar { margin-bottom: 22px; }
.detail-copy { padding-block: 6px; min-width: 0; }
.detail-copy h2 { font: 31px/1.2 var(--serif); font-weight: 400; letter-spacing: -.6px; margin: 0 0 20px; }
.detail-copy > p { color: #bfbbb3; font-size: 15px; line-height: 1.9; margin: 0 0 20px; }
.detail-copy > .product-promise { font: 31px/1.25 var(--serif); letter-spacing: -.75px; color: #efe8dd; margin-bottom: 20px; }
.detail-copy .benefit-list { display: grid; gap: 12px; margin: 26px 0 30px; font-size: 14px; }
.detail-actions { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; border-top: 1px solid var(--line); padding-top: 25px; margin-top: 27px; }
.detail-actions > p, .detail-offer-note { color: var(--muted); font-size: 12px; line-height: 1.8; margin: 12px 0 0; }
.detail-story { border-top: 1px solid #ffffff1c; margin-top: 50px; padding-top: 38px; max-width: 780px; }
.detail-story h2 { font: 33px/1.2 var(--serif); margin: 0 0 21px; font-weight: 400; }
.detail-story p { font-size: 15px; line-height: 1.9; color: #bfbbb3; }
.error-page { padding-block: 80px 100px; max-width: 760px; }
.error-page h1 { font-size: clamp(40px, 6vw, 68px); }
.error-page p { color: var(--muted); font-size: 16px; line-height: 1.9; margin-bottom: 28px; }
.footer-contact { color: #d4c3a9; font-size: 12px; text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
.footer-contact:hover { color: var(--amber); text-decoration: underline; }
.accent-sage .small-dot { background: var(--olive); }
.accent-sage .benefit-list li::before { color: var(--olive); }
.accent-lavender .small-dot { background: var(--lavender); }
.accent-lavender .type-tag { color: #d2c3e6; background: #c4b6db10; border-color: #c4b6db32; }
.accent-lavender .gallery-thumb.active { border-color: var(--lavender); outline-color: var(--lavender); }
.accent-lavender .product-visual { background: #15131c; }
.accent-lavender .visual-foot { background: #c4b6db08; color: #d2c3e6; }
.accent-lavender .benefit-list li::before { color: var(--lavender); }
.accent-champagne .small-dot { background: var(--amber); }
.accent-champagne .type-tag { color: #dfc5a3; background: #dfb88410; border-color: #dfb88432; }
.accent-champagne .gallery-thumb.active { border-color: var(--amber); outline-color: var(--amber); }
.accent-champagne .visual-foot { background: #dfb88408; color: #dfc5a3; }
.accent-champagne .benefit-list li::before { color: var(--amber); }

@media (max-width: 1100px) {
  .detail-layout { gap: 30px; grid-template-columns: minmax(0, 1.15fr) minmax(0, .9fr); }
  .product-card .product-bottom { gap: 14px 20px; }
}
@media (max-width: 850px) {
  .detail-layout { grid-template-columns: 1fr; gap: 33px; }
  .detail-copy { max-width: 720px; }
  .detail-header { padding-bottom: 29px; }
}
@media (max-width: 560px) {
  .catalog-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px 12px; }
  .catalog-form .catalog-search { grid-column: 1 / -1; }
  .catalog-form .catalog-category { min-width: 0; }
  .catalog-form input { width: 100%; }
  .catalog-form select { min-width: 0; width: 100%; }
  .catalog-form .catalog-reset { grid-column: 1 / -1; padding-block: 4px; justify-self: start; }
  .catalog-pagination { gap: 10px; padding-top: 29px; }
  .catalog-empty { padding: 38px 20px; }
  .catalog-empty h3 { font-size: 28px; }
  .product-card .product-bottom { flex-direction: column; align-items: stretch; gap: 13px; }
  .product-card .product-bottom .product-link { width: 100%; }
  .product-card .details-link { justify-content: space-between; width: 100%; }
  .detail-page { padding-block: 22px 48px; }
  .detail-back { margin-bottom: 27px; }
  .detail-header h1 { font-size: 40px; letter-spacing: -1.35px; }
  .detail-header .detail-promise { font-size: 27px; }
  .detail-layout { gap: 29px; }
  .detail-copy h2 { font-size: 29px; }
  .detail-copy > p { font-size: 14px; }
  .detail-copy > .product-promise { font-size: 29px; line-height: 1.25; }
  .detail-actions .button { width: 100%; justify-content: space-between; }
  .detail-story { padding-top: 29px; margin-top: 36px; }
  .detail-story p { font-size: 14px; }
  .error-page { padding-block: 51px 70px; }
}

/* Original arcane workshop direction. This source is folded into catalog.css. */
:root {
  --paper: #0d0b15;
  --surface: #191522;
  --ink: #f3eadb;
  --muted: #bbb2c2;
  --amber: #d9b679;
  --amber-soft: #ddc18f;
  --line: #4b4055;
  --olive: #93cbb5;
  --lavender: #c2abed;
  --serif: 'Palatino Linotype', 'Book Antiqua', Palatino, Georgia, serif;
  background: var(--paper);
}
body {
  background:
    radial-gradient(ellipse 65% 900px at 93% 2%, #794baa28, transparent 78%),
    radial-gradient(ellipse 65% 650px at 7% 14%, #3b8a8117, transparent 78%),
    radial-gradient(ellipse 65% 900px at 99% 65%, #6b397516, transparent 80%),
    radial-gradient(ellipse 75% 700px at 0 100%, #6e593a12, transparent 80%),
    var(--paper);
}
body::before { opacity: .085; }
.site-header { border-color: #c7a66a32; }
.brand { font-family: var(--serif); font-size: 26px; letter-spacing: -.9px; }
.brand img { border-radius: 0; outline: none; width: 46px; height: 46px; }
.brand-studio { color: #c5ae85; letter-spacing: 4px; font-size: 8px; }
.main-nav a { color: #d4c9db; }
.header-note { color: #bcb1c2; font-size: 11px; }
.header-note .status-dot { background: #ad97d1; box-shadow: 0 0 14px #ad97d160; }
.hero { position: relative; grid-template-columns: minmax(0, 1.16fr) minmax(0, 1fr); gap: 20px; align-items: center; padding-block: 45px 48px; }
.hero-main { position: relative; z-index: 1; padding-block: 40px; }
.hero h1 { font-size: clamp(58px, 5.1vw, 75px); line-height: 1.13; letter-spacing: -2.8px; margin-bottom: 28px; }
.hero h1 em { color: #ddc190; font-weight: 400; }
.hero h1 br { display: initial; }
.hero .eyebrow { color: #c6b4d4; font-size: 10px; letter-spacing: 1.7px; }
.line-mark { width: 28px; height: 5px; border-top: 1px solid #c4a46d; border-bottom: 1px solid #c4a46d; background: transparent; }
.hero-description { color: #c7bdcf; font-size: 17px; line-height: 1.9; }
.hero-signature { margin: 25px 0 0; color: #b7a7bd; font-size: 10px; line-height: 1.8; letter-spacing: .3px; display: flex; gap: 10px; align-items: center; }
.hero-signature > span { width: 5px; height: 5px; background: #a68dca; transform: rotate(45deg); }
.hero-aside { display: flex; flex-direction: column; align-items: center; padding: 0; border: 0; align-self: center; min-width: 0; }
.arcane-art { position: relative; width: min(100%, 530px); margin: -10px 0 -24px; }
.arcane-art::before { content: ''; position: absolute; inset: 20%; z-index: -1; border-radius: 50%; box-shadow: 0 0 100px 20px #8c50c825, 50px 20px 95px #51b4a51f; }
.arcane-art img { width: 100%; height: auto; }
.hero-aside .aside-kicker { color: #bca077; letter-spacing: 2.7px; font-size: 9px; margin: 0 0 8px; text-align: center; }
.hero-aside .aside-copy { color: #c3b7d0; font-size: 19px; line-height: 1.45; text-align: center; margin: 0; }
.hero-aside .aside-copy em { color: #c2abed; }
.button { border-radius: 3px 9px 3px 9px; }
.button-dark { background: linear-gradient(135deg, #e0c18d, #c59c60); border-color: #e8d0a2; color: #21180f; box-shadow: inset 0 0 0 3px #35220c26, 0 5px 24px #bd8b3e12; }
.button-dark:hover { background: linear-gradient(135deg, #efd7ae, #dcb67b); color: #21180f; border-color: #f1dcba; }
.button-outline { background: #211a2c; border-color: #9b86ac; color: #e0d5e7; box-shadow: inset 0 0 0 3px #00000024; }
.button-outline:hover { background: #2f2440; border-color: #d4b5f0; }
.hero-rule { border-color: #c7a66a32; padding-block: 19px; color: #bbaec5; }
.hero-rule > span:first-child { color: #d8bd91; }
.hero-rule span span { color: #856d9d; }
.catalog { padding-top: 60px; }
.section-heading .eyebrow { color: #c4a46d; letter-spacing: 2.3px; }
.section-heading h2 { font-size: 39px; letter-spacing: -1.3px; }
.section-heading > p { color: #b8aebf; }
.product-card { position: relative; border: 1px solid #77604d; border-radius: 11px 3px 11px 3px; background: linear-gradient(150deg, #272031, #191521 65%); box-shadow: inset 0 1px 0 #d2b58b0f, 0 25px 50px -25px #000b; }
.product-card::before {
  content: ''; position: absolute; inset: 7px; pointer-events: none; z-index: 1; opacity: .55;
  background:
    linear-gradient(#d6b77f,#d6b77f) left top / 17px 1px,
    linear-gradient(#d6b77f,#d6b77f) left top / 1px 17px,
    linear-gradient(#d6b77f,#d6b77f) right top / 17px 1px,
    linear-gradient(#d6b77f,#d6b77f) right top / 1px 17px,
    linear-gradient(#d6b77f,#d6b77f) left bottom / 17px 1px,
    linear-gradient(#d6b77f,#d6b77f) left bottom / 1px 17px,
    linear-gradient(#d6b77f,#d6b77f) right bottom / 17px 1px,
    linear-gradient(#d6b77f,#d6b77f) right bottom / 1px 17px;
  background-repeat: no-repeat;
}
.product-card:hover { border-color: #b19369; }
.product-topline { color: #c6b8d0; padding-top: 26px; }
.product-number { color: #c2a77a; font-family: var(--serif); font-size: 14px; letter-spacing: 1px; }
.product-card .card-title { padding-bottom: 23px; }
.product-card .card-title h3 { font-family: var(--serif); color: #f1e7d8; font-size: 30px; font-weight: 400; letter-spacing: -.8px; }
.product-card .product-visual { border-color: #a38c6530; border-radius: 3px; }
.visual-foot { background: #161e1c; }
.command-center .visual-foot { background: #21182d; }
.product-promise { color: #e8d8bf; font-family: var(--serif); font-size: 30px; line-height: 1.3; }
.product-description { color: #c1b6ca; }
.benefit-list { color: #cfc4d4; }
.product-bottom { border-color: #b3936036; }
.product-link { color: #e0bf89; }
.product-link:hover { color: #f1d9b1; }
.product-card .details-link { color: #c9b5df; }
.gallery-step { border-color: #9a85ac; border-radius: 2px 6px; background: #241c30; color: #e4d3f4; }
.gallery-step:hover { background: #362647; border-color: #c8a2ec; }
.gallery-thumb { border-radius: 2px 5px; }
.gallery-thumb:not(.active) { border-color: #9b86ac; }
.expand-label { color: #eee3f4; background: #241a32ef; border-color: #b49cc4; }
.collection-footnote { color: #b5a9c0; }
.approach-section { background: radial-gradient(ellipse at 90% 80%, #73469916, transparent 70%), linear-gradient(110deg, #b7864710, #251d310a); border-color: #c7a66a32; }
.approach-grid .eyebrow { color: #c6a875; }
.approach-grid h2 { color: #eee3d3; font-family: var(--serif); font-size: 40px; line-height: 1.2; }
.approach-copy p { color: #c1b6ca; }
.text-link { color: #ddbc88; }
.site-footer { border-color: #c7a66a32; }
.site-footer .brand { font-size: 22px; }
.site-footer .brand img { width: 36px; height: 36px; }
.site-footer p, .footer-contact { color: #b9abc5; }
.lightbox { background: linear-gradient(145deg, #2c2337, #15101d); border-color: #b39569; border-radius: 11px 3px; box-shadow: inset 0 0 0 5px #d9b67908, 0 30px 120px #000c; }
.lightbox::backdrop { background: #070510df; }
.lightbox-header .eyebrow { color: #c5a56c; }
.icon-button { color: #eee2f6; background: #30233d; border-color: #a68cb7; }
.lightbox figcaption { color: #c9bdd1; }
.catalog-form input, .catalog-form select { color: #f3eadb; background: #201a2b; border-color: #9b86ac; }
.catalog-form label { color: #cabdd4; }
.catalog-form { margin-bottom: 30px; }
.catalog-empty { background: #1b15234d; border-color: #8e749c; }
.detail-header h1 { font-family: var(--serif); color: #f3eadb; }
.detail-header .eyebrow { color: #c3a371; }
.detail-copy > .product-promise { font-family: var(--serif); color: #e8d8bf; }
.detail-copy > p, .detail-story p { color: #c1b6ca; }
.detail-story, .detail-actions { border-color: #c7a66a32; }
body[data-page="detail"]::after { content: ''; position: absolute; z-index: -1; width: min(700px, 100%); height: 700px; right: 0; top: 40px; opacity: .065; background: url('/assets/arcane-forge.svg') center / contain no-repeat; pointer-events: none; }
@media (max-width: 1100px) {
  .hero { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 5px; }
  .hero h1 { font-size: 62px; }
  .hero .eyebrow { font-size: 9px; letter-spacing: 1.1px; }
  .hero-description { font-size: 16px; }
  .hero-signature { font-size: 9px; }
  .hero-aside .aside-copy { font-size: 18px; }
  .product-card .card-title h3 { font-size: 28px; }
}
@media (max-width: 780px) {
  .hero { grid-template-columns: 1fr; padding-block: 42px 35px; gap: 0; }
  .hero-main { padding-block: 0; }
  .hero h1 { max-width: 620px; font-size: clamp(47px, 7.8vw, 61px); }
  .hero-aside { display: flex; width: 100%; margin-top: 18px; }
  .arcane-art { width: 300px; margin: -7px 0 -18px; }
  .hero-aside .aside-copy { display: none; }
  .hero-aside .aside-kicker { margin: 0; font-size: 8px; }
  .hero-signature { margin-top: 20px; }
  .approach-grid h2 { font-size: 36px; }
}
@media (max-width: 560px) {
  .brand { font-size: 23px; gap: 9px; }
  .brand img { width: 40px; height: 40px; }
  .brand-studio { font-size: 7px; letter-spacing: 3.5px; }
  .hero { padding-block: 36px 30px; }
  .hero h1 { font-size: 45px; letter-spacing: -1.9px; line-height: 1.14; }
  .hero .eyebrow { font-size: 8px; letter-spacing: 1.15px; gap: 9px; margin-bottom: 22px; }
  .hero-description { font-size: 15px; }
  .hero-signature { font-size: 9px; }
  .hero-aside { margin-top: 9px; }
  .arcane-art { width: 260px; margin-bottom: -16px; }
  .hero-rule { font-size: 9px; }
  .catalog { padding-top: 44px; }
  .section-heading h2 { font-size: 33px; }
  .product-card .card-title h3 { font-size: 28px; }
  .product-promise { font-size: 29px; }
  .approach-grid h2 { font-size: 35px; }
  .detail-header h1 { font-size: 40px; }
}
@media (max-width: 380px) {
  .hero h1 { font-size: 40px; }
  .hero .eyebrow { font-size: 7.5px; letter-spacing: .85px; }
  .hero-signature { font-size: 8px; }
  .arcane-art { width: 240px; }
  .product-card .card-title h3 { font-size: 26px; }
}
