/* V1.1: localized palace architecture, lace edging and a paper composition.
   Original layout stays in style.css; remove this stylesheet to compare V1. */
:root { --rose: #955f76; }
.hero { background: #f3e5e2; isolation: isolate; }
.arch-scene {
  inset: 0; width: 100%; height: 100%; opacity: 1;
  background: url('/public/media/hero-palace-v2.png') center center / cover no-repeat;
  transform: translateY(var(--parallax, 0px)) scale(1.08);
  transform-origin: center bottom; z-index: -2;
}
.arch-scene > * { display: none; }
.arch-scene::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, #fff9f1a8, #fff7ef5c 37%, #fae6ed0d 67%);
}
.hero::before {
  content: ''; position: absolute; inset: 110px 3.4% 75px;
  border: 1px solid #fffaf5a6; pointer-events: none;
  box-shadow: 0 0 0 5px #fff9f212;
}
.hero::after {
  content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 47px;
  background: url('/public/media/lace-edge.svg') repeat-x center top / 80px 47px;
  transform: rotate(180deg); pointer-events: none; opacity: .95;
  filter: drop-shadow(0 1px 1px #87646f30);
}
.hero-index { color: #70535c; }
.hero-copy { padding-top: 96px; }
.hero h1 > span { color: #955f76; text-shadow: 0 1px #fff5ee; }
.hero-link { background: #fffaf329; border: 1px solid #b7959c; padding: 8px 12px 8px 24px; border-radius: 40px; gap: 24px; }
.hero-link .circle-arrow { border-color: #c4a5aa; background: #fffaf34d; }
.hero-bottom { bottom: 46px; }
.hero-side { display: none; }
.header nav { background: #fffaf348; padding: 8px 24px; border: 1px solid #fffaf56b; border-radius: 30px; }
.works { position: relative; }
.works .section-heading { position: relative; padding-top: 25px; }
.works .section-heading::before {
  content: ''; position: absolute; top: -35px; left: 0;
  width: 155px; height: 34px;
  background: url('/public/media/flourish.svg') center / contain no-repeat;
}
.work-social { position: relative; isolation: isolate; }
.work-social::before {
  content: ''; position: absolute; inset: 8px 8px 91px; z-index: -1;
  background: #e3cbd1; border: 1px solid #d0b6bd;
  transform: rotate(-3deg); box-shadow: 0 8px 18px #68505b0b;
}
.social-cover {
  background: linear-gradient(125deg, #f2e8e2, #e8d5d9);
  border: 9px solid #fffaf4; outline: 1px solid #e6d8d6;
  box-shadow: 0 12px 22px #70525c0b;
}
.social-cover::after {
  inset: 20px; border: 1px solid #b58c9966; transform: none;
  outline: 1px solid #fff9f0bb; outline-offset: 4px;
}
.social-cover .cover-meta { left: 40px; top: 38px; }
.social-cover .placeholder-label { left: 40px; bottom: 35px; }
.social-cover .cover-open { right: 38px; bottom: 31px; }
.social-type { left: 13%; }
@media(max-width:900px) {
  .hero-copy { padding-top: 110px; }
  .arch-scene { left: 0; top: 0; width: 100%; height: 100%; opacity: 1; background-position: 57% center; }
  .social-cover .cover-meta { font-size: 7px; left: 28px; }
}
@media(max-width:600px) {
  .hero { min-height: 720px; }
  .header nav { gap: 20px; padding: 5px 13px; }
  .arch-scene { background-position: 64% center; }
  .arch-scene::after { background: linear-gradient(90deg, #fff8efed, #fff8efbd 42%, #fff5ee26 90%); }
  .hero::before { inset: 94px 4% 86px; }
  .hero-copy { padding-top: 126px; }
  .hero-copy > .eyebrow { letter-spacing: 1px; }
  .hero h1 > span { font-size: 57px; }
  .hero-link { padding-left: 20px; }
  .hero-bottom { bottom: 53px; }
  .hero::after { height: 35px; background-size: 60px 35px; }
  .works .section-heading { padding-top: 15px; }
  .works .section-heading::before { width: 125px; top: -30px; }
  .social-cover .cover-meta { left: 28px; top: 32px; }
  .social-cover .placeholder-label { left: 28px; font-size: 9px; }
  .social-type { font-size: 42px; }
  .social-type em { font-size: 34px; }
}
@media(prefers-reduced-motion:reduce) {
  .arch-scene { transform: scale(1.08); }
}