/* The Frame Fatale — redesign mockup. Fonts are the site's own (Trend Polaroid Serif/Script, Avenir Light, Caudex). */
@font-face{font-family:"Trend Polaroid Serif";src:url(assets/fonts/trend-polaroid-serif.woff2) format("woff2"),url(assets/fonts/trend-polaroid-serif.woff) format("woff");font-display:swap}
@font-face{font-family:"Trend Polaroid Script";src:url(assets/fonts/trend-polaroid-script.woff2) format("woff2"),url(assets/fonts/trend-polaroid-script.woff) format("woff");font-display:swap}
@font-face{font-family:"Avenir Light";src:url(assets/fonts/avenir-light.woff2) format("woff2");font-display:swap}
@font-face{font-family:"Caudex";src:url(assets/fonts/caudex-regular.ttf) format("truetype");font-display:swap}
@font-face{font-family:"Caudex";font-style:italic;src:url(assets/fonts/caudex-italic.ttf) format("truetype");font-display:swap}

:root{
  --oxblood:#3b0510;--blood:#6D0504;--brand:#710101;--umber:#221516;--ink:#0c0708;
  --ivory:#f4f4f1;--greige:#e1dbd7;--gold:#c9a96a;--pearl:#efe9df;
  --serif:"Trend Polaroid Serif","Bodoni Moda",serif;
  --script:"Trend Polaroid Script","Pinyon Script",cursive;
  --body:"Avenir Light","Avenir",system-ui,sans-serif;
  --lit:"Caudex",Georgia,serif;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--body);font-weight:300;color:var(--ivory);background:var(--ink);font-size:17px;line-height:1.85;letter-spacing:.01em;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}

/* ---------- film grain (fixed) ---------- */
.grain{position:fixed;inset:-50%;width:200%;height:200%;pointer-events:none;z-index:90;opacity:.11;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 1.4 -.2'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

/* ---------- textures ---------- */
.stardust{background-color:var(--ink);background-image:url(assets/tex/stardust.png);background-size:420px}
.stardust.umber{background-color:var(--umber)}
.silk{background:var(--oxblood) url(assets/tex/silk.jpg) center/cover}
.paper{background:var(--ivory) url(assets/tex/paper.jpg);color:#2a1a1b}
.greige{background:var(--greige);color:#2a1a1b}
.twinkle{position:absolute;inset:0;background:url(assets/tex/stardust.png) 140px 90px/600px;opacity:.5;animation:tw 7s ease-in-out infinite alternate;pointer-events:none}
@keyframes tw{from{opacity:.15}to{opacity:.7}}

/* ---------- type ---------- */
.label{font-family:var(--serif);font-size:13px;letter-spacing:.42em;text-transform:uppercase;display:inline-flex;align-items:center;gap:16px}
.label::before{content:"";width:42px;height:1px;background:currentColor;opacity:.6}
.label.center::after{content:"";width:42px;height:1px;background:currentColor;opacity:.6}
.display{font-family:var(--serif);text-transform:uppercase;font-weight:400;line-height:.92;letter-spacing:.02em}
.script{font-family:var(--script);font-weight:400;line-height:1}
.lit{font-family:var(--lit);font-style:italic;font-weight:400}
.red{color:var(--brand)}
p+p{margin-top:1.1em}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:14px;font-family:var(--serif);font-size:14px;letter-spacing:.34em;text-transform:uppercase;padding:18px 34px;border:1px solid currentColor;position:relative;overflow:hidden;transition:color .6s var(--ease)}
.btn::before{content:"";position:absolute;inset:0;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .7s var(--ease);z-index:-1}
.btn span{position:relative}
.btn:hover::before{transform:scaleX(1);transform-origin:left}
.btn.light:hover{color:var(--oxblood)}
.btn.light::before{background:var(--ivory)}
.btn.dark{color:var(--oxblood)}
.btn.dark::before{background:var(--oxblood)}
.btn.dark:hover{color:var(--ivory)}
.btn .arr{width:30px;height:1px;background:currentColor;position:relative}
.btn .arr::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg)}
.btn{isolation:isolate}

