/* ============================================================
   Atelier Affairs — Website UI Kit styles
   Builds on colors_and_type.css tokens.
   ============================================================ */

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body { background: var(--aa-ivory); }

.site {
  font-family: var(--aa-sans);
  color: var(--aa-fg);
  background: var(--aa-ivory);
  font-weight: 300;
  font-variant-ligatures: none;
  font-feature-settings: "liga" 0, "clig" 0, "dlig" 0, "calt" 0;
  -webkit-font-smoothing: antialiased;
  min-height: 100vh;
  overflow-x: hidden;
}
.wrap { max-width: var(--aa-maxw); margin: 0 auto; padding: 0 40px; }
.wrap-wide { max-width: var(--aa-maxw-wide); margin: 0 auto; padding: 0 40px; }

/* ---------- shared type helpers ---------- */
.eyebrow { font-size: var(--aa-fs-eyebrow); font-weight: 500; letter-spacing: var(--aa-track-eyebrow);
  text-transform: uppercase; color: var(--aa-fg-2); }
.eyebrow.on-dark { color: var(--aa-fg-on-dark-2); }
.eyebrow.brass { color: var(--aa-brass); }
.serif { font-family: var(--aa-serif); font-weight: 400; letter-spacing: -0.01em; line-height: 1.04; }
.serif.it { font-style: italic; font-weight: 400; }
.rule { width: 44px; height: 1px; background: var(--aa-line-strong); border: 0; margin: 0; }
.rule.brass { background: var(--aa-brass); }
.rule.center { margin-left: auto; margin-right: auto; }

/* ---------- buttons ---------- */
.btn { font-family: var(--aa-sans); font-size: 12px; font-weight: 500; letter-spacing: var(--aa-track-button);
  text-transform: uppercase; padding: 15px 32px; border-radius: var(--aa-r-pill); cursor: pointer;
  border: 1px solid transparent; transition: all var(--aa-dur) var(--aa-ease-out); display: inline-flex;
  align-items: center; gap: 10px; text-decoration: none; line-height: 1; }
.btn-solid { background: var(--aa-charcoal); color: var(--aa-porcelain); }
.btn-solid:hover { background: #3a3833; }
.btn-solid:active { opacity: .85; }
.btn-outline { background: transparent; color: var(--aa-fg); border-color: var(--aa-line-strong); }
.btn-outline:hover { border-color: var(--aa-charcoal); background: var(--aa-charcoal); color: var(--aa-porcelain); }
.btn-outline.on-dark { color: var(--aa-fg-on-dark); border-color: rgba(252,250,244,.4); }
.btn-outline.on-dark:hover { background: var(--aa-porcelain); color: var(--aa-charcoal); border-color: var(--aa-porcelain); }
.btn .ico { width: 15px; height: 15px; }

.tlink { font-family: var(--aa-sans); font-size: 12px; font-weight: 500; letter-spacing: var(--aa-track-button);
  text-transform: uppercase; color: var(--aa-fg); cursor: pointer; background: none; border: 0; padding: 4px 0;
  position: relative; display: inline-flex; align-items: center; gap: 8px; text-decoration: none; }
.tlink::after { content: ""; position: absolute; left: 0; bottom: -2px; height: 1px; width: 100%;
  background: var(--aa-charcoal-45); transform: scaleX(0); transform-origin: left; transition: transform var(--aa-dur) var(--aa-ease-out); }
.tlink:hover::after { transform: scaleX(1); }
.tlink .arr { transition: transform var(--aa-dur) var(--aa-ease-out); }
.tlink:hover .arr { transform: translateX(4px); }

/* ---------- tags ---------- */
.tag { font-size: 10px; letter-spacing: .16em; text-transform: uppercase; padding: 6px 12px;
  border-radius: var(--aa-r-pill); display: inline-flex; align-items: center; gap: 6px; line-height: 1; }
.tag-sage { background: var(--aa-sage-mist); color: var(--aa-sage-deep); }
.tag-sand { background: var(--aa-sand); color: var(--aa-stone); }
.tag-ink { background: var(--aa-charcoal); color: var(--aa-porcelain); }
.tag-out { background: transparent; border: 1px solid var(--aa-line-strong); color: var(--aa-fg-2); }
.tag-float { position: absolute; top: 14px; left: 14px; background: var(--aa-porcelain);
  color: var(--aa-fg); box-shadow: var(--aa-shadow-xs); }

/* ---------- figure / image placeholder ---------- */
.fig { position: relative; overflow: hidden; background: var(--aa-sand); }
.fig .ph { position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform var(--aa-dur-slow) var(--aa-ease-out); }
.fig .cap { position: absolute; left: 14px; bottom: 12px; font-size: 9px; letter-spacing: .22em;
  text-transform: uppercase; color: rgba(252,250,244,.85); z-index: 2; }
.fig .scrim { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(27,26,22,.34)); z-index: 1; }
.fig.arch { border-radius: var(--aa-r-arch); }
.fig.hover-zoom:hover .ph { transform: scale(1.04); }

/* ---------- header ---------- */
.hdr { position: sticky; top: 0; z-index: 50; transition: all var(--aa-dur) var(--aa-ease); }
.hdr-inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; height: 84px; }
.hdr { --nav-fg: var(--aa-fg); --nav-fg-2: var(--aa-fg-2); }
.hdr.solid { background: rgba(246,241,231,.82); backdrop-filter: blur(14px) saturate(1.1);
  border-bottom: 1px solid var(--aa-line); }
.hdr.solid.shrink .hdr-inner { height: 66px; }
/* over the dark hero: transparent + light text (single inherited var, no specificity battles) */
.hdr.over-hero { background: transparent; --nav-fg: var(--aa-porcelain); --nav-fg-2: rgba(252,250,244,.72); }
.nav { display: flex; gap: 32px; align-items: center; justify-content: center; }
.nav-r { justify-content: center; }
.navlink { font-size: 11px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--nav-fg);
  cursor: pointer; background: none; border: 0; padding: 6px 0; position: relative; transition: color var(--aa-dur); white-space: nowrap; }
.navlink::after { content:""; position:absolute; left:0; bottom:0; height:1px; width:100%; background: var(--nav-fg);
  transform: scaleX(0); transform-origin:left; transition: transform var(--aa-dur) var(--aa-ease-out); }
.navlink:hover::after, .navlink.active::after { transform: scaleX(1); }

/* ---------- nav dropdown (Favorite Things) ---------- */
.navlink-wrap { position: relative; display: inline-flex; align-items: center; }
.navlink-wrap .navlink { display: inline-flex; align-items: center; gap: 4px; }
.nav-caret { opacity: .6; transition: transform var(--aa-dur) var(--aa-ease); }
.navlink-wrap:hover .nav-caret { transform: rotate(180deg); }
.navmenu { position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(6px);
  margin-top: 12px; min-width: 218px; background: var(--aa-porcelain); border: 1px solid var(--aa-line);
  border-radius: var(--aa-r-md); box-shadow: var(--aa-shadow-lg); padding: 8px; display: flex;
  flex-direction: column; gap: 2px; opacity: 0; pointer-events: none; z-index: 70;
  transition: opacity var(--aa-dur) var(--aa-ease), transform var(--aa-dur) var(--aa-ease); }
.navmenu::before { content: ""; position: absolute; top: -14px; left: 0; right: 0; height: 14px; }
.navlink-wrap:hover .navmenu, .navlink-wrap:focus-within .navmenu { opacity: 1; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.navmenu-item { text-align: left; background: none; border: 0; cursor: pointer; padding: 11px 14px;
  border-radius: var(--aa-r-sm); font-family: var(--aa-sans); font-size: 10.5px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--aa-fg-2); white-space: nowrap;
  transition: background var(--aa-dur), color var(--aa-dur); }
.navmenu-item:hover { background: var(--aa-sand); color: var(--aa-fg); }
.navmenu-item.active { color: var(--aa-brass); }

/* nested submenu (Muse › Mood Board) */
.navmenu-sub-wrap { position: relative; }
.navmenu-item.has-sub { display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 10px; }
.navmenu-caret { opacity: .55; margin-left: auto; }
.navmenu-sub { position: absolute; top: -8px; left: 100%; margin-left: 9px; min-width: 200px; background: var(--aa-porcelain);
  border: 1px solid var(--aa-line); border-radius: var(--aa-r-md); box-shadow: var(--aa-shadow-lg); padding: 8px;
  display: flex; flex-direction: column; gap: 2px; opacity: 0; pointer-events: none; transform: translateX(-6px);
  transition: opacity var(--aa-dur) var(--aa-ease), transform var(--aa-dur) var(--aa-ease); z-index: 80; }
.navmenu-sub::before { content: ""; position: absolute; top: 0; left: -14px; width: 14px; height: 100%; }
.navmenu-sub-wrap:hover .navmenu-sub, .navmenu-sub-wrap:focus-within .navmenu-sub { opacity: 1; pointer-events: auto; transform: translateX(0); }
.brand-mark { display: flex; flex-direction: column; align-items: center; cursor: pointer; gap: 4px; flex-shrink: 0; padding: 0 52px; }
.brand-mark .wm { font-family: var(--aa-serif); font-weight: 500; font-size: 25px; letter-spacing: .2em;
  text-transform: uppercase; line-height: 1; padding-left: .2em; color: var(--nav-fg); white-space: nowrap; }
.brand-mark .tl { font-size: 8.5px; letter-spacing: .36em; text-transform: uppercase; color: var(--nav-fg-2); padding-left: .36em; margin-top: 2px; white-space: nowrap; }
.icobtn { background: none; border: 0; cursor: pointer; color: var(--nav-fg); display: inline-flex; padding: 6px;
  position: relative; }
/* compact header button */
.hdr .btn { padding: 10px 20px; font-size: 10.5px; letter-spacing: .14em; }
/* stacked layout: wordmark centered on top, nav centered beneath */
.hdr.stacked .hdr-inner { display: block; height: auto; padding-top: 16px; padding-bottom: 14px; }
.hdr.stacked.shrink .hdr-inner { padding-top: 11px; padding-bottom: 10px; }
.hdr-stack-top { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; }
.hdr.stacked .brand-mark { padding: 0; }
.hdr.stacked .nav-r { justify-content: flex-end; }
.hdr.stacked .nav-center { justify-content: center; margin-top: 14px; gap: 38px; transition: margin var(--aa-dur) var(--aa-ease); }
.hdr.stacked.shrink .nav-center { margin-top: 10px; }
.hdr-spacer { display: block; }
.hdr-burger { display: none; background: none; border: 0; cursor: pointer; color: var(--nav-fg);
  padding: 6px; align-items: center; justify-content: center; }
.icobtn .badge { position: absolute; top: -2px; right: -2px; background: var(--aa-charcoal); color: var(--aa-porcelain);
  font-size: 9px; min-width: 15px; height: 15px; border-radius: 999px; display: grid; place-items: center; padding: 0 3px; font-weight:500;}

/* ---------- hero ---------- */
.hero { position: relative; height: 88vh; min-height: 600px; display: flex; align-items: flex-end; }
.hero .bg { position: absolute; inset: 0; }
.hero-invite { font-family: var(--aa-serif); font-style: italic; font-size: 0.72rem; line-height: 1.55;
  color: rgba(252,250,244,.74); margin: 54px 0 0; max-width: 46ch; }
.hero-link { background: none; border: 0; padding: 0; cursor: pointer; font: inherit; white-space: nowrap;
  color: var(--aa-brass-soft); border-bottom: 1px solid rgba(201,181,129,.6); line-height: 1.1;
  transition: color var(--aa-dur) var(--aa-ease), border-color var(--aa-dur) var(--aa-ease); }