/* ---------- loader (black + red Frame logo) ---------- */
.loader{position:fixed;inset:0;background:#000;z-index:200;display:grid;place-items:center;transition:opacity 1.1s var(--ease),visibility 1.1s}
.loader img{width:min(300px,62vw);opacity:0;animation:lf 1.6s var(--ease) .15s forwards}
@keyframes lf{from{opacity:0;transform:scale(.97);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
.loaded .loader{opacity:0;visibility:hidden}

/* ---------- nav ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:80;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:26px 52px;transition:background .6s,padding .6s,border-color .6s;border-bottom:1px solid transparent}
.nav ul{list-style:none;display:flex;gap:40px;font-family:var(--serif);font-size:13px;letter-spacing:.36em;text-transform:uppercase}
.nav ul.r{justify-content:flex-end}
.nav a{position:relative;padding:4px 0}
.nav ul a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:1px;background:currentColor;transition:right .5s var(--ease)}
.nav ul a:hover::after{right:.36em}
.nav .mark{opacity:0;transform:translateY(-6px);transition:.6s var(--ease)}
.nav .mark img{height:46px;width:auto}
.nav.scrolled{background:rgba(12,7,8,.82);backdrop-filter:blur(10px);padding:14px 52px;border-color:rgba(244,244,241,.08)}
.nav.scrolled .mark{opacity:1;transform:none}
.nav .inq{border:1px solid rgba(244,244,241,.55);padding:9px 18px}
.burger{display:none;background:none;border:0;color:var(--ivory);font-family:var(--serif);letter-spacing:.36em;font-size:13px;cursor:pointer;justify-self:end}
.menu{position:fixed;inset:0;z-index:79;background:var(--oxblood) url(assets/tex/silk.jpg) center/cover;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:22px;opacity:0;visibility:hidden;transition:.6s var(--ease)}
.menu a{font-family:var(--serif);font-size:44px;letter-spacing:.08em;text-transform:uppercase}
.menu.open{opacity:1;visibility:visible}

/* ---------- hero ---------- */
.hero{position:relative;height:100vh;min-height:640px;overflow:hidden;display:grid;place-items:center;text-align:center}
.hero .bg{position:absolute;inset:0;filter:brightness(1.18) contrast(1.04);background-size:cover;background-position:center 38%;transform:scale(1.12);opacity:0;transition:opacity 2.2s var(--ease),transform 9s linear}
.hero .bg.on{opacity:1;transform:scale(1.02)}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 50% 46%,rgba(12,7,8,.05) 0%,rgba(12,7,8,.38) 58%,rgba(12,7,8,.85) 100%),linear-gradient(180deg,rgba(12,7,8,.5),transparent 20%,transparent 72%,rgba(12,7,8,.95))}
.hero .mat{position:absolute;inset:24px;border:1px solid rgba(244,244,241,.22);z-index:2;pointer-events:none}
.hero .mat::before{content:"";position:absolute;inset:6px;border:1px solid rgba(244,244,241,.08)}
.hero .inner{position:relative;z-index:3;display:flex;flex-direction:column;align-items:center}
.hero .logo{width:min(720px,78vw);filter:drop-shadow(0 10px 40px rgba(0,0,0,.55))}
.hero .tag{font-family:var(--script);color:var(--brand);font-size:clamp(30px,3.6vw,52px);margin-top:-.15em;text-shadow:0 2px 18px rgba(0,0,0,.6);color:#a3141a}
.hero .sub{margin-top:34px;font-family:var(--serif);font-size:13px;letter-spacing:.5em;text-transform:uppercase;opacity:.85}
.hero .scroll{position:absolute;bottom:50px;left:50%;z-index:3;transform:translateX(-50%);font-family:var(--serif);font-size:11px;letter-spacing:.5em;display:flex;flex-direction:column;align-items:center;gap:14px;opacity:.75}
.hero .scroll i{width:1px;height:64px;background:linear-gradient(var(--ivory),transparent);animation:drip 2.6s var(--ease) infinite;transform-origin:top}
@keyframes drip{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.hero .side{position:absolute;z-index:3;top:50%;font-family:var(--serif);font-size:11px;letter-spacing:.5em;text-transform:uppercase;opacity:.55;writing-mode:vertical-rl}
.hero .side.l{left:44px;transform:translateY(-50%) rotate(180deg)}
.hero .side.r{right:44px;transform:translateY(-50%)}

/* ---------- overture ---------- */
.overture{position:relative;padding:130px 24px 150px;background-color:#0a0606;text-align:center;overflow:hidden}
.overture .heart{width:min(300px,62vw);margin:-40px auto 34px}
.overture .heart.small{width:min(280px,60vw)}
.overture .heart.cut{width:min(260px,54vw);margin:30px auto 50px}
.overture .heart.cut img{-webkit-mask-image:none;mask-image:none;filter:drop-shadow(0 10px 30px rgba(0,0,0,.6))}
.overture .heart img{width:100%;height:auto;
  -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 58%,rgba(0,0,0,.6) 74%,transparent 98%);
          mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 58%,rgba(0,0,0,.6) 74%,transparent 98%);
  animation:float 9s ease-in-out infinite}
@keyframes float{50%{transform:translateY(-10px)}}
.overture h2{font-family:var(--lit);font-style:italic;font-weight:400;font-size:clamp(30px,3.4vw,50px);line-height:1.25;max-width:900px;margin:0 auto;color:var(--pearl)}
.overture .meta{margin-top:40px;font-family:var(--serif);font-size:13px;letter-spacing:.45em;text-transform:uppercase;color:var(--gold);display:flex;justify-content:center;gap:28px;flex-wrap:wrap}
.overture .meta span+span::before{content:"✦";margin-right:28px;font-size:9px;vertical-align:middle;opacity:.8}

/* ---------- peony corners ---------- */
.peony{position:absolute;pointer-events:none;z-index:1;height:auto}
/* Flower ornaments are image files in photos/ (flowers-corner-1/2/3.png). Swap the file to change the flowers. */
.peony.tl{top:-40px;left:-60px;width:min(520px,46vw)}
.peony.br{bottom:-50px;right:-70px;width:min(480px,42vw);transform:rotate(180deg)}
.peony.tr{top:-30px;right:-60px;width:min(420px,38vw);transform:scaleX(-1)}

/* ---------- this is us ---------- */
.us{position:relative;padding:160px 6vw 170px;overflow:hidden}
.us .grid{position:relative;z-index:2;display:grid;grid-template-columns:1.05fr 1fr;gap:7vw;align-items:center;max-width:1320px;margin:0 auto}
.us .photos{position:relative;height:760px}
.us .polar{margin:0;width:auto}
.stamp{background:var(--ivory);padding:16px;
  -webkit-mask:radial-gradient(circle at center,#0000 5.5px,#000 6px) -9px -9px/18px 18px round,linear-gradient(#000 0 0) 18px 18px/calc(100% - 36px) calc(100% - 36px) no-repeat;
  mask:radial-gradient(circle at center,#0000 5.5px,#000 6px) -9px -9px/18px 18px round,linear-gradient(#000 0 0) 18px 18px/calc(100% - 36px) calc(100% - 36px) no-repeat;
  filter:drop-shadow(0 24px 40px rgba(0,0,0,.5))}
.stamp img{width:100%;height:100%;object-fit:cover}
.us .s1{position:absolute;left:0;top:0;width:72%;height:auto;transform:rotate(var(--r,-2.5deg))}
.us .s2{position:absolute;right:0;bottom:0;width:48%;height:auto;transform:rotate(var(--r,3.5deg))}
.us .sig{position:absolute;left:4%;bottom:70px;z-index:3;font-family:var(--script);font-size:clamp(54px,6vw,96px);color:var(--ivory);transform:rotate(-8deg);text-shadow:0 4px 24px rgba(0,0,0,.6);white-space:nowrap}
.us .copy h2{font-size:clamp(54px,6.2vw,96px);margin:22px 0 14px}
.us .copy p{font-size:16.5px;color:rgba(244,244,241,.86);max-width:560px}
.us .copy .lead{font-family:var(--lit);font-style:italic;font-size:23px;line-height:1.5;color:var(--pearl)}
.us .copy .signed{font-family:var(--script);font-size:46px;margin:28px 0 36px;color:var(--pearl)}

/* ---------- portfolio ---------- */
.folio{position:relative;padding:150px 4vw 160px;overflow:hidden}
.folio header{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:40px;max-width:1380px;margin:0 auto 80px}
.folio h2{font-size:clamp(64px,8vw,132px);color:var(--oxblood)}
.folio header p{font-family:var(--lit);font-style:italic;font-size:22px;line-height:1.5;color:#4a3436;max-width:460px;justify-self:end}
.mosaic{columns:3;column-gap:24px;max-width:1380px;margin:0 auto}
.mosaic figure{position:relative;overflow:hidden;cursor:zoom-in;background:#ddd;break-inside:avoid;margin:0 0 24px}
.mosaic figure.tall img{aspect-ratio:3/4.4}
.mosaic figure.off{margin-top:70px}
.mosaic figure img{width:100%;height:auto;object-fit:cover;transition:transform 1.6s var(--ease),filter 1.2s var(--ease);filter:saturate(.92)}
.mosaic figure::after{content:"";position:absolute;inset:14px;border:1px solid rgba(244,244,241,0);transition:border-color .9s var(--ease),inset .9s var(--ease);pointer-events:none}
.mosaic figure::before{content:"View";position:absolute;z-index:2;left:50%;top:50%;transform:translate(-50%,-30%);opacity:0;font-family:var(--serif);font-size:12px;letter-spacing:.5em;color:var(--ivory);transition:.8s var(--ease)}
.mosaic figure:hover img{transform:scale(1.06);filter:saturate(1.05) brightness(.78)}
.mosaic figure:hover::after{inset:22px;border-color:rgba(244,244,241,.75)}
.mosaic figure:hover::before{opacity:1;transform:translate(-50%,-50%)}
.mosaic .card{break-inside:avoid;margin:0 0 24px;padding:56px 34px;border:1px solid rgba(59,5,16,.25);text-align:center;color:var(--oxblood)}
.mosaic .card .script{font-size:52px;color:var(--brand);line-height:1.1}
.mosaic .card p{font-family:var(--serif);letter-spacing:.38em;font-size:12px;text-transform:uppercase;margin-top:18px}
.folio .more{text-align:center;margin-top:90px}

/* lightbox */
.lb{position:fixed;inset:0;z-index:150;background:rgba(8,4,5,.96);display:grid;place-items:center;opacity:0;visibility:hidden;transition:.6s var(--ease);cursor:zoom-out}
.lb.open{opacity:1;visibility:visible}
.lb img{max-width:88vw;max-height:86vh;box-shadow:0 30px 80px rgba(0,0,0,.6);border:10px solid var(--ivory)}
.lb button{position:absolute;background:none;border:0;color:var(--ivory);font-family:var(--serif);letter-spacing:.4em;font-size:13px;cursor:pointer;padding:20px}
.lb .x{top:20px;right:30px}.lb .pv{left:20px;top:50%}.lb .nx{right:20px;top:50%}

/* ---------- quote over landscape ---------- */
.vista{position:relative;height:92vh;min-height:560px;overflow:hidden;display:grid;place-items:start center;padding-top:9vh;text-align:center}
.vista .bg{position:absolute;inset:-12% 0;background:url(assets/img/sunset-cliff.jpg) center/cover;will-change:transform}
.vista::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(12,7,8,.55),rgba(34,21,22,.35) 40%,rgba(12,7,8,.8))}
.vista blockquote{position:relative;z-index:2;max-width:980px;padding:0 24px}
.vista blockquote p{font-family:var(--lit);font-style:italic;font-size:clamp(32px,4.2vw,62px);line-height:1.2;color:var(--ivory)}
.vista cite{display:block;margin-top:34px;font-style:normal}
.vista .frame{position:absolute;inset:40px;border:1px solid rgba(244,244,241,.3);z-index:2}

/* ---------- experience ---------- */
.exp{position:relative;padding:150px 6vw 170px;overflow:hidden}
.exp .eye{width:150px;margin:0 auto 26px;opacity:.85}
.exp .head{text-align:center;color:var(--oxblood)}
.exp .head h2{font-size:clamp(56px,6.6vw,104px);margin-top:18px}
.exp .head p{font-family:var(--lit);font-style:italic;font-size:21px;color:#5a4446;margin-top:20px}
.exp .grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:7vw;align-items:center;max-width:1260px;margin:90px auto 0}
.gilt{position:relative;padding:20px;background:linear-gradient(135deg,#5e421a 0%,#e2c886 16%,#8d6c30 30%,#f4e4b4 46%,#9a7838 62%,#e8d295 80%,#6a4b1d 100%);box-shadow:0 40px 70px rgba(34,21,22,.38),inset 0 0 0 1px rgba(40,25,5,.6)}
.gilt::before{content:"";position:absolute;inset:7px;border:2px solid rgba(255,244,214,.55);box-shadow:inset 0 0 0 2px rgba(80,55,15,.55)}
.gilt::after{content:"";position:absolute;inset:16px;box-shadow:inset 0 0 0 1px rgba(255,244,214,.7),inset 0 0 22px rgba(0,0,0,.55);pointer-events:none}
.gilt img{width:100%;aspect-ratio:4/5;object-fit:cover}
.gilt .corner{position:absolute;width:44px;height:44px;border:1px solid rgba(255,244,214,.7);border-radius:50%;background:radial-gradient(circle,#f6e7bd,#9c7a3b 60%,#5e421a);box-shadow:0 2px 6px rgba(0,0,0,.4)}
.gilt .c1{top:-12px;left:-12px}.gilt .c2{top:-12px;right:-12px}.gilt .c3{bottom:-12px;left:-12px}.gilt .c4{bottom:-12px;right:-12px}
.exp .exp-tv{display:block;width:100%;max-width:520px;height:auto;margin:0 auto}
.plaque{margin:34px auto 0;width:max-content;font-family:var(--serif);font-size:12px;letter-spacing:.42em;text-transform:uppercase;color:#6a4b1d;padding:9px 20px;border:1px solid rgba(106,75,29,.5)}
.steps{list-style:none;counter-reset:s}
.steps li{display:grid;grid-template-columns:90px 1fr;gap:12px;padding:34px 0;border-top:1px solid rgba(59,5,16,.18)}
.steps li:last-child{border-bottom:1px solid rgba(59,5,16,.18)}
.steps .n{font-family:var(--lit);font-style:italic;font-size:40px;color:var(--brand);line-height:1}
.steps h3{font-family:var(--serif);font-weight:400;font-size:28px;letter-spacing:.12em;text-transform:uppercase;color:var(--oxblood);line-height:1.1}
.steps p{margin-top:10px;color:#4a3436;font-size:16px}

/* ---------- investment teaser ---------- */
.invest{position:relative;padding:150px 6vw 160px;overflow:hidden;text-align:center}
.invest h2{font-size:clamp(56px,6.6vw,104px);margin:18px 0 18px}
.invest .intro{font-family:var(--lit);font-style:italic;font-size:21px;color:rgba(244,244,241,.78);max-width:640px;margin:0 auto}
.tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:34px;max-width:1240px;margin:90px auto 70px;text-align:center}
.tier{position:relative;padding:52px 36px 46px;border:1px solid rgba(201,169,106,.45);transition:transform .9s var(--ease),background .9s}
.tier::before{content:"";position:absolute;inset:8px;border:1px solid rgba(201,169,106,.18);pointer-events:none}
.tier:hover{transform:translateY(-8px);background:rgba(113,1,1,.18)}
.polar{position:relative;background:#f8f6f1;padding:14px 14px 54px;width:72%;margin:0 auto 38px;box-shadow:0 16px 34px rgba(20,8,10,.30),0 3px 8px rgba(20,8,10,.16);transform:rotate(var(--r,-2deg))}
.polar img{aspect-ratio:1;object-fit:cover;width:100%;display:block}
.polar .clip{position:absolute;top:-32px;left:50%;transform:translateX(-50%);width:44%;max-width:190px;min-width:100px;aspect-ratio:200/108;height:auto;background:url(assets/orn/gold-clip.svg) no-repeat center/contain;border-radius:0;box-shadow:none;filter:drop-shadow(0 3px 3px rgba(20,8,10,.35));pointer-events:none;z-index:3}
.polar .clip::after{content:none;display:none}
.polar-tall{width:82%;margin:28px auto 8px}
.polar-tall img{aspect-ratio:4/5}
.portraitcard .polar{width:86%}
.tier{padding-top:64px}
.tier h3{font-family:var(--serif);font-weight:400;font-size:42px;letter-spacing:.16em;text-transform:uppercase}
.tier .hrs{font-family:var(--lit);font-style:italic;font-size:19px;color:var(--gold);margin:6px 0 18px}
.tier ul{list-style:none;font-size:14.5px;color:rgba(244,244,241,.78);line-height:2}
.tier .price{margin-top:26px;font-family:var(--serif);font-size:36px;letter-spacing:.08em}
.invest .portrait{font-family:var(--serif);letter-spacing:.32em;font-size:13px;text-transform:uppercase;color:rgba(244,244,241,.7);margin-bottom:44px}

/* ---------- love notes ---------- */
.notes{position:relative;padding:150px 6vw 160px;overflow:hidden}
.notes .wrap{display:grid;grid-template-columns:.8fr 1.4fr;gap:7vw;align-items:center;max-width:1300px;margin:0 auto;position:relative;z-index:2}
.notes .pol{position:relative}
.notes .pol img{width:78%;transform:rotate(-5deg);filter:drop-shadow(0 30px 40px rgba(34,21,22,.35))}
.notes .pol img+img{position:absolute;width:62%;right:0;bottom:-70px;transform:rotate(6deg)}
.notes h2{font-size:clamp(60px,7vw,112px);color:var(--oxblood);margin:18px 0 10px}
.notes .stage{position:relative;min-height:330px;margin-top:30px}
.note{position:absolute;inset:0;opacity:0;transform:translateY(14px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease);pointer-events:none}
.note.on{opacity:1;transform:none;pointer-events:auto}
.note q{display:block;font-family:var(--lit);font-style:italic;font-size:clamp(22px,2.1vw,30px);line-height:1.5;color:#2d1b1d;quotes:"\201C" "\201D"}
.note q::before{content:"\201C";font-family:var(--lit);font-size:120px;line-height:0;color:var(--brand);position:relative;top:.42em;margin-right:6px;opacity:.85}
.note .who{margin-top:28px;font-family:var(--serif);letter-spacing:.38em;font-size:13px;text-transform:uppercase;color:var(--brand)}
.note .who small{letter-spacing:.2em;color:#7a6466;margin-left:12px}
.dots{display:flex;gap:14px;align-items:center;margin-top:40px}
.dots button{width:34px;height:17px;border:0;background:rgba(59,5,16,.25);cursor:pointer;padding:8px 0;background-clip:content-box;transition:.5s}
.dots button.on{background-color:var(--brand);width:64px}
.notes .src{margin-top:26px;font-size:13px;color:#7a6466}
.notes .src a{border-bottom:1px solid currentColor}

/* ---------- locations ---------- */
.locs{position:relative;padding:150px 6vw 160px;overflow:hidden}
.locs .head{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:end;max-width:1300px;margin:0 auto}
.locs h2{font-size:clamp(56px,6.6vw,104px);margin-top:18px}
.locs .head p{font-family:var(--lit);font-style:italic;font-size:21px;color:rgba(244,244,241,.78);line-height:1.55}
.strip{display:grid;grid-template-columns:1.3fr 1fr 1.3fr;gap:22px;max-width:1300px;margin:70px auto}
.strip img{width:100%;height:380px;object-fit:cover;filter:saturate(.85) contrast(1.05)}
.strip figure:nth-child(2){margin-top:60px}
.loclist{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:0 50px;max-width:1300px;margin:0 auto}
.loclist li{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:20px 0;border-bottom:1px solid rgba(244,244,241,.14)}
.loclist b{font-family:var(--serif);font-weight:400;font-size:21px;letter-spacing:.12em;text-transform:uppercase}
.loclist b small{display:block;font-family:var(--body);letter-spacing:.04em;text-transform:none;font-size:13px;opacity:.6}
.loclist span{font-family:var(--lit);font-style:italic;font-size:15px;color:var(--gold);white-space:nowrap}
.locs .note2{max-width:1300px;margin:34px auto 0;font-size:14px;opacity:.65}

/* ---------- inquire / footer ---------- */
.inquire{position:relative;padding:170px 6vw 120px;overflow:hidden;text-align:center}
.inquire .logo{width:min(440px,70vw);margin:0 auto}
.inquire .lets{font-family:var(--script);font-size:clamp(60px,7vw,110px);color:var(--ivory);margin-top:40px}
.inquire .lead{font-family:var(--lit);font-style:italic;font-size:22px;color:rgba(244,244,241,.82);margin-top:16px}
form.ask{position:relative;z-index:2;max-width:860px;margin:70px auto 0;display:grid;grid-template-columns:1fr 1fr;gap:34px 40px;text-align:left}
form.ask label{display:block;font-family:var(--serif);font-size:12px;letter-spacing:.4em;text-transform:uppercase;opacity:.75}
form.ask input,form.ask textarea{width:100%;background:transparent;border:0;border-bottom:1px solid rgba(244,244,241,.4);color:var(--ivory);font:300 17px var(--body);padding:12px 0;outline:none;transition:border-color .4s}
form.ask input:focus,form.ask textarea:focus{border-color:var(--ivory)}
form.ask .full{grid-column:1/-1}
form.ask .opt{text-transform:none;letter-spacing:.05em;font-family:var(--body);font-size:12px;opacity:.7}
form.ask textarea{min-height:110px;resize:vertical}
form.ask .send{grid-column:1/-1;text-align:center;margin-top:14px}
form.ask button{background:none;color:var(--ivory);cursor:pointer}
.hats{position:relative;z-index:2;max-width:860px;margin:70px auto 0;border:0}
.hats iframe{display:block;width:100%;border:0;background:transparent}
.contactline{position:relative;z-index:2;margin-top:90px;display:flex;justify-content:center;gap:60px;flex-wrap:wrap;font-family:var(--serif);letter-spacing:.32em;font-size:14px;text-transform:uppercase}
.contactline a:hover{color:var(--gold)}
footer{position:relative;z-index:2;margin-top:110px;padding-top:34px;border-top:1px solid rgba(244,244,241,.15);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-family:var(--serif);font-size:12px;letter-spacing:.32em;text-transform:uppercase;opacity:.6;max-width:1300px;margin-left:auto;margin-right:auto}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(34px);transition:opacity 1.6s var(--ease),transform 1.6s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.15s}.rv.d2{transition-delay:.3s}.rv.d3{transition-delay:.45s}
.us .s1.rv{transform:rotate(var(--r,-2.5deg)) translateY(40px)}.us .s1.rv.in{transform:rotate(var(--r,-2.5deg))}
.us .s2.rv{transform:rotate(var(--r,3.5deg)) translateY(60px)}.us .s2.rv.in{transform:rotate(var(--r,3.5deg))}
.shot .rv{opacity:1!important;transform:none!important;transition:none!important}
.shot .us .s1{transform:rotate(var(--r,-2.5deg))!important}.shot .us .s2{transform:rotate(var(--r,3.5deg))!important}
.shot .loader{display:none}.shot .grain{display:none}
.shot .hero .bg.on{transition:none;transform:scale(1.02)}

/* ---------- investment page ---------- */
.phero{position:relative;height:78vh;min-height:520px;display:grid;place-items:center;text-align:center;overflow:hidden}
.phero .bg{position:absolute;inset:0;background:url(assets/img/p09.jpg) center 35%/cover}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(12,7,8,.6),rgba(12,7,8,.45) 40%,rgba(12,7,8,.95))}
.phero .inner{position:relative;z-index:2}
.phero h1{font-size:clamp(80px,12vw,200px)}
.phero .script{font-size:clamp(36px,4vw,60px);color:#a3141a;margin-top:-.2em}
.collections{max-width:1240px;margin:0 auto}
.coll{display:grid;grid-template-columns:1fr 1fr;gap:7vw;align-items:center;padding:100px 0 90px;border-bottom:1px solid rgba(59,5,16,.15)}
.coll:nth-child(even) .polar{order:2}
.coll .polar{width:78%;--r:-3deg}
.coll:nth-child(even) .polar{--r:3deg}
.coll .roman{font-family:var(--lit);font-style:italic;font-size:30px;color:var(--brand)}
.coll h2{font-size:clamp(64px,7vw,110px);color:var(--oxblood);margin:6px 0 10px}
.coll .hrs{font-family:var(--lit);font-style:italic;font-size:22px;color:#6a4b1d}
.coll ul{list-style:none;margin:26px 0;color:#3a2628}
.coll li{padding:12px 0;border-top:1px solid rgba(59,5,16,.15);font-size:16px}
.coll li::before{content:"✦";color:var(--brand);font-size:10px;margin-right:14px}
.coll .price{font-family:var(--serif);font-size:54px;color:var(--oxblood);letter-spacing:.06em}
.coll .price small{font-size:14px;letter-spacing:.38em;margin-right:14px;opacity:.6}
.portraitcard{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:1fr 1.2fr;gap:60px;align-items:center}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .nav ul{display:none}.burger{display:block}.nav{grid-template-columns:1fr auto 1fr;padding:20px 22px}.nav.scrolled{padding:12px 22px}
  .nav .mark{grid-column:2}.nav.scrolled .mark{opacity:1;transform:none}.nav .mark img{height:38px}
  .hero .side{display:none}
}
@media (max-width:860px){
  body{font-size:16px}
  .hero .mat{inset:12px}
  .hero .sub{letter-spacing:.32em;font-size:11px;padding:0 20px;line-height:2}
  .overture{padding:110px 22px}
  .overture .heart{width:150px}.overture .heart.cut{width:130px}
  .overture .meta{gap:10px;flex-direction:column}.overture .meta span+span::before{display:none}
  .us,.folio,.exp,.invest,.notes,.locs{padding:110px 22px}
  .us .grid,.exp .grid,.notes .wrap,.locs .head,.folio header,.coll,.portraitcard{grid-template-columns:1fr;gap:50px}
  .us .photos{height:520px}
  .us .s1{width:78%}.us .s2{width:52%}
  .us .sig{bottom:20px}
  .folio header p{justify-self:start}
  .mosaic{columns:2;column-gap:10px}.mosaic figure{margin-bottom:10px}.mosaic figure.off{margin-top:40px}.mosaic .card{padding:30px 14px;margin-bottom:10px}.mosaic .card .script{font-size:34px}
  .vista{height:70vh}.vista .frame{inset:16px}
  .tiers{grid-template-columns:1fr;gap:60px}
  .notes .pol{max-width:360px;margin:0 auto 40px}
  .notes .stage{min-height:420px}
  .strip{grid-template-columns:1fr 1fr}.strip figure:nth-child(3){display:none}.strip img{height:240px}.strip figure:nth-child(2){margin-top:30px}
  .loclist{grid-template-columns:1fr}
  form.ask{grid-template-columns:1fr}
  .contactline{flex-direction:column;gap:18px;font-size:12px}
  footer{flex-direction:column;align-items:center;text-align:center}
  .peony.tl{width:62vw;top:-20px;left:-40px}.peony.br{width:60vw}.peony.tr{width:56vw}
  .coll:nth-child(even) .polar{order:0}
  .coll{padding:60px 0}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}}

.shot .vista .bg{transform:none!important}
.notes .wrap>*,.us .grid>*,.exp .grid>*,.locs .head>*{min-width:0}
@media (max-width:860px){.note q{font-size:21px}.note q::before{font-size:84px}.notes .pol img+img{bottom:-40px}.hero .logo{width:86vw}}

form.ask fieldset.svc{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:14px 34px;align-items:center}
form.ask fieldset.svc legend{font-family:var(--serif);font-size:12px;letter-spacing:.4em;text-transform:uppercase;opacity:.75;margin-bottom:16px;padding:0}
form.ask fieldset.svc label{display:inline-flex;align-items:center;gap:10px;font-family:var(--body);font-size:16px;letter-spacing:.05em;text-transform:none;opacity:1;cursor:pointer}
form.ask fieldset.svc input{width:16px;height:16px;padding:0;accent-color:#710101;cursor:pointer}
form.ask .svc-err{display:none;width:100%;font-size:13px;color:#e1dbd7;font-style:italic}
form.ask fieldset.svc.bad .svc-err{display:block}

/* Dark red oil-painted peony garland under the homepage Sacred Heart (photos/peony-garland.jpg) */
.overture .heart.garland{position:relative;margin:20px auto 150px}
.overture .heart.garland .hp{position:relative;z-index:1}
.overture .heart.garland .cradle{position:absolute;left:50%;bottom:-150px;width:300%;max-width:none;transform:translateX(-50%);mix-blend-mode:lighten;z-index:0;animation:none;
 -webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 55%,#000 60%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 55%,#000 60%,transparent 100%)}
@media (max-width:700px){.overture .heart.garland{margin:10px auto 90px}.overture .heart.garland .cradle{bottom:-90px;width:280%}}

footer{position:relative;z-index:2}

/* Investment page: Portrait / Boudoir buttons */
.invtabs{margin-top:22px;display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
@media (max-width:700px){.invtabs{flex-direction:column;align-items:center}}

/* Portrait / Boudoir investment pages */
.phero.p-portrait .bg{background-image:url(assets/img/p11.jpg);background-position:center 20%;background-size:cover}
.phero.p-boudoir .bg{background-image:url(https://static.wixstatic.com/media/1a9faf_21faae580f534caeb7388db409592234~mv2.jpeg/v1/fill/w_1600,h_2200,al_c,q_80,enc_auto/boudoir-hero.jpg);background-position:center 30%;background-size:cover}
.sess-note{margin-top:22px;font-family:var(--lit);font-style:italic;font-size:17px;color:#4a3436;line-height:1.5}

/* Keep intro copy clear of the corner peony on session/paper sections */
section.paper > .peony.tl{width:min(380px,34vw);top:-20px;left:-30px;z-index:0}
section.paper > .label,
section.paper > h2,
section.paper > p,
section.paper > .btns,
section.paper > div{position:relative;z-index:2}

/* ---------- gold-clip polaroid (matches Vanja's price-sheet clips) ---------- */
/* clip asset: assets/orn/gold-clip.svg — original SVG, no third-party license */

/* ---------- vintage CRT stack (CSS/SVG original, no third-party TV art) ---------- */
.tv-stack{position:relative;background:#710101;color:#e8d08a;padding:140px 6vw 88px;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,540px) minmax(0,1fr);gap:36px;align-items:center;justify-items:center}
.tv-stack .tv-col{width:min(540px,100%);display:flex;flex-direction:column;gap:20px;position:relative;z-index:2}
.tv-wordmark,.tv-est{font-family:var(--serif);font-size:13px;letter-spacing:.32em;text-transform:uppercase;line-height:1.85;color:#e8d08a;text-align:center;margin:0}
.tv-wordmark{justify-self:end;padding-right:8px}
.tv-est{justify-self:start;padding-left:8px}
.crt{margin:0;filter:drop-shadow(0 18px 28px rgba(0,0,0,.45))}
.crt-body{display:grid;grid-template-columns:1fr 29%;gap:10px;padding:14px 12px 16px;position:relative}
.crt-screen-wrap{padding:9px;position:relative;min-width:0}
.crt-glass{position:relative;aspect-ratio:4/3;overflow:hidden;background:#0a0706;box-shadow:inset 0 0 0 2px rgba(0,0,0,.55)}
.crt-glass img{width:100%;height:100%;object-fit:cover;display:block;filter:contrast(1.04) saturate(.96)}
.crt-glass::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(to bottom,rgba(0,0,0,.07) 0 1px,transparent 1px 3px);opacity:.28;pointer-events:none;z-index:2}
.crt-glass::after{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 22% 0%,rgba(255,255,255,.2),transparent 46%),linear-gradient(180deg,transparent 62%,rgba(0,0,0,.3));pointer-events:none;z-index:3;box-shadow:inset 0 0 22px rgba(0,0,0,.4)}
.crt-side{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0}
.grille{flex:1;width:100%;border-radius:2px;box-shadow:inset 0 0 8px rgba(0,0,0,.4)}
.knob{position:relative;border-radius:50%;flex:0 0 auto}
.knob::after{content:"";position:absolute;left:50%;top:18%;width:2px;height:36%;background:#f0e0b0;transform:translateX(-50%) rotate(var(--a,25deg));transform-origin:50% 110%;border-radius:1px;box-shadow:0 0 0 .5px rgba(0,0,0,.3)}
.dial{position:relative;border-radius:50%;flex:0 0 auto;display:grid;place-items:center}
.dial-label{font-family:var(--serif);font-size:7px;letter-spacing:.18em;text-transform:uppercase;color:#3a2a1a;margin:0;line-height:1}

/* woodgrain set — brown mid-century, three knobs over a slatted grille */
.crt.wood .crt-body{background:repeating-linear-gradient(88deg,rgba(255,220,160,.08) 0 1px,transparent 1px 5px),repeating-linear-gradient(96deg,rgba(0,0,0,.14) 0 1px,transparent 1px 8px),linear-gradient(180deg,#6a4632,#3d261a 42%,#2a1810);border-radius:20px 20px 14px 14px;box-shadow:inset 0 1px 0 rgba(255,230,180,.22),inset 0 0 0 1px rgba(20,10,6,.65),0 2px 0 #1a0e0a}
.crt.wood .crt-screen-wrap{background:linear-gradient(145deg,#efe4c8,#8a7a58 42%,#d8ccae);border-radius:22px;box-shadow:inset 0 0 0 1px rgba(40,24,10,.45),0 1px 2px rgba(0,0,0,.35)}
.crt.wood .crt-glass{border-radius:16px}
.crt.wood .crt-side{padding:6px 2px 4px}
.crt.wood .grille{background:repeating-linear-gradient(to bottom,#2a1810 0 2px,#5a4030 2px 3px);min-height:0}
.crt.wood .knobs{display:flex;flex-direction:column;gap:7px;position:relative;z-index:1;margin:4px 0}
.crt.wood .knob{width:26px;height:26px;background:radial-gradient(circle at 35% 30%,#e2c8a0,#6a4a32 46%,#2a1810 72%);box-shadow:inset 0 0 0 2px #c9a96a,0 2px 3px rgba(0,0,0,.5)}

/* cream set — ivory body, VHF / UHF dials */
.crt.cream .crt-body{background:linear-gradient(180deg,#f3ead6,#d8c9ae 52%,#c4b090);border-radius:12px;box-shadow:inset 0 0 0 2px #c9b89a,inset 0 0 0 3px #8a7a62,inset 0 1px 0 rgba(255,255,255,.45)}
.crt.cream .crt-screen-wrap{background:linear-gradient(145deg,#f4eee0,#9a8a70 48%,#e0d4be);border-radius:24px;box-shadow:inset 0 0 0 1px rgba(60,40,20,.35)}
.crt.cream .crt-glass{border-radius:18px}
.crt.cream .crt-side{padding:4px 2px;gap:5px}
.crt.cream .dial{width:54px;height:54px;background:repeating-conic-gradient(#3a2a1a 0 1.4deg,transparent 1.4deg 12deg),radial-gradient(circle at 50% 50%,#1a1210 0 34%,#8a6a3a 36% 48%,#e8d08a 50% 58%,#3a2a1a 60%);box-shadow:0 1px 3px rgba(0,0,0,.4),inset 0 0 0 2px #c9a96a}
.crt.cream .dial .cap{width:38%;height:38%;border-radius:50%;background:radial-gradient(circle at 35% 30%,#2a1810,#0a0706);box-shadow:inset 0 0 0 1px #c9a96a}
.crt.cream .grille{background:repeating-linear-gradient(to bottom,#8a7a62 0 2px,#d4c4a8 2px 3px);min-height:36px}

/* slate set — black/silver, slatted panel and two lower dials */
.crt.slate .crt-body{background:linear-gradient(180deg,#3a3a3e,#1a1a1e 44%,#0e0e10);border-radius:8px;box-shadow:inset 0 0 0 1px #8a8a90,inset 0 1px 0 rgba(255,255,255,.2)}
.crt.slate .crt-screen-wrap{background:linear-gradient(145deg,#d8d4cc,#6a6a70 48%,#c8c4bc);border-radius:14px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.5)}
.crt.slate .crt-glass{border-radius:10px}
.crt.slate .crt-side{padding:4px 2px;gap:8px}
.crt.slate .grille{background:repeating-linear-gradient(to bottom,#0e0e10 0 3px,#6a6a70 3px 4px);min-height:0;border:1px solid #2a2a2e}
.crt.slate .knobs{display:flex;flex-direction:column;gap:8px;margin-top:auto;padding-bottom:4px}
.crt.slate .knob{width:34px;height:34px;background:repeating-conic-gradient(#c9c4bc 0 1.2deg,transparent 1.2deg 14deg),radial-gradient(circle at 35% 30%,#d8d4cc,#3a3a3e 55%,#0e0e10);box-shadow:inset 0 0 0 2px #b0b0b4,0 2px 3px rgba(0,0,0,.5)}

@media (max-width:860px){
  .tv-stack{grid-template-columns:1fr;gap:18px;padding:108px 22px 56px;text-align:center}
  .tv-wordmark{display:none}
  .tv-est{justify-self:center;padding:0;font-size:12px}
  .tv-col{width:min(420px,92vw)}
  .polar .clip{width:42%;min-width:78px;top:-28px}
  .coll .polar,.portraitcard .polar,.polar-tall{width:min(86%,420px)}
  .tier .polar{width:78%}
}
@media (max-width:480px){
  .crt-body{grid-template-columns:1fr 26%;gap:7px;padding:10px 8px 12px}
  .crt.wood .knob{width:20px;height:20px}
  .crt.cream .dial{width:40px;height:40px}
  .crt.slate .knob{width:26px;height:26px}
  .polar .clip{min-width:70px;top:-24px}
}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