.hero-link:hover { color: var(--aa-porcelain); border-color: var(--aa-porcelain); }
.hero .scrim { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(27,26,22,calc(var(--hero-scrim,0.5) * 0.5)) 0%, rgba(27,26,22,calc(var(--hero-scrim,0.5) * 0.12)) 26%, rgba(27,26,22,calc(var(--hero-scrim,0.5) * 0.5)) 60%, rgba(27,26,22,var(--hero-scrim,0.5)) 100%); }
.hero-corner-mark { position: absolute; top: 26px; left: 30px; height: 54px; width: auto; z-index: 3;
  opacity: .92; filter: drop-shadow(0 1px 6px rgba(27,26,22,.35)); }

/* ---------- hero · The Broadside (type-forward, full-bleed) ---------- */
.hero.hero-broadside { align-items: stretch; height: 92vh; min-height: 640px; }
.hero-inner { position: relative; z-index: 2; width: 100%; display: flex; flex-direction: column;
  justify-content: space-between; padding-top: 128px; padding-bottom: 60px; color: var(--aa-porcelain); }
.hero-topbar { display: flex; justify-content: space-between; align-items: center;
  padding-bottom: 20px; border-bottom: 1px solid rgba(252,250,244,.26); }
.hero-topbar .eyebrow { color: rgba(252,250,244,.8); }
.hero-broadside h1 { font-family: var(--aa-serif); font-weight: 400; font-size: clamp(3rem, 8vw, 7rem);
  line-height: .94; letter-spacing: -.035em; margin: 0; max-width: 15ch; text-shadow: 0 2px 30px rgba(27,26,22,.32); }
.hero-broadside h1 .it { font-style: italic; font-weight: 400; }
.hero-foot { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: end; margin-top: 38px; }
.hero-foot-text p { font-family: var(--aa-serif); font-weight: 300; font-size: clamp(1.1rem, 1.55vw, 1.4rem);
  line-height: 1.45; max-width: 40ch; margin: 0; color: rgba(252,250,244,.92); text-shadow: 0 1px 18px rgba(27,26,22,.3); }
.hero-define { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin: 22px 0 0;
  padding-top: 18px; border-top: 1px solid rgba(252,250,244,.18); max-width: 52ch; }
.hero-define .hd-word { font-size: 1.25rem; letter-spacing: -.01em; color: var(--aa-porcelain); }
.hero-define .hd-phon { font-family: var(--aa-serif); font-style: italic; font-size: .98rem; color: rgba(252,250,244,.55); }
.hero-define .hd-pos { font-size: 9.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--aa-brass); }
.hero-define .hd-def { font-family: var(--aa-serif); font-style: italic; font-weight: 300; font-size: 1.02rem;
  color: rgba(252,250,244,.82); flex-basis: 100%; margin-top: 2px; }
.hero .cta-row { display: flex; gap: 16px; flex-wrap: wrap; }

/* ---------- sections ---------- */
.section { padding: var(--aa-sp-10) 0; }
.section.tone { background: var(--aa-sand); }
.section.dark { background: var(--aa-charcoal); color: var(--aa-fg-on-dark); }
.section.tight { padding: var(--aa-sp-8) 0; }
.sec-head { display: flex; flex-direction: column; gap: 18px; max-width: 640px; }
.sec-head.center { align-items: center; text-align: center; margin: 0 auto; }
.sec-head h2 { font-family: var(--aa-serif); font-weight: 400; font-size: var(--aa-fs-h2); line-height: 1.05;
  letter-spacing: -.022em; margin: 0; }
.dark .sec-head h2 { color: var(--aa-porcelain); }
.sec-head p { font-family: var(--aa-serif); font-size: 1.2rem; line-height: 1.5; color: var(--aa-fg-2); margin: 0; max-width: 52ch; }
.dark .sec-head p { color: var(--aa-fg-on-dark-2); }
.coll-feenote { font-family: var(--aa-sans) !important; font-size: .82rem !important; letter-spacing: .01em; color: var(--aa-fg-3) !important; margin-top: 16px !important; }
.coll-feenote a { color: var(--aa-brass); text-decoration: none; border-bottom: 1px solid rgba(174,148,86,.45); padding-bottom: 1px; transition: color var(--aa-dur) var(--aa-ease), border-color var(--aa-dur) var(--aa-ease); }
.coll-feenote a:hover { color: var(--aa-ink); border-bottom-color: var(--aa-ink); }

/* ---------- value props ---------- */
.props { display: grid; grid-template-columns: repeat(3,1fr); gap: 2px; margin-top: 64px; }
.prop { padding: 0 36px; border-left: 1px solid var(--aa-line); }
.prop:first-child { border-left: 0; padding-left: 0; }
.prop .prop-num { font-family: var(--aa-serif); font-style: italic; font-weight: 400; font-size: 1.5rem;
  color: var(--aa-brass); line-height: 1; }
.prop .prop-rule { width: 28px; height: 1px; background: var(--aa-line-strong); margin: 16px 0 18px; }
.prop h3 { font-family: var(--aa-serif); font-weight: 400; font-size: 1.5rem; margin: 0 0 10px; }
.prop p { font-size: .95rem; line-height: 1.65; color: var(--aa-fg-2); margin: 0; }

/* ---------- product grid ---------- */
.pgrid { display: grid; grid-template-columns: repeat(4,1fr); gap: 28px 22px; }
.pgrid.cols-3 { grid-template-columns: repeat(3,1fr); }

/* ---------- our favorite things (vendors) ---------- */
.fav-cat { margin-top: 64px; }
.fav-cat:first-child { margin-top: 0; }
.fav-cat-head { display: flex; align-items: baseline; gap: 16px; margin-bottom: 34px; }
.fav-cat-head .fav-cat-num { font-size: 1.4rem; color: var(--aa-brass); line-height: 1; }
.fav-cat-head h2 { font-family: var(--aa-serif); font-weight: 400; font-size: clamp(1.6rem, 2.6vw, 2.1rem);
  letter-spacing: -.018em; margin: 0; white-space: nowrap; }
.fav-cat-rule { flex: 1; height: 1px; background: var(--aa-line-strong); align-self: center; }
.fav-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 40px 30px; }
.fav-card { display: flex; flex-direction: column; }
.fav-card .fig { transition: box-shadow var(--aa-dur) var(--aa-ease-out); }
.fav-card:hover .fig { box-shadow: var(--aa-shadow-md); }
.fav-card h3 { font-family: var(--aa-serif); font-weight: 400; font-size: 1.4rem; line-height: 1.12;
  letter-spacing: -.01em; margin: 0; }
.fav-card .fav-role { font-size: .92rem; color: var(--aa-fg-2); margin-top: 6px; }
.fav-card .fav-loc { display: flex; align-items: center; gap: 6px; font-size: 11px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--aa-fg-3); margin-top: 10px; }
.fav-card .fav-loc .ico { color: var(--aa-brass); }
.fav-card .fav-note { font-family: var(--aa-serif); font-style: italic; font-weight: 300; font-size: 1.02rem;
  line-height: 1.5; color: var(--aa-fg-2); margin: 14px 0 0; }
.pcard { cursor: pointer; display: flex; flex-direction: column; }
.pcard .fig { aspect-ratio: 4/5; margin-bottom: 16px; transition: box-shadow var(--aa-dur) var(--aa-ease-out); }
.pcard:hover .fig { box-shadow: var(--aa-shadow-md); }
.pcard .pname { font-family: var(--aa-serif); font-weight: 400; font-size: 1.32rem; line-height: 1.1; }
.pcard .pmeta { font-size: .8rem; letter-spacing: .02em; color: var(--aa-fg-2); margin-top: 5px; }
.pcard .prow { display: flex; justify-content: space-between; align-items: baseline; margin-top: 14px;
  padding-top: 13px; border-top: 1px solid var(--aa-line); }
.pcard .price { font-family: var(--aa-serif); font-size: 1.15rem; }
.pcard .unit { font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--aa-fg-3); }

/* ---------- filters ---------- */
.filterbar { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.chip { font-size: 11px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; padding: 9px 18px;
  border-radius: var(--aa-r-pill); border: 1px solid var(--aa-line-strong); background: transparent; color: var(--aa-fg-2);
  cursor: pointer; transition: all var(--aa-dur) var(--aa-ease-out); white-space: nowrap; }
.chip:hover { border-color: var(--aa-charcoal); color: var(--aa-fg); }
.chip.active { background: var(--aa-charcoal); color: var(--aa-porcelain); border-color: var(--aa-charcoal); }

/* ---------- package cards ---------- */
.pkgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(248px, 1fr)); gap: 22px; }
.pkg { background: var(--aa-porcelain); border: 1px solid var(--aa-line); display: flex; flex-direction: column;
  transition: box-shadow var(--aa-dur) var(--aa-ease-out), transform var(--aa-dur) var(--aa-ease-out); }
.pkg:hover { box-shadow: var(--aa-shadow-md); transform: translateY(-3px); }
.pkg.featured { background: var(--aa-sand); color: var(--aa-fg); border-color: var(--aa-brass); box-shadow: var(--aa-shadow-md); }
.pkg .pkfig { aspect-ratio: 16/10; }
.pkg .pkbody { padding: 28px 28px 30px; display: flex; flex-direction: column; flex: 1; }
.pkg h3 { font-family: var(--aa-serif); font-weight: 400; font-size: 1.9rem; margin: 14px 0 6px; line-height: 1; }
.pkg .pkdesc { font-size: .92rem; line-height: 1.6; color: var(--aa-fg-2); margin: 0 0 20px; }
.pkg.featured .pkdesc { color: var(--aa-fg-2); }
.pkg .incl { list-style: none; padding: 0; margin: 0 0 26px; display: flex; flex-direction: column; gap: 11px; flex: 1; }
.pkg .incl li { display: flex; gap: 11px; align-items: flex-start; font-size: .9rem; color: var(--aa-fg); line-height: 1.4; }
.pkg.featured .incl li { color: var(--aa-fg); }
.pkg .incl .ico { color: var(--aa-brass); flex: none; margin-top: 1px; }
.pkg .pkprice { display: flex; align-items: baseline; gap: 8px; margin-bottom: 22px; }
.pkg .pkprice .amt { font-family: var(--aa-serif); font-size: 2.1rem; line-height: 1; }
.pkg .pkprice .from { font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--aa-fg-3); }
.pkg.featured .pkprice .from { color: var(--aa-fg-3); }

/* ---------- footer ---------- */
.ftr { background: var(--aa-charcoal); color: var(--aa-fg-on-dark); padding: 80px 0 36px; }
.ftr-top { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 40px; padding-bottom: 56px;
  border-bottom: 1px solid rgba(252,250,244,.12); }
.ftr .wm { font-family: var(--aa-serif); font-weight: 400; font-size: 26px; letter-spacing: .24em; text-transform: uppercase;
  color: var(--aa-porcelain); padding-left: .24em; }
.ftr .blurb { font-family: var(--aa-serif); font-size: 1.05rem; line-height: 1.55; color: var(--aa-fg-on-dark-2);
  margin: 18px 0 0; max-width: 34ch; }
.ftr h4 { font-size: 10px; letter-spacing: .24em; text-transform: uppercase; color: var(--aa-fg-on-dark-2);
  margin: 0 0 20px; font-weight: 500; }
.ftr ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 13px; }
.ftr ul a { color: var(--aa-porcelain); text-decoration: none; font-size: .92rem; font-weight: 300; cursor: pointer;
  opacity: .85; transition: opacity var(--aa-dur); }
.ftr ul a:hover { opacity: 1; }
.ftr-bot { display: flex; justify-content: space-between; align-items: center; padding-top: 28px; flex-wrap: wrap; gap: 14px; }
.ftr-bot span { font-size: 11px; letter-spacing: .08em; color: var(--aa-fg-on-dark-2); }

/* ---------- venue visualizer ---------- */
.vv { display: grid; grid-template-columns: 308px 1fr; gap: 0; min-height: 660px; border: 1px solid var(--aa-line);
  background: var(--aa-porcelain); box-shadow: var(--aa-shadow-md); }
.vv-rail { border-right: 1px solid var(--aa-line); padding: 26px 24px; display: flex; flex-direction: column; gap: 24px; overflow-y: auto; }
.vv-stage { position: relative; background: var(--aa-charcoal); overflow: hidden; touch-action: none; }
.vv-canvas { position: absolute; inset: 0; background-size: cover; background-position: center; }
.vv-skyfloor { position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(180deg, rgba(27,26,22,.30) 0%, transparent 26%, transparent 58%, rgba(27,26,22,.34) 100%); }
.vv-grade { position: absolute; inset: 0; z-index: 6; pointer-events: none; opacity: 0; transition: opacity .7s var(--aa-ease-out);
  background: radial-gradient(120% 90% at 50% 40%, rgba(174,148,86,.10), rgba(27,26,22,.16)); }
.vv-rendered .vv-grade { opacity: 1; }
.vv-venue-label { position: absolute; top: 20px; left: 22px; z-index: 7; color: var(--aa-porcelain); text-shadow: 0 1px 8px rgba(27,26,22,.4); }
.vv-venue-label .vn { font-family: var(--aa-serif); font-size: 1.7rem; line-height: 1; }
.vv-venue-label .vl { font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: rgba(252,250,244,.78); margin-top: 6px; }

/* venue selector */
.vv-thumb { display: flex; gap: 14px; cursor: pointer; padding: 4px; border-radius: var(--aa-r-sm);
  transition: background var(--aa-dur); align-items: center; }
.vv-thumb:hover { background: var(--aa-sand); }
.vv-thumb.active { background: var(--aa-sand); }
.vv-thumb .vt-img { width: 60px; height: 46px; border-radius: var(--aa-r-xs); background-size: cover; flex: none; }
.vv-thumb .vt-txt { flex: 1; min-width: 0; }
.vv-thumb .vt-name { font-family: var(--aa-serif); font-size: 1rem; line-height: 1.1; }
.vv-thumb .vt-loc { font-size: 9px; letter-spacing: .12em; text-transform: uppercase; color: var(--aa-fg-3); margin-top: 4px; }
.vv-label { font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--aa-fg-3); }

/* piece palette */
.vv-palette { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.vv-pal { display: flex; align-items: center; gap: 8px; text-align: left; cursor: pointer; padding: 6px 8px 6px 6px;
  border: 1px solid var(--aa-line); background: transparent; border-radius: var(--aa-r-sm); position: relative;
  transition: all var(--aa-dur) var(--aa-ease-out); }
.vv-pal:hover { border-color: var(--aa-charcoal); background: var(--aa-sand); }
.vv-pal-sw { width: 28px; height: 28px; border-radius: 3px; flex: none; }
.vv-pal-nm { font-size: 10px; line-height: 1.15; color: var(--aa-fg); }
.vv-pal-add { margin-left: auto; color: var(--aa-fg-3); display: inline-flex; }
.vv-pal:hover .vv-pal-add { color: var(--aa-charcoal); }
.vv-textbtn { background: none; border: 0; cursor: pointer; font-family: var(--aa-sans); font-size: 11px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--aa-fg-3); padding: 4px; }
.vv-textbtn:hover { color: var(--aa-fg); }

/* ---------- combined Browse / Visualize sub-nav ---------- */
.shop-subnav { background: var(--aa-bg); border-bottom: 1px solid var(--aa-line); }
.shop-subnav-inner { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 20px 40px 18px; }
.shop-subnav-note { margin: 0; max-width: 60ch; text-align: center; font-family: var(--aa-sans); font-size: .8rem;
  line-height: 1.6; letter-spacing: .01em; color: var(--aa-fg-3); }
.shop-subnav-note b { color: var(--aa-fg-2); font-weight: 500; }
.seg { display: inline-flex; gap: 4px; padding: 5px; background: var(--aa-porcelain);
  border: 1px solid var(--aa-line); border-radius: var(--aa-r-pill); box-shadow: var(--aa-shadow-xs); }
.seg-btn { display: inline-flex; align-items: center; gap: 9px; padding: 11px 24px; border: 0; background: none;
  cursor: pointer; border-radius: var(--aa-r-pill); font-family: var(--aa-sans); font-size: 11px; font-weight: 500;
  letter-spacing: .14em; text-transform: uppercase; color: var(--aa-fg-2); white-space: nowrap;
  transition: color var(--aa-dur) var(--aa-ease), background var(--aa-dur) var(--aa-ease); }
.seg-btn:hover { color: var(--aa-fg); }
.seg-btn.active { background: var(--aa-charcoal); color: var(--aa-fg-on-dark); }
.seg-btn.active .ico { color: var(--aa-brass); }
@media (max-width: 560px) {
  .seg-btn { padding: 10px 15px; letter-spacing: .08em; }
  .seg-btn .ico { display: none; }
}

/* placed pieces */
.vv-place { position: absolute; cursor: grab; user-select: none; touch-action: none; will-change: transform; }
.vv-place:active { cursor: grabbing; }
.vv-place .body { width: 100%; height: 100%; position: relative; overflow: hidden; display: grid; place-items: center;
  border: 1px solid rgba(252,250,244,.55); background-size: cover; background-position: center;
  box-shadow: 0 6px 14px -8px rgba(27,26,22,.5); transition: box-shadow .4s var(--aa-ease-out); }
.vv-place .mono { width: 40%; opacity: .18; pointer-events: none; }
.vv-place .nm { position: absolute; left: 6px; bottom: 5px; font-size: 8px; letter-spacing: .06em; text-transform: uppercase;
  color: rgba(27,26,22,.74); background: rgba(252,250,244,.8); padding: 2px 5px; border-radius: 3px; line-height: 1.1; }
.vv-place.sel .body { outline: 2px solid var(--aa-porcelain); outline-offset: 2px; box-shadow: 0 0 0 4px rgba(252,250,244,.22); }
/* photo cutouts: no frame box — the transparent PNG's own drop-shadow does the grounding */
.vv-place .body.is-photo { border: 0; box-shadow: none; overflow: visible; background: transparent !important; }
.vv-rendered .vv-place .body.is-photo { box-shadow: none; }
.vv-place.sel .body.is-photo { outline: none; box-shadow: none; }
.vv-place.sel .body.is-photo .vv-photo { outline: 2px solid var(--aa-porcelain); outline-offset: 3px; border-radius: 4px; }
.vv-rendered .vv-place .body { box-shadow: 0 20px 34px -12px rgba(27,26,22,.62); border-color: rgba(252,250,244,.25); }
.vv-place-tools { position: absolute; top: -40px; left: 50%; transform: translateX(-50%); display: flex; gap: 2px;
  background: var(--aa-charcoal); border-radius: var(--aa-r-pill); padding: 4px; box-shadow: var(--aa-shadow-md); z-index: 60; }
.vv-place-tools button { width: 27px; height: 27px; border: 0; background: none; color: var(--aa-porcelain); cursor: pointer;
  border-radius: var(--aa-r-pill); display: grid; place-items: center; }
.vv-place-tools button:hover { background: rgba(252,250,244,.18); }

/* render moment */
.vv-shimmer { position: absolute; inset: 0; z-index: 30; pointer-events: none;
  background: linear-gradient(110deg, transparent 32%, rgba(252,250,244,.4) 50%, transparent 68%);
  background-size: 220% 100%; animation: vvshim 1.25s ease-in-out infinite; }
@keyframes vvshim { from { background-position: 150% 0; } to { background-position: -50% 0; } }
.vv-rendering { position: absolute; inset: 0; z-index: 31; display: flex; flex-direction: column; gap: 16px;
  align-items: center; justify-content: center; }
.vv-spin { width: 42px; height: 42px; border-radius: 999px; border: 2px solid rgba(252,250,244,.25);
  border-top-color: var(--aa-porcelain); animation: vvspin .9s linear infinite; }
.vv-empty { position: absolute; inset: 0; z-index: 7; display: flex; flex-direction: column; gap: 6px;
  align-items: center; justify-content: center; text-align: center; color: rgba(252,250,244,.92); pointer-events: none; }
.vv-hint { position: absolute; left: 50%; bottom: 16px; transform: translateX(-50%); z-index: 7;
  font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase; color: rgba(252,250,244,.82);
  background: rgba(27,26,22,.42); backdrop-filter: blur(6px); padding: 8px 16px; border-radius: var(--aa-r-pill); pointer-events: none; }
.vv-genchip { position: absolute; top: 20px; right: 22px; z-index: 8; display: flex; align-items: center; gap: 8px;
  font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--aa-sage-deep);
  background: var(--aa-sage-mist); padding: 8px 13px; border-radius: var(--aa-r-pill); }

/* ---------- journal ---------- */
.journal-feature { display: grid; grid-template-columns: 1.1fr 1fr; gap: 48px; align-items: center; cursor: pointer; }
.journal-feature .jf-text { padding-right: 20px; }
.journal-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px 30px; }
.jcard { cursor: pointer; display: flex; flex-direction: column; }
.jcard .fig { transition: box-shadow var(--aa-dur) var(--aa-ease-out); }
.jcard:hover .fig { box-shadow: var(--aa-shadow-md); }
.article-body p { font-size: 1.08rem; line-height: 1.75; color: var(--aa-fg); margin: 0 0 22px; }
.article-body p:first-of-type { font-size: 1.22rem; color: var(--aa-fg); }
.article-quote { font-family: var(--aa-serif); font-style: italic; font-weight: 400; font-size: 1.7rem;
  line-height: 1.35; color: var(--aa-ink); margin: 30px 0; padding-left: 24px; border-left: 2px solid var(--aa-brass); }
.article-sign { font-size: 1.05rem; color: var(--aa-fg-2); margin-top: 36px; padding-top: 24px; border-top: 1px solid var(--aa-line); }

/* ---------- our story ---------- */
.story-intro { display: grid; grid-template-columns: 1.05fr .95fr; gap: 60px; align-items: center; }
.story-split { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.story-process { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px; }
.story-step { padding: 0 30px; border-left: 1px solid var(--aa-line-tone); }
.story-step:first-child { border-left: 0; padding-left: 0; }
.story-step .prop-num { font-family: var(--aa-serif); font-style: italic; font-weight: 400; font-size: 1.5rem;
  color: var(--aa-brass); line-height: 1; }

/* ---------- product detail ---------- */
.pd { display: grid; grid-template-columns: 1.15fr 1fr; gap: 56px; align-items: start; }
.pd-gallery { display: flex; flex-direction: column; gap: 14px; }
.pd-main { aspect-ratio: 4/5; }
.pd-thumbs { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; }
.pd-thumbs .fig { aspect-ratio: 1; cursor: pointer; opacity: .6; transition: opacity var(--aa-dur); }
.pd-thumbs .fig.on, .pd-thumbs .fig:hover { opacity: 1; }
/* colorway selector */
.pd-cw { display: flex; align-items: center; gap: 16px; padding-top: 2px; }
.pd-cw-swatches { display: flex; gap: 10px; }
.pd-cw-sw { appearance: none; background: none; border: 0; padding: 3px; cursor: pointer; border-radius: 50%;
  box-shadow: 0 0 0 1px var(--aa-line); transition: box-shadow var(--aa-dur); }
.pd-cw-sw:hover { box-shadow: 0 0 0 1px var(--aa-taupe); }
.pd-cw-sw.on { box-shadow: 0 0 0 1.5px var(--aa-brass); }
.pd-cw-dot { display: block; width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--aa-line); }
.pd-cw-name { font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--aa-fg-2); }
/* configuration segmented control */
.pd-config { margin: 26px 0 4px; }
.pd-config-label { display: block; font-size: 11px; letter-spacing: .16em; text-transform: uppercase; color: var(--aa-fg-3); margin-bottom: 10px; }
.pd-seg { display: inline-flex; border: 1px solid var(--aa-line-strong); border-radius: 999px; padding: 3px; background: var(--aa-porcelain); }
.pd-seg-btn { appearance: none; border: 0; background: none; cursor: pointer; border-radius: 999px;
  padding: 9px 20px; font-size: .82rem; letter-spacing: .02em; color: var(--aa-fg-2);
  transition: color var(--aa-dur), background var(--aa-dur); }
.pd-seg-btn:hover { color: var(--aa-fg); }
.pd-seg-btn.on { background: var(--aa-charcoal); color: var(--aa-porcelain); }
/* colorway dots on product cards */
.pcard-cw { position: absolute; bottom: 10px; left: 10px; z-index: 3; display: flex; gap: 5px; }
.pcard-cw .d { width: 13px; height: 13px; border-radius: 50%; border: 1px solid rgba(0,0,0,.18); box-shadow: 0 1px 3px rgba(0,0,0,.18); }
.pd-info { position: sticky; top: 96px; }
.pd-info h1 { font-family: var(--aa-serif); font-weight: 400; font-size: 3rem; line-height: 1; margin: 14px 0 0; letter-spacing: -.025em; }
.pd-price { font-family: var(--aa-serif); font-size: 1.7rem; margin: 18px 0; }
.pd-price .unit { font-family: var(--aa-sans); font-size: 10px; letter-spacing: .16em; text-transform: uppercase; color: var(--aa-fg-3); margin-left: 8px; }
.pd-desc { font-size: 1rem; line-height: 1.7; color: var(--aa-fg-2); margin: 0 0 28px; max-width: 46ch; }
.pd-specs { list-style: none; padding: 22px 0; margin: 0 0 28px; border-top: 1px solid var(--aa-line); border-bottom: 1px solid var(--aa-line);
  display: flex; flex-direction: column; gap: 13px; }
.pd-specs li { display: flex; justify-content: space-between; font-size: .9rem; }
.pd-specs .k { color: var(--aa-fg-3); letter-spacing: .04em; }
.pd-specs .v { color: var(--aa-fg); }
.pd-actions { display: flex; gap: 14px; flex-wrap: wrap; }

/* ---------- entrance animation ---------- */
@media (prefers-reduced-motion: no-preference) {
  .reveal { opacity: 0; transform: translateY(22px); transition: opacity var(--aa-dur-slow) var(--aa-ease-out), transform var(--aa-dur-slow) var(--aa-ease-out); }
  .reveal.in { opacity: 1; transform: none; }
}
/* tweak hooks */
.site.no-anim .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
.site.btn-soft .btn { border-radius: var(--aa-r-md); }
.site[data-hw="500"] .hero h1,
.site[data-hw="500"] .sec-head h2,
.site[data-hw="500"] .pd-info h1,
.site[data-hw="500"] .pcard .pname,
.site[data-hw="500"] .pkg h3 { font-weight: 500; }

/* ---------- toast ---------- */
@keyframes vvspin { to { transform: rotate(360deg); } }
.toast { position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%) translateY(20px); z-index: 100;
  background: var(--aa-charcoal); color: var(--aa-porcelain); padding: 15px 26px; border-radius: var(--aa-r-sm);
  font-size: 12px; letter-spacing: .12em; text-transform: uppercase; box-shadow: var(--aa-shadow-lg);
  opacity: 0; pointer-events: none; transition: all var(--aa-dur) var(--aa-ease-out); display:flex; align-items:center; gap:10px; }
.toast.show { opacity: 1; transform: translateX(-50%) translateY(0); }
.toast .ico { color: var(--aa-sage); }

@media (max-width: 980px) {
  .props { grid-template-columns: 1fr; gap: 40px; }
  .prop { border-left: 0; padding: 0; }
  .pgrid, .pgrid.cols-3 { grid-template-columns: repeat(2,1fr); }
  .fav-grid { grid-template-columns: repeat(2,1fr); gap: 32px 24px; }
  .pkgrid { grid-template-columns: 1fr; }
  .pd { grid-template-columns: 1fr; }
  .vv { grid-template-columns: 1fr; }
  .ftr-top { grid-template-columns: 1fr 1fr; gap: 32px; }
  .story-intro, .story-split { grid-template-columns: 1fr; gap: 40px; }
  .story-process { grid-template-columns: 1fr 1fr; gap: 30px 24px; }
  .story-step { border-left: 0; padding: 0; }
  .journal-feature { grid-template-columns: 1fr; gap: 26px; }
  .journal-grid { grid-template-columns: repeat(2, 1fr); gap: 32px 24px; }
}

/* ---------- phone ---------- */
@media (max-width: 600px) {
  .wrap, .wrap-wide { padding: 0 20px; }
  .section { padding: 64px 0; }
  .section.tight { padding: 44px 0; }

  /* header: compact stacked with toggle dropdown menu */
  .hdr-inner { height: auto; }
  .hdr-burger { display: flex; }
  .hide-mobile { display: none; }
  .hdr.stacked .hdr-stack-top { padding: 10px 0 6px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
  .hdr .hdr-spacer { display: none; }
  .hdr .hdr-stack-top .brand-mark { margin-left: -8px; }
  .brand-mark { padding: 0; }
  .brand-mark .wm { font-size: 19px; letter-spacing: .14em; padding-left: .14em; }
  .brand-mark .tl { font-size: 7px; letter-spacing: .28em; padding-left: .28em; }
  .navlink { font-size: 14px; letter-spacing: .04em; text-transform: none; font-family: var(--aa-serif); font-weight: 400; }
  .hdr .btn { padding: 9px 14px; font-size: 9.5px; }
  .icobtn { padding: 4px; }

  /* dropdown menu: hidden until toggled */
  .nav.nav-center { display: none; flex-direction: column; align-items: stretch; gap: 0;
    margin: 0; padding: 0; flex-wrap: nowrap;
    max-height: 0; overflow: hidden; transition: max-height var(--aa-dur) var(--aa-ease); }
  .nav.nav-center.open { display: flex; max-height: 60vh; padding: 6px 0 14px; }
  .nav.nav-center .navlink { padding: 14px 4px; border-bottom: 1px solid var(--aa-line);
    text-align: left; width: 100%; }
  .nav.nav-center .navlink::after { display: none; }
  .nav.nav-center .navlink.active { color: var(--aa-brass); font-style: italic; }
  /* non-stacked header on mobile: same dropdown behavior */
  .hdr:not(.stacked) .nav:not(.nav-r) { display: none; flex-direction: column; align-items: stretch;
    position: absolute; left: 0; right: 0; top: 100%; background: var(--aa-ivory);
    border-bottom: 1px solid var(--aa-line); box-shadow: var(--aa-shadow-md); padding: 0 24px; z-index: 60; }
  .hdr:not(.stacked).menu-open .nav:not(.nav-r) { display: flex; padding: 6px 24px 16px; }
  .hdr:not(.stacked) .nav:not(.nav-r) .navlink { padding: 14px 0; border-bottom: 1px solid var(--aa-line);
    text-align: left; color: var(--aa-fg); }

  /* hero */
  .hero, .hero.hero-broadside { height: auto; min-height: 86vh; padding-top: 0; }
  .hero-inner { padding-top: 104px; padding-bottom: 40px; }
  .hero-loc { display: none; }
  .hero-broadside h1 { max-width: 14ch; }
  .hero-foot { grid-template-columns: 1fr; gap: 26px; margin-top: 30px; }
  .hero .cta-row { flex-direction: column; align-items: stretch; }
  .hero .cta-row .btn { justify-content: center; }
  .hero-corner-mark { height: 36px; top: 14px; left: 18px; }

  /* grids → single elegant column */
  .pgrid, .pgrid.cols-3 { grid-template-columns: 1fr; gap: 36px; }
  .fav-grid { grid-template-columns: 1fr !important; gap: 36px; }
  .pcard .fig { aspect-ratio: 4/3; }
  .feature-split, .consult-form, .incl-strip, .ftr-top { grid-template-columns: 1fr !important; }
  .incl-strip { gap: 30px; }
  .story-process { grid-template-columns: 1fr !important; }
  .journal-grid { grid-template-columns: 1fr !important; }

  /* section headers */
  .sec-head h2 { font-size: 2rem; }
  .props { margin-top: 40px; }

  /* venue visualizer: stack rail above stage */
  .vv-rail { border-right: 0; border-bottom: 1px solid var(--aa-line); }
  .vv-stage { min-height: 360px; }

  /* footer */
  .ftr { padding: 56px 0 30px; }
  .ftr-bot { flex-direction: column; align-items: flex-start; gap: 8px; }

  /* sticky filter bar */
  .filterbar { gap: 6px; }
  .chip { padding: 8px 13px; font-size: 10px; }

  /* finance modal: full-bleed sheet */
  .fin-modal { padding: 38px 26px 30px; }
  .fin-title { font-size: 1.7rem; }
}

/* ---------- pay-over-time (finance) ---------- */
.fin-line { display: flex; align-items: baseline; flex-wrap: wrap; gap: 9px;
  font-size: .82rem; color: var(--aa-fg-2); margin: -6px 0 24px; }
.fin-line .fin-amt { font-family: var(--aa-serif); font-style: italic; color: var(--aa-fg); }
.fin-line .fin-sep { color: var(--aa-line-strong); }
.fin-link { background: none; border: 0; padding: 0; cursor: pointer; font: inherit;
  color: var(--aa-fg-2); border-bottom: 1px solid var(--aa-line-strong); line-height: 1.2;
  transition: color var(--aa-dur) var(--aa-ease), border-color var(--aa-dur) var(--aa-ease); }
.fin-link:hover { color: var(--aa-brass); border-color: var(--aa-brass); }
.fin-brand { font-weight: 500; letter-spacing: -.01em; color: var(--aa-brass); }
.fin-line.on-dark { color: var(--aa-fg-on-dark-2); }
.fin-line.on-dark .fin-amt { color: var(--aa-porcelain); }
.fin-line.on-dark .fin-link { color: var(--aa-fg-on-dark-2); border-color: rgba(252,250,244,.3); }
.fin-line.on-dark .fin-link:hover { color: var(--aa-brass-soft); border-color: var(--aa-brass-soft); }
.fin-line.on-dark .fin-brand { color: var(--aa-brass-soft); }

/* package card line: pull tight under price */
.pkg .pkprice + .fin-line { margin: -14px 0 20px; }
/* package card link inherits card fg better */
.pkg .fin-line { color: var(--aa-fg-2); }

.fin-overlay { position: fixed; inset: 0; z-index: 1000; display: flex; align-items: center;
  justify-content: center; padding: 28px; background: rgba(27,26,22,.52);
  backdrop-filter: blur(3px); animation: finFade .22s var(--aa-ease-out); }
@keyframes finFade { from { opacity: 0; } to { opacity: 1; } }
.fin-modal { position: relative; width: 100%; max-width: 460px; max-height: 90vh; overflow-y: auto;
  background: var(--aa-porcelain); border: 1px solid var(--aa-line); border-radius: 3px;
  box-shadow: var(--aa-shadow-md, 0 30px 80px rgba(27,26,22,.28)); padding: 44px 44px 34px;
  animation: finRise .3s var(--aa-ease-out); }
@keyframes finRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
.fin-close { position: absolute; top: 18px; right: 18px; background: none; border: 0; cursor: pointer;
  color: var(--aa-fg-3); padding: 6px; line-height: 0; border-radius: 50%;
  transition: color var(--aa-dur) var(--aa-ease), background var(--aa-dur) var(--aa-ease); }
.fin-close:hover { color: var(--aa-fg); background: var(--aa-charcoal-08); }
.fin-eyebrow { font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--aa-brass); }
.fin-title { font-family: var(--aa-serif); font-weight: 400; font-size: 2rem; line-height: 1.04;
  letter-spacing: -.02em; margin: 12px 0 0; color: var(--aa-fg); }
.fin-lede { font-size: .95rem; line-height: 1.6; color: var(--aa-fg-2); margin: 14px 0 0; max-width: 42ch; }

.fin-quote { margin: 26px 0 4px; padding: 22px 24px; background: var(--aa-ivory-deep);
  border: 1px solid var(--aa-line); border-radius: 3px; }
.fin-quote-row { display: flex; align-items: baseline; justify-content: space-between; }
.fin-quote-label { font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: var(--aa-fg-3); }
.fin-quote-val { font-family: var(--aa-serif); font-size: 1.2rem; color: var(--aa-fg); }
.fin-terms { display: flex; gap: 6px; margin: 16px 0 0; }
.fin-term { flex: 1; padding: 9px 0; font-family: var(--aa-sans); font-size: 12px; letter-spacing: .04em;
  background: var(--aa-porcelain); border: 1px solid var(--aa-line-strong); border-radius: 2px;
  color: var(--aa-fg-2); cursor: pointer;
  transition: all var(--aa-dur) var(--aa-ease); }
.fin-term:hover { border-color: var(--aa-brass); color: var(--aa-fg); }
.fin-term.on { background: var(--aa-charcoal); border-color: var(--aa-charcoal); color: var(--aa-porcelain); }
.fin-monthly { display: flex; align-items: baseline; gap: 8px; margin: 20px 0 0; }
.fin-monthly-amt { font-family: var(--aa-serif); font-size: 2.5rem; line-height: 1; color: var(--aa-fg); }
.fin-monthly-unit { font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--aa-fg-3); }
.fin-apr { font-size: 11.5px; line-height: 1.5; color: var(--aa-fg-3); margin: 10px 0 0; }

.fin-steps { list-style: none; padding: 0; margin: 26px 0 0; display: flex; flex-direction: column; gap: 16px; }
.fin-step { display: flex; gap: 16px; align-items: flex-start; }
.fin-step-num { font-family: var(--aa-serif); font-style: italic; font-size: 1.1rem; color: var(--aa-brass);
  line-height: 1.2; flex: none; width: 24px; }
.fin-step-t { font-size: .92rem; color: var(--aa-fg); font-weight: 500; }
.fin-step-d { font-size: .85rem; line-height: 1.55; color: var(--aa-fg-2); margin-top: 3px; }

.fin-cta { width: 100%; justify-content: center; margin-top: 28px; }
.fin-prequal { display: flex; align-items: center; gap: 12px; margin-top: 28px; padding: 16px 18px;
  background: var(--aa-sage-mist); border-radius: 3px; font-size: .9rem; line-height: 1.5; color: var(--aa-charcoal); }
.fin-prequal em { color: var(--aa-stone); font-style: italic; }
.fin-fine { font-size: 10.5px; line-height: 1.5; color: var(--aa-fg-3); margin: 18px 0 0; }

/* ---------- vision board drawer ---------- */
.vb-root { position: fixed; inset: 0; z-index: 1000; pointer-events: none; }
.vb-scrim { position: absolute; inset: 0; background: rgba(27,26,22,.5); opacity: 0;
  transition: opacity .3s var(--aa-ease-out); }
.vb-panel { position: absolute; top: 0; right: 0; height: 100%; width: 420px; max-width: 92vw;
  background: var(--aa-porcelain); display: flex; flex-direction: column;
  box-shadow: -24px 0 60px rgba(27,26,22,.22); transform: translateX(100%);
  transition: transform .36s var(--aa-ease-out); }
.vb-root.open { pointer-events: auto; }
.vb-root.open .vb-scrim { opacity: 1; }
.vb-root.open .vb-panel { transform: none; }

.vb-head { display: flex; align-items: flex-start; justify-content: space-between;
  padding: 26px 28px 20px; border-bottom: 1px solid var(--aa-line); }
.vb-eyebrow { font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--aa-brass); }
.vb-count { font-family: var(--aa-serif); font-size: 1.5rem; color: var(--aa-fg); margin-top: 6px; }
.vb-close { background: none; border: 0; cursor: pointer; color: var(--aa-fg-3); padding: 6px; line-height: 0;
  border-radius: 50%; transition: color var(--aa-dur) var(--aa-ease), background var(--aa-dur) var(--aa-ease); }
.vb-close:hover { color: var(--aa-fg); background: var(--aa-charcoal-08); }

.vb-empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center; gap: 6px; padding: 40px; color: var(--aa-fg-3); }
.vb-empty p { font-family: var(--aa-serif); font-size: 1.3rem; color: var(--aa-fg); margin: 14px 0 0; }
.vb-empty span { font-size: .9rem; line-height: 1.6; color: var(--aa-fg-2); max-width: 30ch; margin-bottom: 18px; }

.vb-list { list-style: none; margin: 0; padding: 10px 28px; overflow-y: auto; flex: 1; }
.vb-item { display: grid; grid-template-columns: 56px 1fr auto auto; align-items: center; gap: 14px;
  padding: 16px 0; border-bottom: 1px solid var(--aa-line); }
.vb-thumb { width: 56px; height: 56px; border: 1px solid var(--aa-line); border-radius: 2px; cursor: pointer;
  padding: 0; overflow: hidden; display: grid; place-items: center; }
.vb-thumb img { width: 86%; height: 86%; object-fit: contain; }
.vb-name { background: none; border: 0; padding: 0; cursor: pointer; font-family: var(--aa-serif);
  font-size: 1.05rem; color: var(--aa-fg); text-align: left; line-height: 1.2; }
.vb-name:hover { color: var(--aa-brass); }
.vb-cat { font-size: 9.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--aa-fg-3); margin-top: 5px; }
.vb-price { font-family: var(--aa-serif); font-size: 1rem; color: var(--aa-fg); white-space: nowrap; }
.vb-price .vb-unit { display: block; font-family: var(--aa-sans); font-size: 8.5px; letter-spacing: .12em;
  text-transform: uppercase; color: var(--aa-fg-3); margin-top: 3px; text-align: right; }
.vb-remove { background: none; border: 0; cursor: pointer; color: var(--aa-fg-3); padding: 5px; line-height: 0;
  border-radius: 50%; transition: color var(--aa-dur) var(--aa-ease), background var(--aa-dur) var(--aa-ease); }
.vb-remove:hover { color: var(--aa-fg); background: var(--aa-charcoal-08); }

.vb-foot { padding: 22px 28px 26px; border-top: 1px solid var(--aa-line-strong); background: var(--aa-ivory-deep); }
.vb-board-note { display: flex; align-items: center; gap: 8px; font-family: var(--aa-sans); font-size: 11px;
  line-height: 1.4; letter-spacing: .01em; color: var(--aa-stone); margin-bottom: 16px; }
.vb-board-note .ico { color: var(--aa-brass); flex: none; }
.vb-total-row { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 14px; }
.vb-total-label { font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: var(--aa-fg-3); }
.vb-total-val { font-family: var(--aa-serif); font-size: 1.9rem; color: var(--aa-fg); }
.vb-foot .fin-line { margin: 0 0 18px; }
.vb-foot .btn { width: 100%; justify-content: center; }
.vb-secondary { display: block; width: 100%; background: none; border: 0; cursor: pointer; margin-top: 12px;
  font-family: var(--aa-sans); font-size: 12px; letter-spacing: .06em; color: var(--aa-fg-2);
  text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--aa-line-strong); }
.vb-secondary:hover { color: var(--aa-brass); }
.vb-fine { font-size: 10.5px; line-height: 1.5; color: var(--aa-fg-3); margin: 16px 0 0; text-align: center; }

@media (max-width: 640px) {
  .vb-panel { width: 100%; max-width: 100%; }
}

/* ============================================================
   INSPO — mood board gallery + editorial boards
   ============================================================ */
.inspo-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 34px 26px; }
.inspo-card-inner { cursor: pointer; }
.inspo-card-fig { position: relative; aspect-ratio: 4 / 5; overflow: hidden; border-radius: 2px; }
.inspo-card-scrim { position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(180deg, rgba(27,26,22,.12) 0%, transparent 36%, rgba(27,26,22,.52) 100%); }
.inspo-card-name { position: absolute; left: 22px; right: 22px; bottom: 30px; z-index: 2; color: #fff;
  font-family: var(--aa-serif); font-weight: 400; font-size: 2rem; line-height: 1.04; letter-spacing: -.01em;
  text-shadow: 0 2px 22px rgba(27,26,22,.4); }
.inspo-card-palette { position: absolute; left: 0; right: 0; bottom: 0; display: flex; height: 12px; z-index: 3; }
.inspo-card-palette span { flex: 1; }
.inspo-card-body { padding-top: 15px; display: flex; flex-direction: column; gap: 11px; align-items: flex-start; }
.inspo-card-tag { font-family: var(--aa-sans); font-size: .8rem; color: var(--aa-fg-2); }
.inspo-card-cta { display: inline-flex; align-items: center; gap: 6px; font-size: 9.5px;
  letter-spacing: .18em; text-transform: uppercase; color: var(--aa-brass);
  transition: gap var(--aa-dur) var(--aa-ease); }
.inspo-card-inner:hover .inspo-card-cta { gap: 11px; }
.inspo-card-inner:hover .inspo-card-name { text-shadow: 0 2px 30px rgba(27,26,22,.55); }

.board-back { margin-bottom: 26px; }
.board-head { display: grid; grid-template-columns: 1.35fr 1fr; gap: 44px; align-items: start; }
.board-palette { display: grid; grid-template-columns: repeat(5, 1fr); gap: 9px; }
.board-sw { aspect-ratio: 3 / 4; border-radius: var(--aa-r-sm); border: 1px solid var(--aa-charcoal-08);
  display: flex; align-items: flex-end; padding: 8px 6px; }
.board-sw span { font-family: var(--aa-sans); font-size: 7.5px; letter-spacing: .04em;
  color: #fff; mix-blend-mode: difference; opacity: .85; }

.board-collage { display: grid; grid-template-columns: 1.6fr 1fr 1fr; grid-template-rows: 196px 196px;
  gap: 16px; margin: 38px 0 46px; }
.board-collage .bc-hero { grid-column: 1; grid-row: 1 / span 2; }
.board-collage .bc-a { grid-column: 2; grid-row: 1; }
.board-collage .bc-b { grid-column: 3; grid-row: 1; }
.board-collage > image-slot { background: var(--aa-sand); overflow: hidden; }
.bc-type { grid-column: 2 / span 2; grid-row: 2; background: var(--aa-charcoal); color: var(--aa-porcelain);
  border-radius: 2px; padding: 22px 26px; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; }
.bc-type-eye { font-family: var(--aa-sans); font-size: 9.5px; letter-spacing: .24em; text-transform: uppercase; color: var(--aa-brass-soft); }
.bc-type-name { font-size: 1.7rem; margin-top: 8px; line-height: 1; }
.bc-type-note { font-family: var(--aa-sans); font-size: .8rem; color: rgba(252,250,244,.66); margin-top: 7px; }
.bc-type-abc { position: absolute; right: 18px; bottom: -14px; font-size: 7rem; line-height: 1; color: rgba(252,250,244,.10); }

.board-cols { display: grid; grid-template-columns: 0.85fr 2fr; gap: 46px; margin-top: 6px; }
.board-florals ul { list-style: none; padding: 0; margin: 12px 0 0; }
.board-florals li { display: flex; align-items: center; gap: 11px; padding: 10px 0; border-bottom: 1px solid var(--aa-line);
  font-family: var(--aa-serif); font-size: 1.05rem; color: var(--aa-fg); }
.fl-dot { width: 9px; height: 9px; border-radius: 999px; flex: none; box-shadow: 0 0 0 3px rgba(0,0,0,.03); }
.board-pgrid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 16px; }

/* ============================================================
   LITTLE THINGS — personalized signage studio
   ============================================================ */
.lt-studio { display: grid; grid-template-columns: 350px 1fr; gap: 38px; align-items: start; }
.lt-controls { display: flex; flex-direction: column; gap: 19px; }
.lt-field { display: flex; flex-direction: column; gap: 8px; }
.lt-field > label { font-family: var(--aa-sans); font-size: 9.5px; letter-spacing: .2em; text-transform: uppercase; color: var(--aa-fg-3); }
.lt-field input, .lt-field textarea { font-family: var(--aa-sans); font-size: .95rem; color: var(--aa-fg);
  background: var(--aa-porcelain); border: 1px solid var(--aa-line); border-radius: var(--aa-r-sm);
  padding: 11px 13px; outline: none; resize: vertical; transition: border-color var(--aa-dur) var(--aa-ease); width: 100%; box-sizing: border-box; }
.lt-field input:focus, .lt-field textarea:focus { border-color: var(--aa-charcoal); }
.lt-seg { display: flex; flex-wrap: wrap; gap: 6px; }
.lt-seg button { font-family: var(--aa-sans); font-size: 10.5px; letter-spacing: .05em; padding: 9px 13px;
  border: 1px solid var(--aa-line); background: transparent; border-radius: var(--aa-r-pill); cursor: pointer;
  color: var(--aa-fg-2); transition: all var(--aa-dur) var(--aa-ease); }
.lt-seg button:hover { border-color: var(--aa-charcoal); color: var(--aa-fg); }
.lt-seg button.on { background: var(--aa-charcoal); color: var(--aa-fg-on-dark); border-color: var(--aa-charcoal); }
.lt-swatches { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.lt-sw { display: flex; align-items: center; gap: 9px; padding: 7px 9px; border: 1px solid var(--aa-line);
  background: transparent; border-radius: var(--aa-r-sm); cursor: pointer; transition: all var(--aa-dur) var(--aa-ease); }
.lt-sw:hover { border-color: var(--aa-charcoal); }
.lt-sw.on { border-color: var(--aa-charcoal); background: var(--aa-porcelain); }
.lt-sw-chip { width: 22px; height: 22px; border-radius: 5px; flex: none; border: 1px solid rgba(0,0,0,.12); }
.lt-sw-lbl { font-family: var(--aa-sans); font-size: 10px; letter-spacing: .03em; color: var(--aa-fg-2); }
.lt-sw-mirror .lt-sw-chip { background: linear-gradient(135deg,#e8e6e0,#b9b3a6 58%,#dcd8cf); }
.lt-sw-clear .lt-sw-chip { background: linear-gradient(135deg, rgba(216,224,224,.65), rgba(196,208,208,.35)); }
.lt-sw-gold .lt-sw-chip { background: linear-gradient(135deg, rgba(214,180,98,.7), rgba(174,148,86,.45)); }
.lt-sw-white .lt-sw-chip { background: #f3efe7; }
.lt-sw-wood .lt-sw-chip { background: linear-gradient(135deg,#c39a67,#9c7748); }
.lt-sw-black .lt-sw-chip { background: linear-gradient(135deg,#2c2b26,#16140f); }
.lt-inks { display: flex; flex-wrap: wrap; gap: 6px; }
.lt-ink { display: inline-flex; align-items: center; gap: 7px; padding: 7px 11px 7px 8px; border: 1px solid var(--aa-line);
  background: transparent; border-radius: var(--aa-r-pill); cursor: pointer; transition: all var(--aa-dur) var(--aa-ease); }
.lt-ink:hover { border-color: var(--aa-charcoal); }
.lt-ink.on { border-color: var(--aa-charcoal); background: var(--aa-porcelain); }
.lt-ink-dot { width: 16px; height: 16px; border-radius: 50%; border: 1px solid rgba(0,0,0,.16); flex: none; }
.lt-ink-lbl { font-family: var(--aa-sans); font-size: 10.5px; letter-spacing: .03em; color: var(--aa-fg-2); }
.lt-seg-dim { opacity: .55; font-size: 9px; letter-spacing: .04em; }
.lt-size-badge { position: absolute; top: 16px; right: 16px; z-index: 3; font-family: var(--aa-sans); font-size: 9.5px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--aa-fg-3); background: var(--aa-porcelain);
  border: 1px solid var(--aa-line); border-radius: var(--aa-r-pill); padding: 6px 11px; }

.lt-stage { position: relative; background: linear-gradient(168deg, var(--aa-sand), var(--aa-ivory-deep));
  border: 1px solid var(--aa-line); border-radius: var(--aa-r-md); min-height: 560px;
  display: flex; align-items: center; justify-content: center; padding: 44px; overflow: hidden; }
.lt-stage-foot { position: absolute; bottom: 14px; left: 0; right: 0; text-align: center; font-family: var(--aa-sans);
  font-size: 9.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--aa-fg-3);
  display: inline-flex; align-items: center; justify-content: center; gap: 6px; }

.sign { position: relative; width: 330px; max-width: 100%; aspect-ratio: 3 / 4; border-radius: 5px;
  display: flex; align-items: center; justify-content: center; padding: 34px 30px; overflow: hidden;
  box-shadow: 0 32px 60px -24px rgba(27,26,22,.55); transition: background var(--aa-dur) var(--aa-ease), transform var(--aa-dur) var(--aa-ease); }
.sign.sz-sm { transform: scale(.86); }
.sign.sz-lg { transform: scale(1.12); }
.sign-face { position: relative; z-index: 2; text-align: center; width: 100%; }
.sign-sheen { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.sub-mirror { background: linear-gradient(135deg,#d8d4cc 0%,#bdb7ab 38%,#ece8df 52%,#b1ab9f 72%,#cecabf 100%); color: #2c2b26; }
.sub-mirror .sign-sheen { background: linear-gradient(118deg, transparent 32%, rgba(255,255,255,.5) 46%, transparent 58%); }
.sub-mirror .sign-face { text-shadow: 0 1px 0 rgba(255,255,255,.45); }
.sub-clear { background: linear-gradient(135deg, rgba(220,228,228,.4), rgba(190,202,202,.22)); border: 1px solid rgba(255,255,255,.55); color: #30302a; }
.sub-clear .sign-sheen { background: linear-gradient(120deg, transparent 40%, rgba(255,255,255,.4) 50%, transparent 60%); }
.sub-gold { background: linear-gradient(135deg, rgba(214,180,98,.5), rgba(174,148,86,.34)); border: 1px solid rgba(214,180,98,.6); color: #443710; }
.sub-gold .sign-sheen { background: linear-gradient(120deg, transparent 40%, rgba(255,246,222,.5) 50%, transparent 60%); }
.sub-white { background: #f4f0e8; color: #2c2b26; border: 1px solid rgba(0,0,0,.06); }
.sub-wood { background: linear-gradient(135deg,#c1a070,#9c7748 55%,#cdab78); color: #322a1e; }
.sub-wood .sign-sheen { background: linear-gradient(120deg, transparent 42%, rgba(255,240,210,.28) 50%, transparent 60%); }
.sub-black { background: linear-gradient(135deg,#2c2b26,#1a1915 60%,#34322b); color: #f3efe7; }
.sub-black .sign-sheen { background: linear-gradient(118deg, transparent 38%, rgba(255,255,255,.14) 48%, transparent 60%); }

.sign-eyebrow { font-family: var(--aa-sans); font-size: 9.5px; letter-spacing: .26em; text-transform: uppercase; opacity: .72; }
.sign-names { font-family: var(--aa-serif); font-weight: 400; font-size: 2.4rem; line-height: 1.05; margin-top: 14px; letter-spacing: -.01em; }
.sign-names.sm { font-size: 1.7rem; }
.sign-rule { width: 44px; height: 1px; background: currentColor; opacity: .4; margin: 16px auto; }
.sign-date { font-family: var(--aa-sans); font-size: 10.5px; letter-spacing: .24em; }
.sign-phrase { font-family: var(--aa-serif); font-style: italic; font-size: 1rem; line-height: 1.5; margin-top: 14px; opacity: .92; }
.sign-tableno { font-family: var(--aa-serif); font-size: 5.2rem; line-height: 1; margin: 8px 0; }
.kind-table .sign-phrase { font-style: normal; font-family: var(--aa-sans); font-size: 11px; letter-spacing: .3em; text-transform: uppercase; opacity: .7; }
.sign-seatlist, .sign-menulist { margin-top: 16px; display: flex; flex-direction: column; gap: 11px; text-align: left; }
.sign-seatrow, .sign-menurow { display: flex; flex-direction: column; gap: 2px; }
.sign-seatrow .st, .sign-menurow .mc { font-family: var(--aa-serif); font-size: .95rem; }
.sign-seatrow .sw, .sign-menurow .md { font-family: var(--aa-sans); font-size: 9px; letter-spacing: .04em; opacity: .72; }
/* lettering variants */
.sty-italic .sign-names { font-style: italic; }
.sty-caps .sign-names { font-family: var(--aa-sans); text-transform: uppercase; letter-spacing: .14em; font-weight: 500; font-size: 1.8rem; }
.sty-caps .sign-names.sm { font-size: 1.3rem; }
.sty-caps .sign-phrase { font-family: var(--aa-sans); font-style: normal; font-size: .78rem; letter-spacing: .05em; }

.lt-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px 26px; }
.lt-card h3 { font-family: var(--aa-serif); font-weight: 400; font-size: 1.35rem; margin-top: 2px; }
.lt-card-sub { font-family: var(--aa-sans); font-size: .82rem; color: var(--aa-fg-2); margin-top: 4px; }
.lt-card-row { display: flex; justify-content: space-between; align-items: center; margin-top: 13px; padding-top: 12px; border-top: 1px solid var(--aa-line); }
.lt-card-row .price { font-family: var(--aa-serif); font-size: 1.05rem; }
.lt-card-row .from { font-family: var(--aa-sans); font-size: 8.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--aa-fg-3); margin-right: 5px; }
.lt-card-row .unit { font-family: var(--aa-sans); font-size: 8.5px; color: var(--aa-fg-3); }

/* ---------- responsive: inspo + little things + nav dropdown ---------- */
@media (max-width: 980px) {
  .inspo-grid { grid-template-columns: repeat(2, 1fr); }
  .lt-grid { grid-template-columns: repeat(2, 1fr); }
  .board-head { grid-template-columns: 1fr; gap: 28px; }
  .board-cols { grid-template-columns: 1fr; gap: 32px; }
  .board-collage { grid-template-columns: 1fr 1fr; grid-template-rows: 200px 160px 160px; }
  .board-collage .bc-hero { grid-column: 1 / span 2; grid-row: 1; }
  .board-collage .bc-a { grid-column: 1; grid-row: 2; }
  .board-collage .bc-b { grid-column: 2; grid-row: 2; }
  .bc-type { grid-column: 1 / span 2; grid-row: 3; }
  .lt-studio { grid-template-columns: 1fr; gap: 28px; }
  .lt-stage { min-height: 480px; }
}
@media (max-width: 600px) {
  .inspo-grid { grid-template-columns: 1fr; gap: 30px; }
  .lt-grid { grid-template-columns: 1fr; gap: 28px; }
  .board-pgrid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .board-palette { grid-template-columns: repeat(5, 1fr); }
  /* nav dropdown collapses inline within the mobile menu */
  .navlink-wrap { display: block; width: 100%; }
  .navlink-wrap .navlink { width: 100%; justify-content: flex-start; }
  .nav-caret { display: none; }
  .navmenu { position: static; transform: none !important; opacity: 1; pointer-events: auto; box-shadow: none;
    border: 0; background: transparent; padding: 2px 0 8px 16px; margin: 0; min-width: 0; }
  .navmenu::before { display: none; }
  .navmenu-item { padding: 12px 0; border-bottom: 1px solid var(--aa-line); text-transform: none;
    font-family: var(--aa-serif); font-size: 13px; letter-spacing: .02em; font-weight: 400; }
  .navmenu-sub { position: static; opacity: 1; pointer-events: auto; transform: none !important; box-shadow: none;
    border: 0; background: transparent; margin: 0; padding: 0 0 0 18px; min-width: 0; }
  .navmenu-sub::before { display: none; }
  .navmenu-caret { transform: rotate(90deg); }
}

/* ============================================================
   ATELIER CONCIERGE
   ============================================================ */
.conc-services { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.conc-svc { padding-top: 22px; border-top: 1px solid var(--aa-line-strong); }
.conc-svc-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.conc-svc-ic { color: var(--aa-brass); display: inline-flex; }
.conc-svc-num { font-family: var(--aa-sans); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: var(--aa-brass); }
.conc-svc h3 { font-family: var(--aa-serif); font-weight: 400; font-size: 1.5rem; letter-spacing: -.01em; }
.conc-svc p { font-family: var(--aa-sans); font-size: .92rem; line-height: 1.6; color: var(--aa-fg-2); margin: 10px 0 0; max-width: 34ch; }

.conc-scope { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.conc-col { padding: 30px 32px; border-radius: var(--aa-r-md); border: 1px solid var(--aa-line); }
.conc-col.is-do { background: var(--aa-porcelain); }
.conc-col-h { display: inline-flex; align-items: center; gap: 9px; font-family: var(--aa-sans); font-size: 11px;
  letter-spacing: .16em; text-transform: uppercase; color: var(--aa-fg-2); margin-bottom: 16px; }
.conc-col.is-do .conc-col-h, .conc-col.is-do .conc-col-h .ico { color: var(--aa-sage-deep); }
.conc-col.is-dont .conc-col-h, .conc-col.is-dont .conc-col-h .ico { color: var(--aa-taupe-deep); }
.conc-col ul { list-style: none; padding: 0; margin: 0; }
.conc-col li { font-family: var(--aa-serif); font-size: 1.08rem; color: var(--aa-fg); padding: 11px 0; border-bottom: 1px solid var(--aa-line); }
.conc-col li:last-child { border-bottom: 0; }
.conc-note { font-family: var(--aa-sans); font-size: .85rem; line-height: 1.6; color: var(--aa-fg-3); margin: 18px 0 0; }
.conc-note .tlink { letter-spacing: .02em; text-transform: none; font-size: .85rem; font-family: var(--aa-sans); color: var(--aa-brass); }

.conc-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; }
.conc-step-num { font-family: var(--aa-serif); font-size: 1.5rem; color: var(--aa-brass); }
.conc-step h4 { font-family: var(--aa-serif); font-weight: 400; font-size: 1.2rem; margin: 10px 0 0; }
.conc-step p { font-family: var(--aa-sans); font-size: .88rem; line-height: 1.6; color: var(--aa-fg-2); margin-top: 8px; }

@media (max-width: 980px) {
  .conc-services { grid-template-columns: 1fr; gap: 28px; }
  .conc-scope { grid-template-columns: 1fr; }
  .conc-steps { grid-template-columns: 1fr 1fr; gap: 24px; }
}
@media (max-width: 560px) {
  .conc-steps { grid-template-columns: 1fr; }
}

/* ============================================================
   HOME — "in our words" lexicon
   ============================================================ */
.lexicon { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.lex { cursor: pointer; padding: 30px 30px 26px; border: 1px solid var(--aa-line); border-radius: var(--aa-r-md);
  background: var(--aa-porcelain); transition: border-color var(--aa-dur) var(--aa-ease), transform var(--aa-dur) var(--aa-ease), box-shadow var(--aa-dur) var(--aa-ease); }
.lex:hover { border-color: var(--aa-line-strong); transform: translateY(-3px); box-shadow: var(--aa-shadow-md); }
.lex-word { font-family: var(--aa-serif); font-weight: 400; font-size: 1.7rem; letter-spacing: -.01em; display: flex; align-items: baseline; gap: 10px; }
.lex-pos { font-family: var(--aa-serif); font-style: italic; font-size: .9rem; color: var(--aa-taupe-deep); }
.lex-phon { font-family: var(--aa-sans); font-size: 11px; letter-spacing: .12em; color: var(--aa-fg-3); margin-top: 6px; }
.lex-def { font-family: var(--aa-serif); font-size: 1.02rem; line-height: 1.55; color: var(--aa-fg-2); margin: 16px 0 0; }
.lex-cta { display: inline-flex; align-items: center; gap: 6px; margin-top: 18px; font-family: var(--aa-sans);
  font-size: 9.5px; letter-spacing: .18em; text-transform: uppercase; color: var(--aa-brass); transition: gap var(--aa-dur) var(--aa-ease); }
.lex:hover .lex-cta { gap: 11px; }
@media (max-width: 900px) { .lexicon { grid-template-columns: 1fr; gap: 18px; } }

/* ============================================================
   MOOD BOARD builder
   ============================================================ */
.mb-topbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.mb-title { font-family: var(--aa-serif); font-size: 1.5rem; color: var(--aa-fg); background: transparent;
  border: 0; border-bottom: 1px solid transparent; padding: 4px 2px; outline: none; min-width: 240px; }
.mb-title:hover, .mb-title:focus { border-bottom-color: var(--aa-line-strong); }
.mb-topbar-actions { display: flex; align-items: center; gap: 16px; }
.mb-textbtn { background: none; border: 0; cursor: pointer; font-family: var(--aa-sans); font-size: 11px;
  letter-spacing: .1em; text-transform: uppercase; color: var(--aa-fg-2); }
.mb-textbtn:hover { color: var(--aa-fg); }

.mb-grid { display: grid; grid-template-columns: 264px 1fr 304px; border: 1px solid var(--aa-line);
  border-radius: var(--aa-r-md); overflow: hidden; background: var(--aa-porcelain); min-height: 620px; box-shadow: var(--aa-shadow-md); }

.mb-rail { border-right: 1px solid var(--aa-line); display: flex; flex-direction: column; min-height: 0; }
.mb-tabs { display: flex; border-bottom: 1px solid var(--aa-line); }
.mb-tabs button { flex: 1; padding: 13px 4px; background: none; border: 0; cursor: pointer; font-family: var(--aa-sans);
  font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--aa-fg-2); border-bottom: 2px solid transparent; }
.mb-tabs button.on { color: var(--aa-fg); border-bottom-color: var(--aa-brass); }
.mb-rail-body { padding: 16px; overflow-y: auto; max-height: 580px; }
.mb-filter { display: flex; flex-wrap: wrap; gap: 5px; margin-bottom: 14px; }
.mb-filter button { font-size: 9px; letter-spacing: .04em; padding: 6px 9px; border: 1px solid var(--aa-line);
  background: transparent; border-radius: 999px; cursor: pointer; color: var(--aa-fg-2); }
.mb-filter button.on { background: var(--aa-charcoal); color: var(--aa-porcelain); border-color: var(--aa-charcoal); }
.mb-srcgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.mb-src { display: flex; flex-direction: column; gap: 6px; padding: 6px; border: 1px solid var(--aa-line);
  border-radius: var(--aa-r-sm); background: transparent; cursor: pointer; transition: border-color var(--aa-dur) var(--aa-ease); text-align: left; }
.mb-src:hover { border-color: var(--aa-charcoal); }
.mb-src-fig { aspect-ratio: 1 / 1; border-radius: 3px; display: grid; place-items: center; overflow: hidden; }
.mb-src-fig img { width: 88%; height: 88%; object-fit: contain; }
.mb-src-nm { font-size: 9px; letter-spacing: .02em; color: var(--aa-fg-2); line-height: 1.25; }

.mb-pallist { display: flex; flex-direction: column; gap: 9px; }
.mb-palbtn { display: flex; flex-direction: column; gap: 7px; padding: 8px; border: 1px solid var(--aa-line);
  border-radius: var(--aa-r-sm); cursor: pointer; background: transparent; }
.mb-palbtn:hover { border-color: var(--aa-charcoal); }
.mb-palbtn-row { display: flex; height: 22px; border-radius: 3px; overflow: hidden; }
.mb-palbtn-row span { flex: 1; }
.mb-palbtn-nm { font-size: 10px; letter-spacing: .04em; color: var(--aa-fg-2); text-align: left; }

.mb-littlelist { display: flex; flex-direction: column; gap: 7px; }
.mb-littlebtn { display: flex; align-items: center; gap: 10px; padding: 11px 34px 11px 11px; border: 1px solid var(--aa-line);
  border-radius: var(--aa-r-sm); cursor: pointer; background: transparent; color: var(--aa-brass); position: relative; text-align: left; }
.mb-littlebtn:hover { border-color: var(--aa-charcoal); }
.mb-littlebtn > span { display: flex; flex-direction: column; }
.mb-littlebtn .nm { font-family: var(--aa-serif); font-size: .95rem; color: var(--aa-fg); }
.mb-littlebtn .sub { font-size: 9px; letter-spacing: .04em; color: var(--aa-fg-3); }
.mb-add-plus { position: absolute; right: 10px; color: var(--aa-fg-3); }

.mb-upload { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  padding: 36px 18px; border: 1.5px dashed var(--aa-line-strong); border-radius: var(--aa-r-md); cursor: pointer;
  color: var(--aa-fg-2); text-align: center; }
.mb-upload:hover { border-color: var(--aa-brass); color: var(--aa-fg); }
.mb-upload-t { font-family: var(--aa-serif); font-size: 1.05rem; color: var(--aa-fg); }
.mb-upload-s { font-size: 11px; color: var(--aa-fg-3); }

.mb-stage { position: relative; background: var(--aa-ivory); overflow: hidden; touch-action: none;
  background-image: radial-gradient(circle at 50% 30%, rgba(252,250,244,.7), transparent 70%); }
.mb-item { position: absolute; cursor: grab; user-select: none; touch-action: none; will-change: transform; }
.mb-item:active { cursor: grabbing; }
.mb-item.sel::after { content: ""; position: absolute; inset: -5px; border: 2px solid var(--aa-charcoal);
  border-radius: 7px; pointer-events: none; }
.mb-it-piece, .mb-it-pal { width: 100%; height: 100%; display: flex; flex-direction: column; }
.mb-it-fig { flex: 1; border-radius: 4px; overflow: hidden; display: grid; place-items: center; box-shadow: var(--aa-shadow-sm); }
.mb-it-fig img { width: 90%; height: 90%; object-fit: contain; }
.mb-it-fig img.mono { width: 40%; opacity: .18; }
.mb-it-cap { font-family: var(--aa-sans); font-size: 8.5px; letter-spacing: .06em; text-transform: uppercase;
  color: var(--aa-fg-2); text-align: center; margin-top: 6px; }
.mb-it-photo { width: 100%; height: 100%; border-radius: 4px; overflow: hidden; box-shadow: var(--aa-shadow-sm); background: #fff; }
.mb-it-photo img { width: 100%; height: 100%; object-fit: cover; }
.mb-it-pal-row { display: flex; height: 100%; border-radius: 4px; overflow: hidden; box-shadow: var(--aa-shadow-sm); }
.mb-it-pal { gap: 0; }
.mb-it-pal .mb-it-pal-row { height: calc(100% - 20px); }
.mb-it-pal-row span { flex: 1; }
.mb-it-little { width: 100%; height: 100%; border-radius: 4px; background: var(--aa-porcelain); border: 1px solid var(--aa-line);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; color: var(--aa-brass); box-shadow: var(--aa-shadow-sm); }
.mb-it-little span { font-family: var(--aa-serif); font-size: .9rem; color: var(--aa-fg); }

.mb-tools { position: absolute; top: -38px; left: 50%; transform: translateX(-50%); display: flex; gap: 2px;
  background: var(--aa-charcoal); border-radius: 999px; padding: 4px; box-shadow: var(--aa-shadow-md); z-index: 60; }
.mb-tools button { width: 26px; height: 26px; border: 0; background: none; color: var(--aa-porcelain); cursor: pointer;
  border-radius: 999px; display: grid; place-items: center; }
.mb-tools button:hover { background: rgba(252,250,244,.18); }
.mb-empty { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; pointer-events: none; }

.mb-wish { border-left: 1px solid var(--aa-line); display: flex; flex-direction: column; padding: 18px; gap: 14px; background: var(--aa-ivory-deep); }
.mb-wish-title { font-family: var(--aa-serif); font-size: 1.25rem; margin-top: 4px; }
.mb-req { display: flex; flex-direction: column; gap: 8px; }
.mb-req textarea { font-family: var(--aa-sans); font-size: .85rem; color: var(--aa-fg); background: var(--aa-porcelain);
  border: 1px solid var(--aa-line); border-radius: var(--aa-r-sm); padding: 10px; outline: none; resize: vertical; }
.mb-req textarea:focus { border-color: var(--aa-charcoal); }
.mb-req-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 11px;
  border: 1px solid var(--aa-charcoal); background: var(--aa-charcoal); color: var(--aa-porcelain); border-radius: var(--aa-r-pill);
  cursor: pointer; font-family: var(--aa-sans); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.mb-req-btn:hover { background: var(--aa-ink); }
.mb-wishlist { display: flex; flex-direction: column; gap: 8px; overflow-y: auto; }
.mb-wish-empty { font-size: .85rem; color: var(--aa-fg-3); font-style: italic; }
.mb-wish-item { display: flex; align-items: center; gap: 9px; padding: 10px 11px; background: var(--aa-porcelain);
  border: 1px solid var(--aa-line); border-radius: var(--aa-r-sm); font-size: .85rem; color: var(--aa-fg); }
.mb-wish-item > span { flex: 1; line-height: 1.4; }
.mb-wish-item > button { background: none; border: 0; cursor: pointer; color: var(--aa-fg-3); padding: 2px; line-height: 0; }
.mb-wish-item > button:hover { color: var(--aa-fg); }
.mb-wish-item > .ico:first-child { color: var(--aa-brass); }

.mb-foot { display: flex; justify-content: space-between; align-items: center; gap: 18px; margin-top: 20px; flex-wrap: wrap; }

@media (max-width: 1100px) {
  .mb-grid { grid-template-columns: 240px 1fr; }
  .mb-wish { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--aa-line); }
}
@media (max-width: 760px) {
  .mb-grid { grid-template-columns: 1fr; }
  .mb-rail { border-right: 0; border-bottom: 1px solid var(--aa-line); }
  .mb-rail-body { max-height: 320px; }
  .mb-stage { min-height: 440px; }
}

/* attached mood board in the consult form */
.consult-board { background: rgba(252,250,244,.06); border: 1px solid rgba(252,250,244,.18); border-radius: var(--aa-r-md); padding: 22px 24px; }
.cb-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.cb-eye { display: inline-flex; align-items: center; gap: 8px; font-family: var(--aa-sans); font-size: 10px;
  letter-spacing: .18em; text-transform: uppercase; color: var(--aa-brass-soft); }
.cb-view { background: none; border: 0; cursor: pointer; color: var(--aa-fg-on-dark-2); font-family: var(--aa-sans);
  font-size: 11px; letter-spacing: .04em; text-decoration: underline; text-underline-offset: 3px; }
.cb-view:hover { color: var(--aa-porcelain); }
.cb-title { color: var(--aa-porcelain); font-size: 1.3rem; margin-top: 8px; }
.cb-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; }
.cb-chip { font-family: var(--aa-sans); font-size: 11px; letter-spacing: .02em; color: var(--aa-porcelain); white-space: nowrap;
  background: rgba(252,250,244,.08); border: 1px solid rgba(252,250,244,.18); border-radius: 999px; padding: 6px 12px; }
.cb-source { margin-top: 16px; padding-top: 14px; border-top: 1px solid rgba(252,250,244,.14); }
.cb-source-h { font-family: var(--aa-sans); font-size: 10px; letter-spacing: .18em; text-transform: uppercase; color: var(--aa-fg-on-dark-2); margin-bottom: 8px; }
.cb-source ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.cb-source li { font-family: var(--aa-serif); font-style: italic; font-size: .95rem; color: rgba(252,250,244,.86); padding-left: 16px; position: relative; }
.cb-source li::before { content: "—"; position: absolute; left: 0; color: var(--aa-brass-soft); }

/* ============================================================
   FAQ — accordion
   ============================================================ */
.faq-wrap { max-width: 1000px; margin: 0 auto; }
.faq-groups { display: flex; flex-direction: column; gap: 52px; }
.faq-group { display: grid; grid-template-columns: 0.42fr 1fr; gap: 38px; align-items: start; }
.faq-group .fg-label { position: sticky; top: 116px; }
.faq-group .fg-num { font-family: var(--aa-serif); font-style: italic; font-size: 1.3rem; color: var(--aa-brass); line-height: 1; }
.faq-group .fg-name { font-family: var(--aa-serif); font-weight: 400; font-size: 1.55rem; letter-spacing: -.01em; margin: 9px 0 0; line-height: 1.08; }
.faq-list { border-top: 1px solid var(--aa-line-strong); }
.faq-item { border-bottom: 1px solid var(--aa-line); }
.faq-q { width: 100%; background: none; border: 0; text-align: left; cursor: pointer; display: flex;
  align-items: flex-start; justify-content: space-between; gap: 24px; padding: 21px 2px;
  font-family: var(--aa-serif); font-weight: 400; font-size: 1.16rem; color: var(--aa-ink); line-height: 1.32;
  transition: color var(--aa-dur) var(--aa-ease); }
.faq-q:hover { color: var(--aa-brass); }
.faq-q .pm { flex: none; width: 20px; height: 20px; position: relative; margin-top: 5px; }
.faq-q .pm::before, .faq-q .pm::after { content: ''; position: absolute; background: var(--aa-brass);
  transition: transform var(--aa-dur) var(--aa-ease); }
.faq-q .pm::before { top: 9px; left: 1px; right: 1px; height: 1.5px; }
.faq-q .pm::after { left: 9px; top: 1px; bottom: 1px; width: 1.5px; }
.faq-item.open .faq-q .pm::after { transform: scaleY(0); }
.faq-a { overflow: hidden; max-height: 0; transition: max-height var(--aa-dur) var(--aa-ease-out); }
.faq-a-inner { padding: 0 40px 22px 2px; font-size: .96rem; line-height: 1.72; color: var(--aa-fg-2); }
.faq-a-inner a { color: var(--aa-brass); cursor: pointer; text-decoration: underline; text-underline-offset: 3px;
  text-decoration-color: rgba(174,148,86,.5); transition: text-decoration-color var(--aa-dur) var(--aa-ease); }
.faq-a-inner a:hover { text-decoration-color: var(--aa-brass); }
@media (max-width: 860px) {
  .faq-group { grid-template-columns: 1fr; gap: 16px; }
  .faq-group .fg-label { position: static; }
}

/* ============================================================
   CONTACT — consolidated info + check-your-date
   ============================================================ */
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.contact-rows { display: flex; flex-direction: column; }
.crow { display: grid; grid-template-columns: 132px 1fr; gap: 20px; padding: 19px 0;
  border-bottom: 1px solid var(--aa-line); align-items: baseline; }
.crow:first-child { border-top: 1px solid var(--aa-line-strong); }
.crow .ck { font-size: 10px; letter-spacing: .22em; text-transform: uppercase; color: var(--aa-fg-3); padding-top: 5px; }
.crow .cv { font-family: var(--aa-serif); font-size: 1.32rem; color: var(--aa-ink); line-height: 1.3; }
.crow .cv a { color: var(--aa-ink); text-decoration: none; border-bottom: 1px solid var(--aa-line-strong);
  transition: border-color var(--aa-dur) var(--aa-ease); }
.crow .cv a:hover { border-color: var(--aa-brass); }
.crow .cs { display: block; font-family: var(--aa-sans); font-size: .82rem; font-weight: 300;
  color: var(--aa-fg-2); margin-top: 6px; line-height: 1.5; }
.checkdate { background: var(--aa-porcelain); border: 1px solid var(--aa-line); padding: 34px 32px 32px; border-radius: var(--aa-r-sm); }
.checkdate.tone { background: var(--aa-sand); }
.cfield { display: flex; flex-direction: column; gap: 8px; }
.cfield .clab { font-size: 10px; letter-spacing: .2em; text-transform: uppercase; color: var(--aa-fg-3); }
.cfield input { font-family: var(--aa-sans); font-size: 15px; font-weight: 300; color: var(--aa-ink);
  background: transparent; border: 0; border-bottom: 1px solid var(--aa-charcoal-45); padding: 9px 2px;
  outline: none; transition: border-color var(--aa-dur) var(--aa-ease); }
.cfield input:focus { border-color: var(--aa-brass); }
.cfield input::placeholder { color: var(--aa-taupe); }

/* ----- elevated "send us a note" card ----- */
.note-card {
  position: relative;
  background: var(--aa-porcelain);
  border: 1px solid var(--aa-line);
  border-radius: var(--aa-r-sm);
  box-shadow: var(--aa-shadow-lg);
  padding: 42px 40px 36px;
  overflow: hidden;
}
/* brass hairline crowning the card */
.note-card::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px;
  background: var(--aa-brass);
}
/* oversized monogram, bled off the top-right as a watermark */
.note-card .note-mono {
  position: absolute; top: -34px; right: -30px; width: 188px; height: auto;
  opacity: .05; pointer-events: none; user-select: none;
}
.note-head { position: relative; margin-bottom: 30px; }
.note-head .rule { margin-top: 16px; }
.note-card .cfield input,
.note-card .cfield textarea { border-bottom-color: var(--aa-line-strong); }
/* reassurance row under the send button */
.note-assure {
  display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
  margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--aa-line);
  font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--aa-fg-3);
}
.note-assure .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--aa-brass); }

@media (max-width: 860px) {
  .contact-grid { grid-template-columns: 1fr; gap: 40px; }
}
@media (max-width: 560px) {
  .note-card form { grid-template-columns: 1fr !important; }
}

/* footer legal links */
.ftr-legal { display: inline-flex; gap: 18px; flex-wrap: wrap; }
.ftr-legal a { color: var(--aa-fg-on-dark-2); text-decoration: none; cursor: pointer;
  font-size: 11px; letter-spacing: .08em; transition: color var(--aa-dur) var(--aa-ease); }
.ftr-legal a:hover { color: var(--aa-porcelain); }