/* PHANEROEL — Classic Essence / Modern Perspective
   Editorial shell refresh. Existing projects, embeds and form logic remain intact. */
:root {
  --ph-ivory: #F3F1EC;
  --ph-stone: #E5E1D8;
  --ph-urban-grey: #AAB0B2;
  --ph-charcoal: #292824;
  --ph-muted: #77746D;
  --ph-gold: #A89569;
  --ph-olive: #899080;
  --ph-line: rgba(41, 40, 36, .16);
  --ph-content: 1600px;
}
html { background: var(--ph-ivory); scroll-behavior: smooth; }
body.ph-site {
  margin: 0;
  background: var(--ph-ivory) !important;
  color: var(--ph-charcoal) !important;
  font-family: 'Inter', 'Noto Sans KR', sans-serif !important;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}
body.ph-site main { background: var(--ph-ivory); }
body.ph-site [class~="bg-black"],
body.ph-site [class~="bg-black/70"],
body.ph-site [class~="bg-black/80"],
body.ph-site [class~="bg-black/90"],
body.ph-site [class~="bg-gray-900"],
body.ph-site [class~="bg-gray-800"] {
  background-color: var(--ph-ivory) !important;
}
body.ph-site [class~="text-white"],
body.ph-site [class~="text-gray-100"],
body.ph-site [class~="text-gray-200"],
body.ph-site [class~="text-gray-300"],
body.ph-site [class~="text-gray-400"] { color: var(--ph-charcoal) !important; }
body.ph-site [class~="text-gray-500"],
body.ph-site [class~="text-gray-600"] { color: var(--ph-muted) !important; }
body.ph-site [class~="border-gray-900"],
body.ph-site [class~="border-gray-800"],
body.ph-site [class~="border-gray-700"] { border-color: var(--ph-line) !important; }
body.ph-site a { color: inherit; }
body.ph-site a:focus-visible,
body.ph-site button:focus-visible,
body.ph-site input:focus-visible,
body.ph-site textarea:focus-visible,
body.ph-site select:focus-visible {
  outline: 2px solid var(--ph-gold);
  outline-offset: 4px;
}
body.ph-site .container {
  width: min(calc(100% - 88px), var(--ph-content));
  max-width: var(--ph-content);
  margin-left: auto;
  margin-right: auto;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Shared, restrained navigation */
.ph-header {
  position: sticky;
  top: 0;
  z-index: 100;
  width: 100%;
  background: rgba(243, 241, 236, .94);
  border-bottom: 1px solid var(--ph-line);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
}
.ph-header-inner {
  width: min(calc(100% - 88px), var(--ph-content));
  min-height: 84px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}
.ph-wordmark { display: inline-flex; align-items: center; flex-shrink: 0; }
.ph-wordmark img {
  display: block;
  width: auto;
  height: 33px;
  max-width: 220px;
  object-fit: contain;
  filter: brightness(.72) saturate(.78);
  mix-blend-mode: multiply;
}
.ph-nav { display: flex; align-items: center; justify-content: flex-end; gap: clamp(20px, 3vw, 48px); }
.ph-nav-link {
  position: relative;
  padding: 10px 0;
  color: var(--ph-charcoal) !important;
  font-size: 11px;
  font-weight: 500;
  letter-spacing: .15em;
  text-decoration: none;
  text-transform: uppercase;
  transition: color .24s ease, opacity .24s ease;
}
.ph-nav-link::after {
  position: absolute;
  right: 0;
  bottom: 2px;
  left: 0;
  height: 1px;
  content: "";
  background: var(--ph-gold);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .28s ease;
}
.ph-nav-link:hover::after,
.ph-nav-link[aria-current="page"]::after { transform: scaleX(1); }
.ph-nav-link:hover { opacity: .72; }
.ph-menu-toggle {
  display: none;
  width: 42px;
  height: 42px;
  padding: 10px;
  border: 0;
  background: transparent;
  color: var(--ph-charcoal);
  cursor: pointer;
}
.ph-menu-toggle i { font-size: 20px; }
.ph-mobile-menu { display: none; }
.ph-mobile-menu:not(.hidden) {
  display: flex;
  flex-direction: column;
  padding: 6px 0 18px;
  background: var(--ph-ivory);
  border-top: 1px solid var(--ph-line);
}
.ph-mobile-link {
  padding: 15px max(24px, calc((100vw - var(--ph-content)) / 2));
  color: var(--ph-charcoal) !important;
  font-size: 11px;
  letter-spacing: .16em;
  text-decoration: none;
  text-transform: uppercase;
}
.ph-mobile-link[aria-current="page"] { color: #806c47 !important; }
.ph-home .ph-header {
  position: absolute;
  inset: 0 0 auto;
  background: linear-gradient(180deg, rgba(243,241,236,.96) 0%, rgba(243,241,236,.82) 52%, rgba(243,241,236,0) 100%);
  border-bottom: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.ph-home .ph-header-inner { min-height: 96px; }

/* Full-bleed home film: no card, no border, no frame */
.ph-home main { background: var(--ph-ivory); }
.ph-site.ph-home .ph-home-hero {
  position: relative;
  isolation: isolate;
  width: 100%;
  height: 100svh;
  min-height: 640px;
  overflow: hidden;
  background: #d8d4ca !important;
}
.ph-site.ph-home .ph-home-hero iframe {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  pointer-events: none;
}
.ph-home-hero::before {
  position: absolute;
  z-index: 1;
  inset: 0;
  content: "";
  pointer-events: none;
  background:
    linear-gradient(180deg, rgba(243,241,236,.15) 0%, rgba(243,241,236,0) 26%, rgba(243,241,236,0) 56%, rgba(243,241,236,.78) 100%);
}
.ph-hero-copy {
  position: absolute;
  z-index: 2;
  right: 0;
  bottom: clamp(32px, 6.5vh, 88px);
  left: 0;
  width: min(calc(100% - 88px), var(--ph-content));
  margin: 0 auto;
  color: var(--ph-charcoal);
}
.ph-eyebrow,
.ph-overline {
  margin: 0 0 16px;
  color: #6c695f;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .19em;
  line-height: 1.6;
  text-transform: uppercase;
}
.ph-hero-title {
  max-width: 900px;
  margin: 0;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(42px, 6.2vw, 90px);
  font-weight: 400;
  letter-spacing: -.035em;
  line-height: .88;
}
.ph-hero-title span { display: block; }
.ph-hero-title span + span { margin-top: .12em; }
.ph-hero-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-top: clamp(24px, 3.2vw, 42px);
  padding-top: 14px;
  border-top: 1px solid rgba(41,40,36,.28);
  color: var(--ph-charcoal);
  font-size: 10px;
  letter-spacing: .13em;
  line-height: 1.6;
  text-transform: uppercase;
}
.ph-hero-meta a { text-decoration: none; }
.ph-hero-meta a:hover { color: #806c47; }

/* Selected works — open editorial composition */
.ph-selected-work { padding-top: clamp(72px, 10vw, 148px) !important; padding-bottom: clamp(52px, 8vw, 112px) !important; }
.ph-home .portfolio-columns-container {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  gap: clamp(22px, 3vw, 48px);
}
.ph-home .portfolio-column { display: flex; flex-direction: column; gap: clamp(24px, 3vw, 46px); }
.ph-home .portfolio-column.right-column { margin-top: clamp(90px, 16vw, 240px); }
.ph-home .intro-text-block { padding: 0 0 clamp(28px, 4vw, 58px); }
.ph-intro-title {
  max-width: 620px;
  margin: 0 0 24px !important;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(34px, 4.4vw, 60px) !important;
  font-weight: 400 !important;
  letter-spacing: -.025em;
  line-height: .98;
}
.ph-intro-copy {
  max-width: 440px;
  color: var(--ph-muted);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.9;
}
.ph-home .portfolio-item { overflow: hidden; background: transparent; cursor: pointer; }
.ph-home .portfolio-item img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0 !important;
  transition: transform .6s cubic-bezier(.2,.65,.3,1);
}
.ph-home .portfolio-item:hover img { transform: scale(1.018); }
.ph-home .portfolio-item .portfolio-overlay {
  background: rgba(41,40,36,.18);
  color: #fff;
  opacity: 0;
  transition: opacity .32s ease;
}
.ph-home .portfolio-item .portfolio-overlay i { color: #fff; }
.ph-home .portfolio-item:hover .portfolio-overlay { opacity: 1; }
.ph-more-section {
  padding: 0 0 clamp(84px, 12vw, 160px);
  background: var(--ph-ivory);
  text-align: center;
}
.ph-text-link {
  display: inline-flex;
  align-items: center;
  gap: 22px;
  padding: 12px 0;
  border-bottom: 1px solid var(--ph-charcoal);
  color: var(--ph-charcoal) !important;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .17em;
  text-decoration: none;
  text-transform: uppercase;
  transition: color .22s ease, border-color .22s ease, gap .22s ease;
}
.ph-text-link:hover { gap: 30px; color: #806c47 !important; border-color: var(--ph-gold); }

/* DOSI — one understated cultural note, not a card */
.ph-dosi-section {
  padding: clamp(58px, 8vw, 112px) 0;
  background: var(--ph-stone) !important;
}
.ph-dosi-inner {
  width: min(calc(100% - 88px), var(--ph-content));
  margin: 0 auto;
}
.ph-dosi-top,
.ph-dosi-bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 24px;
  color: var(--ph-muted);
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.ph-dosi-main {
  display: grid;
  grid-template-columns: minmax(180px, .65fr) minmax(0, 1fr);
  align-items: end;
  gap: clamp(28px, 8vw, 140px);
  padding: clamp(40px, 7vw, 96px) 0;
}
.ph-dosi-main h2 {
  margin: 0;
  color: var(--ph-charcoal);
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(74px, 13vw, 180px);
  font-weight: 400;
  letter-spacing: -.065em;
  line-height: .72;
}
.ph-dosi-copy { max-width: 520px; }
.ph-dosi-copy h3 {
  margin: 0 0 16px;
  color: var(--ph-charcoal);
  font-size: clamp(20px, 2.5vw, 30px);
  font-weight: 400;
  letter-spacing: -.035em;
  line-height: 1.2;
}
.ph-dosi-copy p {
  max-width: 440px;
  margin: 0;
  color: var(--ph-muted);
  font-size: 13px;
  line-height: 1.9;
}
.ph-dosi-bottom { padding-top: 16px; border-top: 1px solid var(--ph-line); }

/* Shared page rhythm */
.ph-work #works,
.ph-stories #stories-magazine,
.ph-info #about,
.ph-info #contact { background: var(--ph-ivory) !important; }
.ph-work #works { padding-top: clamp(58px, 8vw, 112px) !important; padding-bottom: clamp(72px, 10vw, 140px) !important; }
.ph-work #works > .container > h2,
.ph-stories #stories-magazine h2,
.ph-info #contact h2 {
  color: var(--ph-charcoal) !important;
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: clamp(42px, 6vw, 80px) !important;
  font-weight: 400 !important;
  letter-spacing: -.035em !important;
  line-height: .98;
}
.ph-work #works > .container > h2 { text-align: left !important; margin-bottom: 14px !important; }
.ph-page-intro {
  max-width: 640px;
  margin: 0 0 clamp(42px, 6vw, 76px);
  color: var(--ph-muted);
  font-size: 13px;
  line-height: 1.8;
}
.ph-work .portfolio-grid {
  gap: clamp(12px, 1.8vw, 26px) !important;
  column-gap: clamp(12px, 1.8vw, 26px) !important;
  row-gap: clamp(20px, 2.5vw, 36px) !important;
}
.ph-work .portfolio-item { border-radius: 0 !important; }
.ph-work .portfolio-item img { border-radius: 0 !important; }
.ph-work .filter-btn {
  padding: 10px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--ph-muted) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: .13em !important;
}
.ph-work .filter-btn:hover { color: var(--ph-charcoal) !important; }
.ph-work .filter-btn.active {
  color: var(--ph-charcoal) !important;
  border-bottom-color: var(--ph-gold) !important;
}
.ph-work #filter-container { margin-bottom: clamp(30px, 4vw, 58px) !important; }
.ph-work #secondary-filter-container { min-height: 28px; }
.ph-work .primary-filter-btn {
  color: var(--ph-muted) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}
.ph-work .primary-filter-btn:hover,
.ph-work .primary-filter-btn.active { color: var(--ph-charcoal) !important; }
.ph-work .secondary-filter-btn {
  border-color: var(--ph-line) !important;
  border-radius: 0 !important;
  color: var(--ph-muted) !important;
  background: transparent !important;
  font-size: 10px !important;
}
.ph-work .secondary-filter-btn:hover,
.ph-work .secondary-filter-btn.active {
  border-color: var(--ph-charcoal) !important;
  background: var(--ph-charcoal) !important;
  color: var(--ph-ivory) !important;
}
.ph-stories #stories-magazine { padding-bottom: clamp(64px, 9vw, 128px); }
.ph-stories #stories-magazine > .container { padding-top: clamp(34px, 5vw, 72px); }
.ph-stories .sticky-subheader {
  position: sticky;
  z-index: 40;
  top: 84px;
  background: rgba(243,241,236,.94) !important;
  border-bottom: 1px solid var(--ph-line);
  backdrop-filter: blur(16px);
}
.ph-stories #magazine-subtitle { color: var(--ph-muted) !important; font-size: 12px !important; }
.ph-stories .phone-frame {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: hidden;
  transform: none !important;
}
.ph-stories .phone-frame:hover { border-color: transparent !important; transform: none !important; }
.ph-stories #stories-grid { gap: clamp(32px, 4vw, 58px) clamp(14px, 2.5vw, 36px) !important; }
.ph-stories #stories-grid h3 { color: var(--ph-charcoal) !important; font-size: 13px !important; font-weight: 500 !important; line-height: 1.5; }
.ph-stories #stories-grid .text-gray-400 { color: var(--ph-muted) !important; }

/* INFO form: quiet paper-like fields, preserving existing Web3Forms flow */
.ph-info #about { padding-top: clamp(72px, 10vw, 140px) !important; padding-bottom: clamp(50px, 7vw, 96px) !important; }
.ph-info #about p {
  max-width: 920px;
  margin: 0 auto;
  color: var(--ph-charcoal) !important;
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(28px, 4.2vw, 52px) !important;
  font-weight: 400;
  line-height: 1.2 !important;
  letter-spacing: -.02em;
}
.ph-info #contact { padding-bottom: clamp(80px, 10vw, 140px) !important; }
.ph-info #contact h2 { text-align: left !important; margin-bottom: 28px; }
.ph-info #contact > .container > .text-center { text-align: left !important; margin-left: 0 !important; margin-bottom: 48px !important; }
.ph-info .form-container {
  background: rgba(229,225,216,.48) !important;
  border: 1px solid var(--ph-line) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.ph-info .form-input {
  color: var(--ph-charcoal) !important;
  border-bottom-color: rgba(41,40,36,.28) !important;
  border-radius: 0 !important;
}
.ph-info .form-input:focus { border-bottom-color: var(--ph-gold) !important; }
.ph-info .form-input::placeholder { color: #8a867e !important; }
.ph-info select.form-input option { background: var(--ph-ivory) !important; color: var(--ph-charcoal) !important; }
.ph-info .radio-group label { color: var(--ph-muted) !important; }
.ph-info .radio-group input[type="radio"]:checked + label { color: var(--ph-charcoal) !important; }
.ph-info .radio-group label:before { border-color: #999388 !important; }
.ph-info .radio-group input[type="radio"]:checked + label:before {
  border-color: var(--ph-charcoal) !important;
  background-color: var(--ph-charcoal) !important;
  box-shadow: inset 0 0 0 3px var(--ph-stone) !important;
}
.ph-info .submit-btn {
  padding: 15px 32px !important;
  border: 1px solid var(--ph-charcoal) !important;
  border-radius: 0 !important;
  background: var(--ph-charcoal) !important;
  color: var(--ph-ivory) !important;
  font-size: 10px !important;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.ph-info .submit-btn:hover { background: transparent !important; color: var(--ph-charcoal) !important; }
.ph-info input:-webkit-autofill,
.ph-info input:-webkit-autofill:hover,
.ph-info input:-webkit-autofill:focus,
.ph-info input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px var(--ph-stone) inset !important;
  -webkit-text-fill-color: var(--ph-charcoal) !important;
}

/* Shared footer: light, quiet and typographic */
body.ph-site footer {
  background: var(--ph-ivory) !important;
  border-top: 1px solid var(--ph-line) !important;
  color: var(--ph-charcoal) !important;
}
body.ph-site footer .font-mono { color: var(--ph-charcoal) !important; font-size: 14px !important; }
body.ph-site footer .container { padding-top: 28px !important; padding-bottom: 28px !important; }
body.ph-site footer p { font-size: 10px; letter-spacing: .04em; }
body.ph-site #notification {
  border: 1px solid var(--ph-line);
  border-radius: 0;
  background: var(--ph-charcoal);
  color: var(--ph-ivory);
}

/* Video players stay immersive and dark */
body.ph-site .video-modal-overlay { background-color: rgba(21,20,18,.96) !important; }
body.ph-site .video-modal-close { color: #f3f1ec; }
body.ph-site .modal-credits-wrapper h4 { color: #f3f1ec; }
body.ph-site .modal-credits-wrapper strong { color: #c7b58f; }
body.ph-site .portfolio-item.hidden { pointer-events: none; }

/* Responsive rhythm */
@media (max-width: 767px) {
  body.ph-site .container,
  .ph-header-inner,
  .ph-hero-copy,
  .ph-dosi-inner { width: calc(100% - 36px); }
  .ph-header-inner { min-height: 68px; gap: 12px; }
  .ph-home .ph-header-inner { min-height: 76px; }
  .ph-wordmark img { height: 26px; max-width: 170px; }
  .ph-nav { display: none; }
  .ph-menu-toggle { display: inline-flex; align-items: center; justify-content: center; }
  .ph-home-hero { min-height: 590px; height: 88svh; }
  .ph-hero-copy { bottom: 28px; }
  .ph-eyebrow { margin-bottom: 12px; font-size: 9px; }
  .ph-hero-title { font-size: clamp(38px, 10.5vw, 62px); }
  .ph-hero-meta { align-items: flex-start; margin-top: 24px; font-size: 9px; letter-spacing: .08em; }
  .ph-hero-meta span { max-width: 56%; }
  .ph-hero-meta a { white-space: nowrap; }
  .ph-home .portfolio-columns-container { grid-template-columns: 1fr; gap: 26px; }
  .ph-home .portfolio-column { gap: 26px; }
  .ph-home .portfolio-column.right-column { margin-top: 0; }
  .ph-home .intro-text-block { padding-bottom: 8px; }
  .ph-intro-title { font-size: 38px !important; }
  .ph-intro-copy { font-size: 13px; }
  .ph-dosi-top, .ph-dosi-bottom { align-items: flex-start; font-size: 8px; letter-spacing: .1em; }
  .ph-dosi-top span:last-child, .ph-dosi-bottom span:last-child { text-align: right; }
  .ph-dosi-main { grid-template-columns: 1fr; gap: 32px; padding: 48px 0; }
  .ph-dosi-main h2 { font-size: 104px; }
  .ph-work #works > .container > h2,
  .ph-stories #stories-magazine h2,
  .ph-info #contact h2 { font-size: 48px !important; }
  .ph-work .portfolio-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .ph-stories .sticky-subheader { top: 68px; }
  .ph-stories #stories-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .ph-info #about p { font-size: 32px !important; }
  .ph-info .form-container { padding: 24px !important; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  body.ph-site *, body.ph-site *::before, body.ph-site *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
}


/* ===== Refinement pass: viewport-safe film, book-like STORIES, paper INFO ===== */

/* Cover the full viewport using a consistent 16:9 iframe geometry at every aspect ratio. */
.ph-site.ph-home .ph-home-hero {
  height: 100svh;
  min-height: 560px;
}
.ph-site.ph-home .ph-home-hero iframe {
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  width: max(100vw, 177.7778svh) !important;
  height: max(56.25vw, 100svh) !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  transform: translate(-50%, -50%) scale(1.065) !important;
  transform-origin: center;
  border: 0 !important;
}
.ph-site.ph-home .ph-home-hero::after {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 0;
  left: 0;
  height: 12%;
  content: "";
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(243,241,236,.18));
}
.ph-site.ph-home .ph-home-hero::before { z-index: 2; }
.ph-site.ph-home .ph-hero-copy { z-index: 3; }

/* Remove the former city clock row; footers stay as quiet signatures. */
.ph-site footer .ph-footer-location-clock { display: none !important; }

/* STORIES — a two-page editorial book, no phone frames or cards. */
.ph-stories #stories-magazine {
  padding: clamp(36px, 6vw, 88px) 0 clamp(72px, 9vw, 132px);
}
.ph-stories #stories-magazine > .container {
  width: min(calc(100% - 88px), 1440px) !important;
  padding-top: 0 !important;
}
.ph-stories .ph-stories-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(220px, .58fr);
  align-items: end;
  gap: 32px;
  padding: clamp(12px, 3vw, 40px) 0 clamp(34px, 5vw, 72px);
  border-bottom: 1px solid var(--ph-line);
}
.ph-stories .ph-stories-heading h1 {
  margin: 0;
  color: var(--ph-charcoal);
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(62px, 10vw, 140px);
  font-weight: 400;
  letter-spacing: -.055em;
  line-height: .78;
}
.ph-stories .ph-stories-heading p {
  max-width: 380px;
  margin: 0;
  color: var(--ph-muted);
  font-size: 12px;
  line-height: 1.9;
}
.ph-stories .ph-stories-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 22px 0 0;
  color: var(--ph-muted);
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.ph-stories .ph-stories-toolbar label { flex-shrink: 0; }
.ph-stories #story-index-select {
  width: min(52vw, 520px);
  padding: 10px 28px 10px 0;
  border: 0;
  border-bottom: 1px solid var(--ph-line);
  border-radius: 0;
  background: transparent;
  color: var(--ph-charcoal);
  font-family: inherit;
  font-size: 11px;
  letter-spacing: .04em;
  outline-offset: 5px;
}
.ph-stories #story-index-select option { background: var(--ph-ivory); color: var(--ph-charcoal); }
.ph-stories .ph-book-spread {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: clamp(26px, 4.4vw, 72px);
  position: relative;
  padding: clamp(36px, 5vw, 76px) 0 clamp(32px, 4vw, 58px);
}
.ph-stories .ph-book-spread::after {
  position: absolute;
  z-index: 3;
  top: clamp(30px, 4vw, 60px);
  bottom: clamp(30px, 4vw, 60px);
  left: 50%;
  width: 1px;
  content: "";
  pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(41,40,36,.09) 12%, rgba(41,40,36,.14) 50%, rgba(41,40,36,.06) 88%, transparent);
}
.ph-stories .ph-book-page {
  display: flex;
  flex-direction: column;
  min-width: 0;
  cursor: pointer;
  color: var(--ph-charcoal);
  animation: phPageArrive .42s ease both;
  outline-offset: 6px;
}
.ph-stories .ph-book-page:nth-child(2) { animation-delay: .06s; }
@keyframes phPageArrive {
  from { opacity: .25; transform: translateY(8px) rotateY(-2deg); }
  to { opacity: 1; transform: translateY(0) rotateY(0); }
}
.ph-stories .ph-book-page-visual {
  position: relative;
  width: 100%;
  aspect-ratio: 1.12 / 1;
  overflow: hidden;
  background: var(--ph-stone);
}
.ph-stories .ph-book-page-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0 !important;
  transition: transform .8s cubic-bezier(.2,.65,.3,1);
}
.ph-stories .ph-book-page:hover .ph-book-page-visual img { transform: scale(1.025); }
.ph-stories .ph-book-visual-index {
  position: absolute;
  right: 14px;
  bottom: 14px;
  padding: 8px 10px;
  color: #f8f6f0;
  background: rgba(41,40,36,.62);
  font-size: 8px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.ph-stories .ph-book-page-meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 18px 0 10px;
  border-bottom: 1px solid var(--ph-line);
  color: var(--ph-muted);
  font-size: 8px;
  letter-spacing: .15em;
  line-height: 1.5;
  text-transform: uppercase;
}
.ph-stories .ph-book-page-meta time { letter-spacing: .08em; text-align: right; }
.ph-stories .ph-book-page h2 {
  margin: 17px 0 12px;
  color: var(--ph-charcoal);
  font-family: 'Cormorant Garamond', Georgia, serif;
  font-size: clamp(25px, 3vw, 42px);
  font-weight: 500;
  letter-spacing: -.025em;
  line-height: 1.04;
}
.ph-stories .ph-book-page-note {
  max-width: 560px;
  margin: 0;
  color: #69665e;
  font-size: 12px;
  line-height: 1.9;
}
.ph-stories .ph-book-page-action {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  width: fit-content;
  margin-top: 20px;
  padding-bottom: 5px;
  border-bottom: 1px solid var(--ph-line);
  color: var(--ph-charcoal);
  font-size: 8px;
  letter-spacing: .15em;
  text-transform: uppercase;
}
.ph-stories .ph-book-controls {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 18px;
  padding-top: 20px;
  border-top: 1px solid var(--ph-line);
}
.ph-stories .ph-book-control {
  width: fit-content;
  padding: 12px 0;
  border: 0;
  background: transparent;
  color: var(--ph-charcoal);
  cursor: pointer;
  font-family: inherit;
  font-size: 9px;
  letter-spacing: .16em;
  text-transform: uppercase;
}
.ph-stories .ph-book-control:last-child { justify-self: end; text-align: right; }
.ph-stories .ph-book-control:disabled { cursor: not-allowed; opacity: .28; }
.ph-stories .ph-book-page-count {
  color: var(--ph-muted);
  font-size: 9px;
  letter-spacing: .15em;
  white-space: nowrap;
}

/* INFO — a quiet paper sheet against mineral texture, with a clear working form. */
body.ph-info {
  min-height: 100vh;
  background-color: #c9c6bf !important;
  background-image:
    radial-gradient(ellipse at 16% 12%, rgba(255,255,255,.42), transparent 38%),
    radial-gradient(ellipse at 84% 78%, rgba(104,99,91,.14), transparent 44%),
    repeating-linear-gradient(114deg, rgba(255,255,255,.035) 0 1px, rgba(77,73,66,.025) 1px 2px, transparent 2px 7px);
  background-attachment: fixed;
}
.ph-info .ph-header,
.ph-info main,
.ph-info footer {
  width: min(760px, calc(100% - 48px)) !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  background: #fbfaf7 !important;
  box-sizing: border-box;
}
.ph-info .ph-header {
  position: relative;
  top: auto;
  margin-top: clamp(24px, 7vh, 84px) !important;
  border-bottom: 1px solid #dedbd4 !important;
  backdrop-filter: none;
}
.ph-info .ph-header-inner {
  width: calc(100% - clamp(36px, 7vw, 88px));
  min-height: 72px;
}
.ph-info main {
  padding: 0 clamp(22px, 6.5vw, 72px) clamp(44px, 6vw, 76px) !important;
}
.ph-info .ph-contact-cover { padding: clamp(32px, 5vw, 60px) 0 0; }
.ph-info .ph-contact-kicker {
  margin: 0 0 22px;
  color: #7b776d;
  font-size: 9px;
  letter-spacing: .17em;
  text-transform: uppercase;
}
.ph-info .ph-contact-title {
  margin: 0 0 clamp(26px, 4vw, 42px);
  color: #20201d;
  font-family: 'Inter', 'Noto Sans KR', sans-serif;
  font-size: clamp(38px, 6vw, 62px);
  font-weight: 500;
  letter-spacing: -.055em;
  line-height: .96;
}
.ph-info .ph-contact-details {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  padding-bottom: clamp(28px, 4.5vw, 54px);
}
.ph-info .ph-contact-details h2 {
  margin: 0 0 10px;
  color: #77736a;
  font-size: 8px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.ph-info .ph-contact-details p,
.ph-info .ph-contact-details a {
  margin: 0;
  color: #292824 !important;
  font-size: 10px;
  line-height: 1.85;
  overflow-wrap: anywhere;
  text-decoration: none;
}
.ph-info .ph-contact-details a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ph-info .ph-contact-artwork {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1.84 / 1;
  object-fit: cover;
  margin: 0 0 24px;
}
.ph-info .ph-contact-note {
  max-width: 460px;
  margin: 0 auto 18px;
  color: #77736a !important;
  font-size: 10px;
  line-height: 1.85;
  text-align: center;
}
.ph-info .ph-contact-cta-row { display: flex; justify-content: center; padding: 0 0 clamp(42px, 6vw, 70px); }
.ph-info .ph-contact-cta {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 160px;
  padding: 13px 20px;
  background: #e8e5df;
  color: #292824 !important;
  font-size: 8px;
  font-weight: 500;
  letter-spacing: .13em;
  text-decoration: none;
  text-transform: uppercase;
  transition: background .2s ease, color .2s ease;
}
.ph-info .ph-contact-cta:hover { background: var(--ph-charcoal); color: var(--ph-ivory) !important; }
.ph-info #about { padding: 0 0 38px !important; }
.ph-info #about p { font-family: 'Cormorant Garamond', Georgia, serif; font-size: clamp(22px, 3vw, 30px) !important; text-align: left; }
.ph-info #contact { padding: 30px 0 0 !important; border-top: 1px solid #dedbd4; }
.ph-info #contact h2 { font-size: 28px !important; text-align: left !important; margin: 0 0 10px !important; }
.ph-info #contact > .container { width: 100% !important; }
.ph-info #contact > .container > .text-center { margin: 0 0 30px !important; }
.ph-info #contact .form-container { padding: 0 !important; border: 0 !important; background: transparent !important; }
.ph-info #contact .form-container > .grid,
.ph-info #contact .form-container > .border-t { padding-top: 20px; }
.ph-info #contact .form-input { font-size: 12px; }
.ph-info #contact .submit-btn { min-width: 172px; }
.ph-info footer {
  margin-bottom: clamp(24px, 7vh, 84px) !important;
  border-top: 1px solid #dedbd4 !important;
}
.ph-info footer .container { width: calc(100% - clamp(36px, 7vw, 88px)); }
.ph-info #notification { position: fixed; }

/* Responsive adjustments for a real spread on desktop and page-by-page reading on mobile. */
@media (max-width: 767px) {
  .ph-site.ph-home .ph-home-hero { min-height: 560px; height: 88svh; }
  .ph-site.ph-home .ph-home-hero iframe {
    width: max(100vw, 177.7778svh) !important;
    height: max(56.25vw, 100svh) !important;
    transform: translate(-50%, -50%) scale(1.075) !important;
  }
  .ph-stories #stories-magazine > .container { width: calc(100% - 36px) !important; }
  .ph-stories .ph-stories-heading { grid-template-columns: 1fr; gap: 22px; padding-bottom: 28px; }
  .ph-stories .ph-stories-heading h1 { font-size: 76px; }
  .ph-stories .ph-stories-heading p { max-width: 360px; }
  .ph-stories .ph-stories-toolbar { align-items: flex-start; flex-wrap: wrap; gap: 12px; }
  .ph-stories #story-index-select { flex: 1; min-width: 180px; width: auto; }
  .ph-stories .ph-book-spread { grid-template-columns: 1fr; gap: 40px; padding: 28px 0; }
  .ph-stories .ph-book-spread::after { display: none; }
  .ph-stories .ph-book-spread:not(.is-single-page) .ph-book-page:nth-child(n+2) { display: none; }
  .ph-stories .ph-book-page-visual { aspect-ratio: 1.02 / 1; }
  .ph-stories .ph-book-page h2 { font-size: 34px; }
  .ph-stories .ph-book-page-note { font-size: 12px; }
  .ph-stories .ph-book-controls { grid-template-columns: 1fr auto 1fr; gap: 8px; }
  .ph-stories .ph-book-control { font-size: 8px; letter-spacing: .08em; }
  .ph-info .ph-header,
  .ph-info main,
  .ph-info footer { width: calc(100% - 24px) !important; }
  .ph-info .ph-header { margin-top: 12px !important; }
  .ph-info main { padding: 0 22px 42px !important; }
  .ph-info .ph-contact-title { font-size: 48px; }
  .ph-info .ph-contact-details { grid-template-columns: 1fr 1fr; gap: 22px 16px; }
  .ph-info .ph-contact-details > :last-child { grid-column: 1 / -1; }
  .ph-info .ph-contact-artwork { aspect-ratio: 1.15 / 1; }
  .ph-info #about p { font-size: 26px !important; }
  .ph-info #contact h2 { font-size: 26px !important; }
  .ph-info .form-container { padding: 0 !important; }
}


.ph-stories .ph-book-controls {
  margin: 18px 0 0;
  padding: 15px 0 18px;
  border-top: 0;
  border-bottom: 1px solid var(--ph-line);
}
.ph-stories .ph-book-page-visual--placeholder {
  background:
    radial-gradient(ellipse at 68% 25%, rgba(255,255,255,.7), transparent 40%),
    linear-gradient(140deg, #ddd9d0, #c9c5bc 48%, #e5e1d8);
}
.ph-stories .ph-book-page-visual--placeholder::before {
  position: absolute;
  inset: 9% 8%;
  content: "";
  border: 1px solid rgba(41,40,36,.13);
  background:
    linear-gradient(123deg, transparent 0 42%, rgba(255,255,255,.3) 42.2% 42.7%, transparent 43%),
    radial-gradient(ellipse at 24% 74%, rgba(168,149,105,.18), transparent 42%);
}
.ph-stories .ph-book-page-visual--placeholder::after {
  position: absolute;
  right: 12%;
  bottom: 12%;
  left: 12%;
  height: 1px;
  content: "";
  background: rgba(41,40,36,.18);
}


/* Reserve media space for the home portfolio even before external thumbnails load. */
.ph-home .portfolio-item {
  aspect-ratio: 16 / 9;
  min-height: clamp(180px, 24vw, 420px);
  background:
    radial-gradient(ellipse at 68% 24%, rgba(255,255,255,.62), transparent 40%),
    linear-gradient(140deg, #ddd9d0, #c9c5bc 48%, #e5e1d8);
}
.ph-home .portfolio-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 767px) {
  .ph-home .portfolio-item { min-height: 180px; }
}


/* INFO page: match the reference with one quiet paper sheet and only essential content. */
.ph-info .ph-header,
.ph-info main,
.ph-info footer {
  width: min(740px, calc(100% - 48px)) !important;
  max-width: 740px !important;
}
.ph-info .ph-header {
  margin-top: clamp(26px, 9vh, 108px) !important;
  border-bottom: 0 !important;
}
.ph-info .ph-header-inner {
  width: calc(100% - clamp(34px, 6.2vw, 84px)) !important;
  min-height: clamp(64px, 7vw, 84px) !important;
}
.ph-info .ph-nav { display: none !important; }
.ph-info .ph-menu-toggle {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}
.ph-info .ph-header { z-index: 100; }
.ph-info .ph-mobile-menu { width: 100%; }
.ph-info main.ph-contact-main {
  padding: 0 clamp(28px, 6.2vw, 68px) 0 !important;
  background: #fbfaf7 !important;
}
.ph-info .ph-contact-sheet { padding: clamp(24px, 4vw, 44px) 0 0; }
.ph-info .ph-contact-kicker {
  margin: 0 0 24px;
  color: #35342f;
  font-size: 8px;
  font-weight: 600;
  letter-spacing: .18em;
  line-height: 1.6;
  text-transform: uppercase;
}
.ph-info .ph-contact-title {
  margin: 0 0 clamp(27px, 4.1vw, 44px) !important;
  color: #171715 !important;
  font-family: 'Inter', 'Arial Narrow', sans-serif !important;
  font-size: clamp(42px, 5vw, 56px) !important;
  font-weight: 600 !important;
  letter-spacing: -.055em !important;
  line-height: .98 !important;
  text-align: left !important;
}
.ph-info .ph-contact-details {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(12px, 2vw, 24px);
  padding-bottom: clamp(36px, 5vw, 58px);
}
.ph-info .ph-contact-details h2 {
  margin: 0 0 10px;
  color: #30302c;
  font-size: 8px;
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: none;
}
.ph-info .ph-contact-details p,
.ph-info .ph-contact-details a {
  display: block;
  margin: 0;
  color: #2e2d29 !important;
  font-size: 9px;
  font-weight: 400;
  line-height: 1.9;
  overflow-wrap: anywhere;
  text-decoration: none;
}
.ph-info .ph-contact-details a:hover { text-decoration: underline; text-underline-offset: 3px; }
.ph-info .ph-contact-artwork {
  display: block;
  width: 100%;
  aspect-ratio: 1.28 / 1;
  height: auto;
  margin: 0 0 clamp(25px, 3.6vw, 40px);
  object-fit: cover;
  background: #cbc7be;
}
.ph-info .ph-contact-note {
  max-width: 390px;
  margin: 0 auto 17px;
  color: #383732 !important;
  font-size: 9px;
  line-height: 1.8;
  text-align: center;
}
.ph-info .ph-contact-cta-row {
  display: flex;
  justify-content: center;
  padding: 0 0 clamp(34px, 5vw, 52px);
}
.ph-info .ph-contact-cta {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 116px;
  min-height: 28px;
  padding: 9px 17px;
  border: 0;
  border-radius: 0;
  background: #e8e5e0;
  color: #25241f !important;
  cursor: pointer;
  font-family: inherit;
  font-size: 7px;
  font-weight: 600;
  letter-spacing: .07em;
  line-height: 1.2;
  text-decoration: none;
  text-transform: uppercase;
  transition: background .2s ease, color .2s ease;
}
.ph-info .ph-contact-cta:hover { background: #292824; color: #f3f1ec !important; }
.ph-info #contact.ph-inquiry-hidden { display: none !important; }
.ph-info #contact {
  margin: 0;
  padding: 34px 0 54px !important;
  border-top: 1px solid #dedbd4;
  background: #fbfaf7 !important;
}
.ph-info #contact h2 {
  margin: 0 0 12px !important;
  color: #22211e !important;
  font-size: 24px !important;
  font-weight: 500;
  letter-spacing: -.035em;
  text-align: left !important;
}
.ph-info #contact > .container {
  width: 100% !important;
  max-width: none !important;
}
.ph-info #contact > .container > .text-center {
  margin: 0 0 25px !important;
  text-align: left !important;
}
.ph-info #contact .form-container {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.ph-info #contact .form-container > .grid,
.ph-info #contact .form-container > .border-t { padding-top: 22px; }
.ph-info #contact .form-input {
  font-size: 12px;
  background: transparent !important;
}
.ph-info #contact .submit-btn { min-width: 170px; }
.ph-info footer { display: none !important; }
.ph-info #notification { position: fixed; }
@media (max-width: 767px) {
  .ph-info .ph-header,
  .ph-info main,
  .ph-info footer { width: calc(100% - 24px) !important; }
  .ph-info .ph-header { margin-top: 12px !important; }
  .ph-info .ph-header-inner { width: calc(100% - 36px) !important; }
  .ph-info main.ph-contact-main { padding: 0 22px !important; }
  .ph-info .ph-contact-sheet { padding-top: 22px; }
  .ph-info .ph-contact-title { margin-bottom: 27px !important; font-size: 43px !important; }
  .ph-info .ph-contact-details { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 16px; padding-bottom: 28px; }
  .ph-info .ph-contact-details > :last-child { grid-column: 1 / -1; }
  .ph-info .ph-contact-artwork { aspect-ratio: 1.12 / 1; margin-bottom: 24px; }
  .ph-info .ph-contact-note { max-width: 310px; }
  .ph-info .ph-contact-cta-row { padding-bottom: 34px; }
  .ph-info #contact { padding: 26px 0 40px !important; }
}


/* Request form opens as a focused, dismissible overlay; the reference page stays minimal. */
body.ph-info.ph-inquiry-modal-open { overflow: hidden; }
.ph-info #contact:not(.ph-inquiry-hidden) {
  position: fixed !important;
  z-index: 1000;
  inset: 0 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100vw !important;
  max-width: none !important;
  height: 100vh;
  height: 100dvh;
  margin: 0 !important;
  padding: 32px 18px !important;
  overflow-y: auto;
  border: 0 !important;
  background: rgba(36,35,31,.68) !important;
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}
.ph-info #contact:not(.ph-inquiry-hidden) > .container {
  position: relative;
  width: min(720px, 100%) !important;
  max-width: 720px !important;
  max-height: calc(100dvh - 64px);
  margin: auto !important;
  padding: clamp(24px, 4vw, 48px) !important;
  overflow-y: auto;
  border: 1px solid rgba(41,40,36,.14);
  background: #fbfaf7 !important;
  box-shadow: 0 24px 100px rgba(0,0,0,.22);
}
.ph-info .ph-inquiry-close {
  position: absolute;
  top: 15px;
  right: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  color: #292824;
  cursor: pointer;
  font-family: Arial, sans-serif;
  font-size: 28px;
  font-weight: 300;
  line-height: 1;
}
.ph-info .ph-inquiry-close:hover { color: #9a8355; }
.ph-info #contact:not(.ph-inquiry-hidden) #inquiry-title { padding-right: 40px; }
@media (max-width: 767px) {
  .ph-info #contact:not(.ph-inquiry-hidden) { align-items: flex-start; padding: 12px !important; }
  .ph-info #contact:not(.ph-inquiry-hidden) > .container {
    max-height: calc(100dvh - 24px);
    padding: 26px 20px !important;
  }
  .ph-info .ph-inquiry-close { top: 8px; right: 8px; }
}


/* Official PHANEROEL logo asset: preserve the supplied gold lockup exactly. */
.ph-wordmark img {
  filter: none !important;
  mix-blend-mode: normal !important;
  opacity: 1;
}
:root {
  --ph-brand-ink: #141414;
  --ph-brand-white: #FFFFFF;
  --ph-brand-gold: #BDA076;
}


/* CONTACT — faithful reconstruction of the exact supplied reference screenshot.
   Desktop uses the reference itself as the concrete background and crops its original inner photograph. */
body.ph-info {
  margin: 0 !important;
  min-height: 100vw !important;
  background-color: #c6c3bc !important;
  background-image: url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/9bee2239-d6e4-4dcb-93c6-ada35f3bdb76.png") !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: 100vw 100vw !important;
}
.ph-info .ph-header {
  position: relative !important;
  top: auto !important;
  z-index: 20;
  width: 56.1vw !important;
  max-width: none !important;
  margin: 10.9vw auto 0 !important;
  padding: 0 !important;
  background: #fbfaf7 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.ph-info .ph-header-inner {
  width: 88% !important;
  min-height: 4.5vw !important;
  height: 4.5vw !important;
  margin: 0 auto !important;
  gap: 10px !important;
}
.ph-info .ph-wordmark img {
  display: block !important;
  width: 7.7vw !important;
  height: auto !important;
  max-width: none !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}
.ph-info .ph-nav { display: none !important; }
.ph-info .ph-menu-toggle {
  display: inline-flex !important;
  width: 22px !important;
  height: 22px !important;
  padding: 2px !important;
  color: #141414 !important;
}
.ph-info .ph-menu-toggle i { font-size: 13px !important; }
.ph-info .ph-mobile-menu {
  position: absolute;
  right: 0;
  left: 0;
  width: 100%;
  background: #fbfaf7 !important;
  border-top: 1px solid #e8e5de !important;
}
.ph-info .ph-mobile-link {
  color: #292824 !important;
  font-size: 10px !important;
  padding: 12px 6% !important;
}
.ph-info main.ph-contact-main {
  box-sizing: border-box;
  display: block;
  width: 56.1vw !important;
  max-width: none !important;
  min-height: 73.4vw;
  margin: 0 auto !important;
  padding: 4.1vw 0 4.8vw !important;
  background: #fbfaf7 !important;
  color: #161616 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
.ph-info .ph-contact-inner {
  width: 88% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 !important;
}
.ph-info .ph-contact-kicker {
  margin: 0 !important;
  color: #191919 !important;
  font-size: .43vw !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase;
}
.ph-info .ph-contact-title {
  margin: 3.9vw 0 0 !important;
  color: #101010 !important;
  font-family: 'Arial Narrow', 'Roboto Condensed', 'Inter', sans-serif !important;
  font-size: 3.05vw !important;
  font-weight: 600 !important;
  line-height: .98 !important;
  letter-spacing: -.045em !important;
  text-align: left !important;
}
.ph-info .ph-contact-details {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 1.5vw !important;
  min-height: 3.3vw;
  margin: 2.8vw 0 0 !important;
  padding: 0 !important;
}
.ph-info .ph-contact-detail { min-width: 0; color: #20201d !important; }
.ph-info .ph-contact-detail p,
.ph-info .ph-contact-detail a {
  display: block;
  margin: 0 !important;
  color: #242420 !important;
  font-family: 'Inter', Arial, sans-serif !important;
  font-size: .63vw !important;
  font-weight: 400 !important;
  line-height: 1.75 !important;
  letter-spacing: -.01em;
  overflow-wrap: anywhere;
  text-decoration: none;
}
.ph-info .ph-contact-detail a:hover { text-decoration: underline; text-underline-offset: 2px; }
.ph-info .ph-contact-artwork {
  display: block;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 792 / 615;
  margin: 9.4vw auto 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  background-image: url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/9bee2239-d6e4-4dcb-93c6-ada35f3bdb76.png") !important;
  background-repeat: no-repeat !important;
  background-size: 202% 260% !important;
  background-position: 50.75% 62% !important;
}
.ph-info .ph-contact-note {
  max-width: none !important;
  margin: 2.8vw 0 0 !important;
  color: #191919 !important;
  font-family: 'Inter', Arial, sans-serif !important;
  font-size: .43vw !important;
  font-weight: 400 !important;
  line-height: 1.6 !important;
  text-align: center !important;
}
.ph-info .ph-contact-cta-row {
  display: flex !important;
  align-items: center;
  justify-content: center;
  margin: 1.5vw 0 0 !important;
  padding: 0 !important;
}
.ph-info .ph-contact-cta {
  display: inline-flex !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: .57vw 1.0vw !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #e5e2dd !important;
  color: #1a1a18 !important;
  cursor: pointer;
  font-family: 'Inter', Arial, sans-serif !important;
  font-size: .42vw !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase;
  box-shadow: none !important;
  transition: background .2s ease, color .2s ease;
}
.ph-info .ph-contact-cta:hover { background: #d7d3cc !important; color: #111 !important; }
.ph-info footer { display: none !important; }
.ph-info #notification {
  z-index: 2000;
  background: #292824 !important;
  color: #fbfaf7 !important;
  border: 0 !important;
  border-radius: 0 !important;
}
body.ph-info.ph-inquiry-modal-open { overflow: hidden !important; }
.ph-info #contact.ph-contact-form-section.ph-inquiry-hidden { display: none !important; }
.ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) {
  position: fixed !important;
  z-index: 1000 !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  width: 100vw !important;
  max-width: none !important;
  height: 100vh !important;
  height: 100dvh !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 24px !important;
  overflow-y: auto !important;
  background: rgba(24,23,21,.72) !important;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
}
.ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) > .container {
  position: relative;
  width: min(720px, 100%) !important;
  max-width: 720px !important;
  max-height: calc(100dvh - 48px);
  margin: auto !important;
  padding: 42px !important;
  overflow-y: auto !important;
  background: #fbfaf7 !important;
  color: #292824 !important;
  border: 1px solid rgba(41,40,36,.15);
  box-shadow: 0 20px 80px rgba(0,0,0,.24);
}
.ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) h2 {
  margin: 0 0 12px !important;
  padding-right: 35px;
  color: #292824 !important;
  font-family: 'Inter',Arial,sans-serif !important;
  font-size: 25px !important;
  font-weight: 500 !important;
  text-align: left !important;
}
.ph-info .ph-inquiry-close {
  position: absolute;
  top: 12px;
  right: 16px;
  width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  color: #292824;
  cursor: pointer;
  font-size: 27px;
}
.ph-info #contact.ph-contact-form-section .form-container {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.ph-info #contact.ph-contact-form-section .form-input { color: #242420 !important; background: transparent !important; }
.ph-info #contact.ph-contact-form-section .form-input::placeholder { color: #89857c !important; }
.ph-info #contact.ph-contact-form-section .submit-btn { border-radius: 0 !important; background: #292824 !important; color: #fbfaf7 !important; }
@media (max-width: 767px) {
  body.ph-info {
    min-height: 100vh !important;
    background-image: linear-gradient(90deg, rgba(34,33,30,.34), transparent 13%), linear-gradient(180deg, #cbc8c0, #b9b6ae 60%, #c6c3bb) !important;
    background-size: auto !important;
  }
  .ph-info .ph-header { width: 90vw !important; margin: 22px auto 0 !important; }
  .ph-info .ph-header-inner { width: 88% !important; min-height: 56px !important; height: 56px !important; }
  .ph-info .ph-wordmark img { width: 112px !important; }
  .ph-info main.ph-contact-main { width: 90vw !important; min-height: 0 !important; padding: 36px 0 34px !important; }
  .ph-info .ph-contact-inner { width: 88% !important; }
  .ph-info .ph-contact-kicker { font-size: 7px !important; }
  .ph-info .ph-contact-title { margin-top: 44px !important; font-size: 36px !important; }
  .ph-info .ph-contact-details { grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap: 22px 13px !important; min-height: 0; margin-top: 28px !important; }
  .ph-info .ph-contact-detail:last-child { grid-column: 1 / -1; }
  .ph-info .ph-contact-detail p, .ph-info .ph-contact-detail a { font-size: 9px !important; line-height: 1.8 !important; }
  .ph-info .ph-contact-artwork { margin-top: 54px !important; }
  .ph-info .ph-contact-note { margin-top: 24px !important; font-size: 8px !important; }
  .ph-info .ph-contact-cta-row { margin-top: 18px !important; }
  .ph-info .ph-contact-cta { padding: 10px 16px !important; font-size: 8px !important; }
  .ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) { padding: 12px !important; }
  .ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) > .container { max-height: calc(100dvh - 24px); padding: 28px 20px !important; }
}


/* Fine alignment pass against the supplied 1600 × 1600 reference. */
.ph-info .ph-contact-kicker { display: none !important; }
@media (min-width: 768px) {
  .ph-info .ph-contact-title { margin: 0 !important; }
  .ph-info .ph-wordmark img { width: 6.8vw !important; }
}


/* ===== CONTACT final composition: separate concrete, paper, and artwork layers ===== */
/* Restore the exact shared site header. CONTACT changes its content, not the navigation system. */
body.ph-info {
  margin: 0 !important;
  min-height: 100vh !important;
  background-color: #c8c5bd !important;
  background-image: url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/5cb73b09-f0cc-4740-b427-9ec0aa0eb273.jpg") !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: cover !important;
  background-attachment: fixed !important;
}
.ph-info .ph-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 100 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 84px !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: rgba(243,241,236,.95) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(41,40,36,.13) !important;
  box-shadow: none !important;
  backdrop-filter: blur(16px) !important;
  -webkit-backdrop-filter: blur(16px) !important;
}
.ph-info .ph-header-inner {
  width: min(calc(100% - 88px), var(--ph-content)) !important;
  min-height: 84px !important;
  height: auto !important;
  margin: 0 auto !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 32px !important;
}
.ph-info .ph-wordmark { flex-shrink: 0 !important; }
.ph-info .ph-wordmark img {
  display: block !important;
  width: auto !important;
  height: 33px !important;
  max-width: 220px !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  object-fit: contain !important;
}
.ph-info .ph-nav {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: clamp(20px, 3vw, 48px) !important;
}
.ph-info .ph-nav-link {
  padding: 10px 0 !important;
  color: var(--ph-charcoal) !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: .15em !important;
  text-decoration: none !important;
}
.ph-info .ph-menu-toggle { display: none !important; }
.ph-info .ph-mobile-menu { display: none; }
.ph-info .ph-mobile-menu:not(.hidden) { display: flex; }

/* A single centered sheet, textured as paper and given a real soft perimeter shadow. */
.ph-info main.ph-contact-main {
  box-sizing: border-box !important;
  display: block !important;
  width: min(1060px, calc(100% - 80px)) !important;
  max-width: 1060px !important;
  min-height: 0 !important;
  margin: clamp(28px, 3vw, 44px) auto clamp(64px, 6vw, 96px) !important;
  padding: clamp(46px, 4.2vw, 68px) clamp(38px, 6vw, 90px) clamp(42px, 4.5vw, 72px) !important;
  overflow: hidden !important;
  color: #171715 !important;
  background-color: #faf9f6 !important;
  background-image:
    linear-gradient(rgba(250,249,246,.72), rgba(250,249,246,.72)),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg") !important;
  background-repeat: repeat, repeat !important;
  background-position: center, left top !important;
  background-size: auto, 450px 450px !important;
  border: 1px solid rgba(255,255,255,.68) !important;
  border-radius: 0 !important;
  box-shadow:
    0 1px 1px rgba(22,20,18,.05),
    0 7px 24px rgba(22,20,18,.11),
    0 28px 65px rgba(22,20,18,.06) !important;
}
.ph-info .ph-contact-inner {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.ph-info .ph-contact-kicker { display: none !important; }
.ph-info .ph-contact-title {
  margin: 0 !important;
  padding: 0 !important;
  color: #141414 !important;
  font-family: "Roboto Condensed", "Arial Narrow", Arial, sans-serif !important;
  font-size: clamp(40px, 4vw, 58px) !important;
  font-weight: 700 !important;
  line-height: .98 !important;
  letter-spacing: -.055em !important;
  text-align: left !important;
  text-shadow: 0 0 .28px rgba(20,20,20,.46);
}
.ph-info .ph-contact-details {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  align-items: start !important;
  gap: clamp(18px, 3vw, 42px) !important;
  margin: clamp(30px, 3.2vw, 48px) 0 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
}
.ph-info .ph-contact-detail { min-width: 0 !important; }
.ph-info .ph-contact-detail p,
.ph-info .ph-contact-detail a {
  display: block !important;
  margin: 0 !important;
  color: #242420 !important;
  font-family: "Inter", Arial, sans-serif !important;
  font-size: clamp(10px, .76vw, 11.5px) !important;
  font-weight: 400 !important;
  line-height: 1.8 !important;
  letter-spacing: -.012em !important;
  overflow-wrap: anywhere !important;
  text-decoration: none !important;
}
.ph-info .ph-contact-detail a:hover {
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}
.ph-info .ph-contact-artwork {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  aspect-ratio: 792 / 615 !important;
  margin: clamp(52px, 6vw, 88px) auto 0 !important;
  padding: 0 !important;
  object-fit: cover !important;
  object-position: center !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: 0 1px 2px rgba(18,17,15,.10) !important;
  background: #d0ccc3 !important;
}
.ph-info .ph-contact-note {
  max-width: 100% !important;
  margin: clamp(26px, 3.2vw, 44px) 0 0 !important;
  color: #272622 !important;
  font-family: "Inter", Arial, sans-serif !important;
  font-size: clamp(9px, .68vw, 10px) !important;
  font-weight: 400 !important;
  line-height: 1.7 !important;
  text-align: center !important;
  text-shadow: 0 0 .25px rgba(41,40,36,.25);
}
.ph-info .ph-contact-cta-row {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin: clamp(15px, 1.7vw, 24px) 0 0 !important;
  padding: 0 !important;
}
.ph-info .ph-contact-cta {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 122px !important;
  min-height: 34px !important;
  margin: 0 !important;
  padding: 10px 18px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #e7e4de !important;
  color: #1a1a18 !important;
  font-family: "Inter", Arial, sans-serif !important;
  font-size: 8px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
  cursor: pointer !important;
}
.ph-info .ph-contact-cta:hover { background: #d9d5cd !important; color: #111 !important; }
.ph-info footer { display: none !important; }

/* Preserve request modal behavior; it remains separate from the paper sheet. */
.ph-info #contact.ph-contact-form-section.ph-inquiry-hidden { display: none !important; }
.ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) {
  position: fixed !important;
  z-index: 1000 !important;
  inset: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100vw !important;
  max-width: none !important;
  height: 100vh !important;
  height: 100dvh !important;
  margin: 0 !important;
  padding: 24px !important;
  overflow-y: auto !important;
  background: rgba(24,23,21,.72) !important;
  backdrop-filter: blur(6px) !important;
}
.ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) > .container {
  position: relative !important;
  width: min(720px, 100%) !important;
  max-width: 720px !important;
  max-height: calc(100dvh - 48px) !important;
  margin: auto !important;
  padding: 42px !important;
  overflow-y: auto !important;
  background-color: #faf9f6 !important;
  background-image: url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg") !important;
  background-size: 450px 450px !important;
  color: #292824 !important;
  border: 1px solid rgba(41,40,36,.15) !important;
  box-shadow: 0 20px 80px rgba(0,0,0,.24) !important;
}
.ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) h2 {
  margin: 0 0 12px !important;
  padding-right: 35px !important;
  color: #292824 !important;
  font-size: 25px !important;
  font-weight: 500 !important;
  text-align: left !important;
}
.ph-info .ph-inquiry-close {
  position: absolute !important;
  top: 12px !important;
  right: 16px !important;
  width: 34px !important;
  height: 34px !important;
  border: 0 !important;
  background: transparent !important;
  color: #292824 !important;
  font-size: 27px !important;
  cursor: pointer !important;
}
.ph-info #contact.ph-contact-form-section .form-container {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.ph-info #contact.ph-contact-form-section .form-input { color: #242420 !important; background: transparent !important; }
.ph-info #contact.ph-contact-form-section .form-input::placeholder { color: #89857c !important; }
.ph-info #contact.ph-contact-form-section .submit-btn { border-radius: 0 !important; background: #292824 !important; color: #fbfaf7 !important; }

@media (max-width: 767px) {
  body.ph-info {
    background-size: auto 100vh !important;
    background-position: center top !important;
    background-repeat: repeat-y !important;
    background-attachment: scroll !important;
  }
  .ph-info .ph-header { min-height: 68px !important; }
  .ph-info .ph-header-inner {
    width: calc(100% - 36px) !important;
    min-height: 68px !important;
    gap: 12px !important;
  }
  .ph-info .ph-wordmark img { height: 26px !important; width: auto !important; max-width: 170px !important; }
  .ph-info .ph-nav { display: none !important; }
  .ph-info .ph-menu-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 42px !important;
    height: 42px !important;
    padding: 10px !important;
    color: var(--ph-charcoal) !important;
  }
  .ph-info main.ph-contact-main {
    width: calc(100% - 28px) !important;
    max-width: none !important;
    margin: 18px auto 44px !important;
    padding: 34px 24px 36px !important;
  }
  .ph-info .ph-contact-title { font-size: clamp(34px, 9vw, 44px) !important; }
  .ph-info .ph-contact-details {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 22px 16px !important;
    margin-top: 26px !important;
  }
  .ph-info .ph-contact-detail:last-child { grid-column: 1 / -1; }
  .ph-info .ph-contact-detail p,
  .ph-info .ph-contact-detail a { font-size: 10px !important; line-height: 1.85 !important; }
  .ph-info .ph-contact-artwork { margin-top: 38px !important; }
  .ph-info .ph-contact-note { margin-top: 24px !important; font-size: 9px !important; }
  .ph-info .ph-contact-cta-row { margin-top: 16px !important; }
  .ph-info .ph-contact-cta { min-height: 34px !important; font-size: 8px !important; }
  .ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) { padding: 12px !important; }
  .ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) > .container {
    max-height: calc(100dvh - 24px) !important;
    padding: 28px 20px !important;
  }
}

/* Condensed heading font matches the print-led reference without changing global typography. */


/* ===== Brand refinements: larger original lockup, motto card, physical book spread ===== */
.ph-wordmark img {
  height: 40px !important;
  max-width: 260px !important;
  width: auto !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}
.ph-home .ph-header-inner { min-height: 100px !important; }
.ph-info .ph-wordmark img { height: 40px !important; max-width: 260px !important; }

/* Brand motto overprint: keep the photograph as a photographic layer and typeset the card accurately. */
.ph-info .ph-contact-artwork-scene {
  position: relative;
  width: 100%;
  aspect-ratio: 792 / 615;
  margin: clamp(52px, 6vw, 88px) auto 0;
  isolation: isolate;
  overflow: hidden;
  background: #d0ccc3;
}
.ph-info .ph-contact-artwork-scene > .ph-contact-artwork {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center !important;
}
.ph-info .ph-contact-brand-card {
  position: absolute;
  z-index: 2;
  left: 28.5%;
  top: 38.1%;
  width: 42.5%;
  aspect-ratio: 1.55 / 1;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 4.4% 6.1% 4.4%;
  overflow: hidden;
  background-color: #f7f6f2;
  background-image:
    linear-gradient(rgba(250,249,246,.86), rgba(250,249,246,.86)),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg");
  background-size: auto, 330px 330px;
  background-repeat: repeat;
  border: 1px solid rgba(255,255,255,.78);
  box-shadow: 0 1px 1px rgba(0,0,0,.12), 0 4px 12px rgba(0,0,0,.09);
}
.ph-info .ph-contact-brand-motto {
  margin: 0;
  color: #262520;
  font-family: "Space Mono", "Courier New", monospace;
  font-size: clamp(6px, .64vw, 9px);
  font-weight: 700;
  line-height: 1.75;
  letter-spacing: .045em;
  text-transform: uppercase;
  white-space: nowrap;
}
.ph-info .ph-contact-brand-url {
  margin: 3.5% 0 0;
  color: #77736a;
  font-family: "Space Mono", "Courier New", monospace;
  font-size: clamp(4px, .40vw, 6px);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: .10em;
}
.ph-info .ph-contact-brand-symbol {
  display: block;
  width: 5.2%;
  height: auto;
  margin-top: auto;
  object-fit: contain;
  opacity: .88;
}
.ph-info .ph-contact-artwork-scene { margin-top: clamp(52px, 6vw, 88px) !important; }
.ph-info .ph-contact-artwork-scene > .ph-contact-artwork { margin-top: 0 !important; }
.ph-info .ph-contact-artwork-scene .ph-contact-brand-card { pointer-events: none; }

/* STORIES — a physical open book, with independent paper pages, spine shadow and page edges. */
.ph-stories #stories-magazine {
  background: #e8e5de !important;
  padding: clamp(44px, 6vw, 88px) 0 clamp(84px, 10vw, 140px) !important;
}
.ph-stories #stories-magazine > .container {
  width: min(calc(100% - 88px), 1500px) !important;
  padding-top: 0 !important;
}
.ph-stories .ph-stories-heading {
  border-bottom: 0 !important;
  padding: 0 0 clamp(30px, 4vw, 54px) !important;
}
.ph-stories .ph-stories-heading h1 {
  font-size: clamp(60px, 8vw, 112px) !important;
  line-height: .82 !important;
  letter-spacing: -.06em !important;
}
.ph-stories .ph-stories-heading p {
  max-width: 420px !important;
  font-size: 12px !important;
}
.ph-stories .ph-stories-toolbar {
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: clamp(12px, 2vw, 28px) !important;
  padding: 20px 0 0 !important;
  border-top: 1px solid rgba(41,40,36,.14);
}
.ph-stories .ph-stories-toolbar label {
  color: #77736a !important;
  font-size: 8px !important;
  letter-spacing: .16em !important;
}
.ph-stories #story-index-select {
  width: 100% !important;
  max-width: 540px !important;
  justify-self: center;
  padding: 10px 26px 10px 2px !important;
  border-bottom-color: rgba(41,40,36,.22) !important;
}
.ph-stories .ph-book-controls {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 22px !important;
  padding: 26px 0 22px !important;
  border: 0 !important;
}
.ph-stories .ph-book-control {
  display: inline-flex !important;
  align-items: center !important;
  gap: 12px !important;
  min-width: 120px;
  min-height: 40px;
  padding: 10px 0 !important;
  color: #38362f !important;
  font-family: "Inter", sans-serif !important;
  font-size: 8px !important;
  letter-spacing: .12em !important;
  text-transform: uppercase !important;
}
.ph-stories .ph-book-control:disabled { opacity: .25 !important; }
.ph-stories .ph-book-page-count {
  color: #77736a !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: 19px !important;
  letter-spacing: .03em !important;
}
.ph-stories .ph-book-stage {
  position: relative;
  isolation: isolate;
  width: 100%;
  margin: 0 auto;
  padding: 10px 8px 18px;
  perspective: 2600px;
}
.ph-stories .ph-book-stage::before {
  position: absolute;
  z-index: -2;
  inset: 4px 0 10px;
  content: "";
  background-color: #f5f3ef;
  background-image:
    linear-gradient(rgba(248,247,243,.86), rgba(248,247,243,.86)),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg");
  background-repeat: repeat;
  background-size: auto, 440px 440px;
  box-shadow:
    0 1px 0 #d5d1ca,
    0 3px 0 #e1ddd6,
    0 5px 0 #f0ede7,
    0 16px 36px rgba(35,32,27,.13);
}
.ph-stories .ph-book-edge-stack {
  position: absolute;
  z-index: -3;
  inset: 0 -3px 3px;
  background: #d3cfc7;
  box-shadow: 0 18px 35px rgba(36,33,29,.10);
}
.ph-stories .ph-book-spread {
  position: relative !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
  gap: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  perspective: 2600px;
  transform-style: preserve-3d;
  isolation: isolate;
}
.ph-stories .ph-book-spread::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  background: #f8f7f3;
  background-image:
    linear-gradient(rgba(250,249,246,.82), rgba(250,249,246,.82)),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg");
  background-repeat: repeat;
  background-size: auto, 440px 440px;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.72);
}
.ph-stories .ph-book-spread::after {
  position: absolute !important;
  z-index: 5 !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 50% !important;
  width: 30px !important;
  transform: translateX(-50%);
  content: "" !important;
  pointer-events: none;
  background: linear-gradient(90deg,
    rgba(38,35,30,.025) 0%,
    rgba(38,35,30,.065) 22%,
    rgba(255,255,255,.42) 46%,
    rgba(38,35,30,.10) 68%,
    rgba(38,35,30,.015) 100%);
}
.ph-stories .ph-book-page {
  position: relative !important;
  z-index: 1;
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  min-height: 740px;
  box-sizing: border-box;
  padding: clamp(54px, 6.5vw, 96px) clamp(24px, 4.2vw, 64px) 58px !important;
  overflow: hidden;
  cursor: pointer;
  color: #292824 !important;
  background-color: rgba(250,249,246,.90) !important;
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.10), rgba(240,237,230,.10)),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg") !important;
  background-repeat: repeat !important;
  background-size: auto, 440px 440px !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform-origin: center center;
  backface-visibility: hidden;
}
.ph-stories .ph-book-page:first-child {
  border-right: 1px solid rgba(41,40,36,.045) !important;
  box-shadow: inset -18px 0 28px -28px rgba(31,28,23,.24) !important;
}
.ph-stories .ph-book-page:nth-child(2) {
  border-left: 1px solid rgba(41,40,36,.035) !important;
  box-shadow: inset 18px 0 28px -28px rgba(31,28,23,.20) !important;
}
.ph-stories .ph-book-page::before {
  position: absolute;
  right: clamp(24px, 3.5vw, 52px);
  bottom: 26px;
  left: clamp(24px, 3.5vw, 52px);
  content: "";
  border-bottom: 1px solid rgba(41,40,36,.12);
}
.ph-stories .ph-book-page::after {
  position: absolute;
  right: clamp(24px, 3.5vw, 52px);
  bottom: 9px;
  content: attr(data-page);
  color: #8b877e;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-size: 12px;
  line-height: 1;
}
.ph-stories .ph-book-page-visual {
  position: relative !important;
  width: min(78%, 430px) !important;
  max-width: 430px !important;
  aspect-ratio: .77 / 1 !important;
  height: auto !important;
  margin: 0 auto !important;
  overflow: hidden !important;
  background: #d4d0c7 !important;
  box-shadow: 0 1px 0 rgba(255,255,255,.7), 0 8px 18px rgba(35,32,27,.08) !important;
}
.ph-stories .ph-book-page-visual img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  filter: saturate(.88);
}
.ph-stories .ph-book-visual-index { display: none !important; }
.ph-stories .ph-book-page-meta {
  width: min(78%, 430px) !important;
  margin: 26px auto 0 !important;
  padding: 10px 0 9px !important;
  border-bottom: 1px solid rgba(41,40,36,.15) !important;
  color: #77736a !important;
  font-size: 8px !important;
  letter-spacing: .14em !important;
}
.ph-stories .ph-book-page h2 {
  width: min(78%, 430px) !important;
  margin: 16px auto 10px !important;
  color: #262520 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(24px, 2.2vw, 34px) !important;
  font-weight: 500 !important;
  letter-spacing: -.025em !important;
  line-height: 1.02 !important;
}
.ph-stories .ph-book-page-note {
  width: min(78%, 430px) !important;
  max-width: 430px !important;
  margin: 0 auto !important;
  color: #68655e !important;
  font-size: 10px !important;
  line-height: 1.8 !important;
}
.ph-stories .ph-book-page-action {
  width: min(78%, 430px) !important;
  margin: 16px auto 0 !important;
  padding: 0 0 4px !important;
  border-bottom: 0 !important;
  color: #48453e !important;
  font-size: 7px !important;
  letter-spacing: .14em !important;
}
.ph-stories .ph-book-page-action span { font-size: 12px; }
.ph-stories .ph-book-page--blank { cursor: default !important; }

/* Turn one paper leaf around the centre binding. The reverse face reveals the next chapter. */
.ph-stories .ph-book-turn-page {
  position: absolute;
  z-index: 12;
  top: 0;
  bottom: 0;
  width: 50%;
  overflow: visible;
  pointer-events: none;
  transform-style: preserve-3d;
  will-change: transform;
}
.ph-stories .ph-book-turn-page--next {
  left: 50%;
  transform-origin: left center;
  transform: rotateY(0deg);
  box-shadow: -10px 0 18px rgba(30,27,22,.05);
}
.ph-stories .ph-book-turn-page--prev {
  left: 0;
  transform-origin: right center;
  transform: rotateY(0deg);
  box-shadow: 10px 0 18px rgba(30,27,22,.05);
}
.ph-stories .ph-book-turn-face {
  position: absolute;
  inset: 0;
  overflow: hidden;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.ph-stories .ph-book-turn-back { transform: rotateY(180deg); }
.ph-stories .ph-book-turn-content {
  display: flex !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: clamp(54px, 6.5vw, 96px) clamp(24px, 4.2vw, 64px) 58px !important;
  overflow: hidden !important;
  cursor: default !important;
}
.ph-stories .ph-book-turn-content::before,
.ph-stories .ph-book-turn-content::after { display: none !important; }
.ph-stories .ph-book-turn-page.is-turning.ph-book-turn-page--next {
  animation: phTurnForward .86s cubic-bezier(.2,.68,.18,1) forwards;
}
.ph-stories .ph-book-turn-page.is-turning.ph-book-turn-page--prev {
  animation: phTurnBackward .86s cubic-bezier(.2,.68,.18,1) forwards;
}
@keyframes phTurnForward {
  0% { transform: rotateY(0); box-shadow: -8px 0 12px rgba(30,27,22,.04); }
  45% { box-shadow: -22px 0 34px rgba(30,27,22,.22); }
  100% { transform: rotateY(-180deg); box-shadow: -3px 0 9px rgba(30,27,22,.08); }
}
@keyframes phTurnBackward {
  0% { transform: rotateY(0); box-shadow: 8px 0 12px rgba(30,27,22,.04); }
  45% { box-shadow: 22px 0 34px rgba(30,27,22,.22); }
  100% { transform: rotateY(180deg); box-shadow: 3px 0 9px rgba(30,27,22,.08); }
}
.ph-stories #stories-grid.is-jumping .ph-book-page { animation: phBookIndexJump .26s ease both; }
@keyframes phBookIndexJump {
  from { opacity: .3; transform: translateY(5px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Increase the brand mark on the home page without changing shared nav rhythm. */
.ph-home .ph-wordmark img { height: 45px !important; max-width: 290px !important; }
@media (max-width: 767px) {
  .ph-wordmark img { height: 30px !important; max-width: 190px !important; }
  .ph-home .ph-header-inner { min-height: 82px !important; }
  .ph-home .ph-wordmark img { height: 34px !important; max-width: 210px !important; }
  .ph-info .ph-wordmark img { height: 30px !important; max-width: 190px !important; }
  .ph-info .ph-contact-artwork-scene { margin-top: 38px !important; }
  .ph-info .ph-contact-brand-card {
    padding: 4.1% 5.6% 4.2%;
  }
  .ph-info .ph-contact-brand-motto { font-size: clamp(5px, 1.15vw, 7px); }
  .ph-info .ph-contact-brand-url { font-size: clamp(4px, .75vw, 5px); }
  .ph-stories #stories-magazine > .container { width: calc(100% - 28px) !important; }
  .ph-stories .ph-stories-heading { grid-template-columns: 1fr !important; gap: 18px !important; }
  .ph-stories .ph-stories-heading h1 { font-size: 68px !important; }
  .ph-stories .ph-stories-toolbar {
    grid-template-columns: 1fr auto !important;
    gap: 10px !important;
    align-items: start !important;
  }
  .ph-stories .ph-stories-toolbar label { grid-column: 1 / -1; }
  .ph-stories #story-index-select { grid-row: 2; min-width: 0 !important; }
  .ph-stories .ph-book-controls { padding: 18px 0 14px !important; gap: 8px !important; }
  .ph-stories .ph-book-control { min-width: 0; min-height: 36px; font-size: 7px !important; letter-spacing: .08em !important; }
  .ph-stories .ph-book-page-count { font-size: 15px !important; }
  .ph-stories .ph-book-stage { padding: 6px 4px 12px; }
  .ph-stories .ph-book-spread { grid-template-columns: minmax(0,1fr) !important; }
  .ph-stories .ph-book-spread::after { display: none !important; }
  .ph-stories .ph-book-page {
    min-height: 0 !important;
    padding: 38px 18px 46px !important;
  }
  .ph-stories .ph-book-page:nth-child(2) { display: none !important; }
  .ph-stories .ph-book-page-visual {
    width: min(76%, 320px) !important;
    aspect-ratio: .78 / 1 !important;
  }
  .ph-stories .ph-book-page-meta,
  .ph-stories .ph-book-page h2,
  .ph-stories .ph-book-page-note,
  .ph-stories .ph-book-page-action { width: min(76%, 320px) !important; }
  .ph-stories .ph-book-page h2 { font-size: 27px !important; }
  .ph-stories .ph-book-page-note { font-size: 10px !important; }
  .ph-stories .ph-book-turn-page--next,
  .ph-stories .ph-book-turn-page--prev { left: 0; width: 100%; }
  .ph-stories .ph-book-turn-content { padding: 38px 18px 46px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .ph-stories .ph-book-turn-page.is-turning.ph-book-turn-page--next,
  .ph-stories .ph-book-turn-page.is-turning.ph-book-turn-page--prev { animation-duration: .01ms !important; }
}


/* STORIES boundary treatment — one continuous concrete field behind the shared header and open book. */
body.ph-site.ph-stories {
  min-height: 100vh !important;
  background-color: #c7c4bc !important;
  background-image:
    linear-gradient(
      180deg,
      rgba(243,241,236,.68) 0,
      rgba(243,241,236,.30) 92px,
      rgba(243,241,236,.06) 220px,
      rgba(243,241,236,0) 390px,
      rgba(243,241,236,.03) calc(100% - 360px),
      rgba(243,241,236,.20) calc(100% - 180px),
      rgba(243,241,236,.58) 100%
    ),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/5cb73b09-f0cc-4740-b427-9ec0aa0eb273.jpg") !important;
  background-size: 100% 100%, cover !important;
  background-position: center top, center center !important;
  background-repeat: no-repeat, no-repeat !important;
  background-attachment: scroll, fixed !important;
}
body.ph-site.ph-stories main {
  background: transparent !important;
}
.ph-stories #stories-magazine {
  position: relative !important;
  isolation: isolate !important;
  overflow: clip;
  background: transparent !important;
  padding-top: clamp(48px, 5.5vw, 82px) !important;
  padding-bottom: clamp(72px, 8vw, 124px) !important;
}
.ph-stories #stories-magazine::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  pointer-events: none;
  background: linear-gradient(
    180deg,
    rgba(247,245,240,.17) 0,
    rgba(247,245,240,.045) 12%,
    transparent 24%,
    transparent 78%,
    rgba(247,245,240,.07) 90%,
    rgba(247,245,240,.23) 100%
  );
}
.ph-stories #stories-magazine > .container {
  position: relative;
  z-index: 1;
}
.ph-stories .ph-stories-heading,
.ph-stories .ph-stories-toolbar,
.ph-stories .ph-book-controls {
  text-shadow: 0 1px 0 rgba(250,249,246,.26);
}

/* A true layered paper object: fine page edges, curved gutter light, and soft contact shadow. */
.ph-stories .ph-book-stage {
  padding: clamp(12px, 1.45vw, 22px) clamp(8px, .9vw, 14px) clamp(18px, 2vw, 30px) !important;
  perspective: 2800px !important;
  filter: drop-shadow(0 14px 18px rgba(30,27,22,.05));
}
.ph-stories .ph-book-stage::before {
  inset: 8px 0 16px !important;
  background-color: #f8f7f3 !important;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.56), rgba(234,231,224,.30)),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg") !important;
  background-repeat: no-repeat, repeat !important;
  background-size: 100% 100%, 440px 440px !important;
  border: 1px solid rgba(255,255,255,.65);
  box-shadow:
    0 1px 0 rgba(255,255,255,.88),
    0 2px 0 #d5d1c9,
    0 4px 0 #f1efe9,
    0 6px 0 #cfcbc3,
    0 8px 0 #f5f3ed,
    0 18px 36px rgba(35,32,27,.16) !important;
}
.ph-stories .ph-book-edge-stack {
  inset: 3px -2px 5px !important;
  background:
    repeating-linear-gradient(
      180deg,
      #f5f3ee 0,
      #f5f3ee 1px,
      #d8d4cc 1px,
      #fbfaf6 2px
    ) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.7),
    0 15px 32px rgba(36,33,29,.12) !important;
}
.ph-stories .ph-book-spread {
  min-height: clamp(520px, 51vw, 780px);
  box-shadow:
    0 1px 0 rgba(255,255,255,.8),
    0 2px 4px rgba(42,37,30,.06);
}
.ph-stories .ph-book-spread::before {
  background-color: #f8f7f3 !important;
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.24), rgba(238,235,228,.08)),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg") !important;
  background-repeat: no-repeat, repeat !important;
  background-size: 100% 100%, 440px 440px !important;
}
.ph-stories .ph-book-page {
  min-height: clamp(520px, 51vw, 780px) !important;
  background-color: #f7f6f2 !important;
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.14) 0%, rgba(247,246,242,.13) 78%, rgba(80,74,64,.055) 100%),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg") !important;
  background-repeat: no-repeat, repeat !important;
  background-size: 100% 100%, 440px 440px !important;
}
.ph-stories .ph-book-page:first-child {
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.30),
    inset -22px 0 28px -28px rgba(31,28,23,.30),
    inset 8px 0 18px -20px rgba(31,28,23,.08) !important;
}
.ph-stories .ph-book-page:nth-child(2) {
  background-image:
    linear-gradient(90deg, rgba(70,64,54,.09) 0%, rgba(247,246,242,.08) 12%, rgba(255,255,255,.16) 100%),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg") !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.30),
    inset 22px 0 28px -28px rgba(31,28,23,.28),
    inset -8px 0 18px -20px rgba(31,28,23,.08) !important;
}
.ph-stories .ph-book-page-visual {
  background: #e8e5de !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.82),
    0 0 0 1px rgba(82,76,66,.055),
    0 8px 18px rgba(35,32,27,.075) !important;
}
.ph-stories .ph-book-page-meta {
  border-bottom-color: rgba(41,40,36,.13) !important;
}

/* Film is played inside each page. The original film-modal is no longer used. */
.ph-stories #story-video-modal { display: none !important; }
.ph-stories .ph-book-page-visual {
  position: relative !important;
  isolation: isolate;
}
.ph-stories .ph-book-play-button {
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-width: 44px;
  min-height: 44px;
  padding: 12px 14px;
  transform: translate(-50%, -50%);
  border: 1px solid rgba(255,255,255,.65);
  border-radius: 999px;
  background: rgba(250,249,246,.82);
  color: #282722;
  font-size: 11px;
  box-shadow: 0 3px 16px rgba(0,0,0,.12);
  cursor: pointer;
  transition: background .2s ease, transform .2s ease, opacity .2s ease;
  backdrop-filter: blur(8px);
}
.ph-stories .ph-book-play-button:hover {
  background: #fbfaf7;
  transform: translate(-50%, -50%) scale(1.045);
}
.ph-stories .ph-book-play-label {
  font-size: 7px;
  letter-spacing: .12em;
}
.ph-stories .ph-book-page-visual.is-playing {
  background: #151515 !important;
}
.ph-stories .ph-book-inline-video {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  background: #101010;
}
.ph-stories .ph-book-video-close {
  position: absolute;
  z-index: 4;
  top: 8px;
  right: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 27px;
  height: 27px;
  border: 1px solid rgba(255,255,255,.60);
  border-radius: 50%;
  background: rgba(20,20,20,.68);
  color: white;
  font: 22px/1 Arial, sans-serif;
  cursor: pointer;
}
.ph-stories .ph-book-page-action { cursor: default !important; }

/* Horizontal pointer gestures turn pages; vertical gestures remain normal page scroll. */
.ph-stories .ph-book-stage { touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.ph-stories .ph-book-play-button,
.ph-stories .ph-book-video-close,
.ph-stories .ph-book-inline-video { user-select: auto; -webkit-user-select: auto; }
@media (max-width: 767px) {
  body.ph-site.ph-stories {
    background-image:
      linear-gradient(180deg, rgba(243,241,236,.70), rgba(243,241,236,.04) 280px, transparent 60%, rgba(243,241,236,.32)),
      url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/5cb73b09-f0cc-4740-b427-9ec0aa0eb273.jpg") !important;
    background-size: 100% 100%, auto 100vh !important;
    background-position: center top, center top !important;
    background-repeat: no-repeat, repeat-y !important;
    background-attachment: scroll, scroll !important;
  }
  .ph-stories #stories-magazine { padding-top: 38px !important; }
  .ph-stories .ph-book-stage { padding: 8px 4px 16px !important; }
  .ph-stories .ph-book-spread { min-height: 0 !important; }
  .ph-stories .ph-book-page { min-height: 560px !important; }
  .ph-stories .ph-book-page:first-child {
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.30),
      inset -12px 0 22px -25px rgba(31,28,23,.24) !important;
  }
  .ph-stories .ph-book-page:nth-child(2) { display: none !important; }
  .ph-stories .ph-book-play-button { min-width: 38px; min-height: 38px; padding: 10px 12px; }
}


/* Small affordances for physical page gestures without making the book feel like a UI card. */
.ph-stories .ph-book-stage { cursor: grab; }
.ph-stories .ph-book-stage.is-dragging { cursor: grabbing; }
.ph-stories .ph-book-page { cursor: default !important; }
.ph-stories .ph-book-play-button,
.ph-stories .ph-book-video-close { cursor: pointer !important; }


/* STORIES v3 — pure-white page and the actual photographed open-book reference. */
body.ph-site.ph-stories,
body.ph-site.ph-stories main,
.ph-stories #stories-magazine {
  background: #fff !important;
  background-image: none !important;
}
body.ph-site.ph-stories {
  min-height: 100vh !important;
  color: #282722 !important;
}
.ph-stories #stories-magazine {
  position: relative !important;
  isolation: isolate !important;
  overflow: visible !important;
  padding: clamp(28px, 4vw, 56px) 0 clamp(72px, 8vw, 116px) !important;
}
.ph-stories #stories-magazine::before { display: none !important; }
.ph-stories #stories-magazine > .container {
  width: min(calc(100% - 88px), 1500px) !important;
}
.ph-stories .ph-stories-heading {
  border: 0 !important;
  padding: 0 0 clamp(26px, 3vw, 44px) !important;
}
.ph-stories .ph-stories-heading h1 {
  color: #272622 !important;
  font-size: clamp(52px, 6.5vw, 88px) !important;
  line-height: .86 !important;
}
.ph-stories .ph-stories-heading p {
  color: #77736d !important;
  max-width: 410px !important;
}
.ph-stories .ph-stories-toolbar {
  padding: 16px 0 0 !important;
  border-top: 1px solid rgba(41,40,36,.12) !important;
}
.ph-stories .ph-book-controls {
  padding: 18px 0 14px !important;
}

/* The reference already contains the real white book, printed edges and contact shadow.
   Keep it as a single photographic layer; overlay only the live story content. */
.ph-stories .ph-book-stage {
  position: relative !important;
  isolation: isolate !important;
  width: 100% !important;
  max-width: 1500px !important;
  aspect-ratio: 1700 / 1210 !important;
  margin: 0 auto !important;
  padding: 0 !important;
  overflow: visible !important;
  perspective: 2600px !important;
  background-color: #fff !important;
  background-image: url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/40695467-71e3-4d6d-9e58-7b22a29ed040.jpg") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: 100% 100% !important;
  box-shadow: none !important;
  filter: none !important;
  cursor: grab !important;
  touch-action: pan-y !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}
.ph-stories .ph-book-stage.is-dragging { cursor: grabbing !important; }
.ph-stories .ph-book-stage::before,
.ph-stories .ph-book-edge-stack { display: none !important; }
.ph-stories .ph-book-spread {
  position: absolute !important;
  inset: 7.4% 5.8% 7.4% !important;
  display: grid !important;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important;
  gap: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
  box-shadow: none !important;
  perspective: 2600px !important;
  transform-style: preserve-3d !important;
}
.ph-stories .ph-book-spread::before,
.ph-stories .ph-book-spread::after { display: none !important; }
.ph-stories .ph-book-page {
  position: relative !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  color: #282722 !important;
  cursor: default !important;
  transform-style: preserve-3d !important;
  backface-visibility: hidden !important;
}
.ph-stories .ph-book-page::before { display: none !important; }
.ph-stories .ph-book-page::after {
  right: 8% !important;
  bottom: 1.4% !important;
  color: rgba(70,66,59,.62) !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(8px, .65vw, 10px) !important;
}
.ph-stories .ph-book-page-visual {
  position: absolute !important;
  top: 20.2% !important;
  left: 29.5% !important;
  width: 56% !important;
  height: 60% !important;
  max-width: none !important;
  aspect-ratio: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #f2f1ef !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  isolation: isolate !important;
}
.ph-stories .ph-book-page--right .ph-book-page-visual { left: 20.2% !important; }
.ph-stories .ph-book-page-visual > img,
.ph-stories .ph-book-page-visual > .ph-book-inline-video {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  object-fit: cover !important;
  object-position: center center !important;
  border: 0 !important;
  border-radius: 0 !important;
  filter: none !important;
}
.ph-stories .ph-book-play-button {
  min-width: clamp(30px, 3.4vw, 48px) !important;
  min-height: clamp(30px, 3.4vw, 48px) !important;
  padding: 10px 13px !important;
  border-color: rgba(255,255,255,.75) !important;
  background: rgba(255,255,255,.88) !important;
  color: #282722 !important;
  box-shadow: 0 2px 12px rgba(0,0,0,.12) !important;
}
.ph-stories .ph-book-page-meta {
  position: absolute !important;
  top: 82.3% !important;
  left: 20.2% !important;
  display: flex !important;
  align-items: baseline !important;
  justify-content: space-between !important;
  gap: 6px !important;
  width: 65% !important;
  margin: 0 !important;
  padding: 0 0 4px !important;
  border: 0 !important;
  color: #79756d !important;
  font-size: clamp(5px, .48vw, 7px) !important;
  letter-spacing: .08em !important;
  line-height: 1.25 !important;
  text-transform: uppercase !important;
}
.ph-stories .ph-book-page h2 {
  position: absolute !important;
  top: 85% !important;
  left: 20.2% !important;
  width: 65% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #2c2a25 !important;
  font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(10px, 1.03vw, 16px) !important;
  font-weight: 500 !important;
  letter-spacing: -.012em !important;
  line-height: 1.04 !important;
}
.ph-stories .ph-book-page--right .ph-book-page-meta,
.ph-stories .ph-book-page--right h2,
.ph-stories .ph-book-page--right .ph-book-page-note,
.ph-stories .ph-book-page--right .ph-book-page-action { left: 15.5% !important; }
.ph-stories .ph-book-page-note {
  position: absolute !important;
  top: 88.5% !important;
  left: 20.2% !important;
  width: 65% !important;
  max-width: none !important;
  max-height: 5.1% !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: #78746d !important;
  font-size: clamp(5px, .53vw, 8px) !important;
  line-height: 1.45 !important;
}
.ph-stories .ph-book-page-action {
  position: absolute !important;
  top: 94.4% !important;
  left: 20.2% !important;
  width: 65% !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #716d65 !important;
  font-size: clamp(4px, .40vw, 6px) !important;
  letter-spacing: .09em !important;
  text-align: right !important;
}
.ph-stories .ph-book-page--right .ph-book-page-visual { left: 20.2% !important; }
.ph-stories .ph-book-page--blank { display: none !important; }

/* Each turning leaf has the current story on its front and the actual next story on its reverse. */
.ph-stories .ph-book-turn-page {
  position: absolute !important;
  z-index: 12 !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 50% !important;
  width: 50% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  transform: rotateY(0deg);
  transform-style: preserve-3d !important;
  transition: none;
  will-change: transform;
  pointer-events: none !important;
  background: #fbfaf7 !important;
  box-shadow: -1px 1px 2px rgba(52,48,40,.08);
}
.ph-stories .ph-book-turn-page--next { transform-origin: left center !important; }
.ph-stories .ph-book-turn-page--prev {
  left: 0 !important;
  transform-origin: right center !important;
}
.ph-stories .ph-book-turn-face {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  overflow: hidden !important;
  background-color: #fbfaf7 !important;
  background-image:
    linear-gradient(90deg, rgba(255,255,255,.94), rgba(248,247,243,.94)),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg") !important;
  background-repeat: no-repeat, repeat !important;
  background-size: 100% 100%, 420px 420px !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}
.ph-stories .ph-book-turn-back { transform: rotateY(180deg) !important; }
.ph-stories .ph-book-turn-content {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  overflow: hidden !important;
}
.ph-stories .ph-book-turn-content::before,
.ph-stories .ph-book-turn-content::after { display: none !important; }

/* A separate lower corner curls upward while dragging; its lift/rotation follows pointer progress. */
.ph-stories .ph-book-turn-curl {
  position: absolute !important;
  z-index: 30 !important;
  right: -1px !important;
  bottom: -1px !important;
  display: block !important;
  width: clamp(58px, 14%, 150px) !important;
  height: clamp(58px, 16%, 160px) !important;
  opacity: .22;
  transform-origin: right bottom !important;
  pointer-events: none !important;
  clip-path: polygon(100% 0, 100% 100%, 0 100%) !important;
  background: linear-gradient(135deg,
    rgba(255,255,255,.15) 0%,
    rgba(255,255,255,.90) 28%,
    rgba(221,217,208,.92) 52%,
    rgba(255,255,255,.98) 73%,
    #d8d3ca 100%) !important;
  filter: drop-shadow(-5px -5px 5px rgba(31,28,22,.20)) !important;
}
.ph-stories .ph-book-turn-curl span {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  clip-path: polygon(100% 0, 100% 100%, 0 100%);
  background: linear-gradient(135deg, transparent 35%, rgba(255,255,255,.95) 49%, rgba(100,94,82,.14) 52%, transparent 72%);
}
.ph-stories .ph-book-turn-page--prev .ph-book-turn-curl {
  right: auto !important;
  left: -1px !important;
  transform-origin: left bottom !important;
  clip-path: polygon(0 0, 100% 100%, 0 100%) !important;
  background: linear-gradient(225deg,
    rgba(255,255,255,.15) 0%,
    rgba(255,255,255,.90) 28%,
    rgba(221,217,208,.92) 52%,
    rgba(255,255,255,.98) 73%,
    #d8d3ca 100%) !important;
}
.ph-stories .ph-book-turn-page--prev .ph-book-turn-curl span {
  right: auto;
  left: 0;
  clip-path: polygon(0 0, 100% 100%, 0 100%);
  background: linear-gradient(225deg, transparent 35%, rgba(255,255,255,.95) 49%, rgba(100,94,82,.14) 52%, transparent 72%);
}
.ph-stories .ph-book-turn-page.is-dragging { transition: none !important; }
.ph-stories .ph-book-turn-page.is-settling {
  transition: transform .56s cubic-bezier(.2,.7,.18,1) !important;
}
.ph-stories .ph-book-stage.is-dragging { cursor: grabbing !important; }

/* Small screens show one half of the same photographed book at a time; finger swipes still curl the page. */
@media (max-width: 767px) {
  .ph-stories #stories-magazine { padding: 24px 0 58px !important; }
  .ph-stories #stories-magazine > .container { width: calc(100% - 28px) !important; }
  .ph-stories .ph-stories-heading { grid-template-columns: 1fr !important; gap: 13px !important; }
  .ph-stories .ph-stories-heading h1 { font-size: 58px !important; }
  .ph-stories .ph-stories-heading p { font-size: 10px !important; }
  .ph-stories .ph-stories-toolbar { grid-template-columns: 1fr auto !important; gap: 9px !important; }
  .ph-stories .ph-stories-toolbar label { grid-column: 1 / -1; }
  .ph-stories #story-index-select { grid-row: 2; min-width: 0 !important; }
  .ph-stories .ph-book-controls { padding: 10px 0 12px !important; gap: 8px !important; }
  .ph-stories .ph-book-control { min-width: 0 !important; min-height: 34px !important; font-size: 7px !important; }
  .ph-stories .ph-book-page-count { font-size: 14px !important; }
  .ph-stories .ph-book-stage {
    width: 100% !important;
    aspect-ratio: 0.76 / 1 !important;
    background-size: auto 100% !important;
    background-position: left center !important;
  }
  .ph-stories .ph-book-stage.is-right-page { background-position: right center !important; }
  .ph-stories .ph-book-spread {
    inset: 7.4% 6% 7.4% 11% !important;
    grid-template-columns: minmax(0,1fr) !important;
  }
  .ph-stories .ph-book-spread.is-right-page { inset: 7.4% 11% 7.4% 6% !important; }
  .ph-stories .ph-book-spread::after { display: none !important; }
  .ph-stories .ph-book-page { min-height: 0 !important; }
  .ph-stories .ph-book-page-visual {
    top: 20.2% !important;
    left: 29.5% !important;
    width: 56% !important;
    height: 60% !important;
  }
  .ph-stories .ph-book-page--right .ph-book-page-visual { left: 20.2% !important; }
  .ph-stories .ph-book-page-meta {
    top: 82.3% !important;
    left: 20.2% !important;
    width: 65% !important;
    font-size: clamp(5px, 1.2vw, 7px) !important;
  }
  .ph-stories .ph-book-page h2 {
    top: 85% !important;
    left: 20.2% !important;
    width: 65% !important;
    font-size: clamp(11px, 2.7vw, 16px) !important;
  }
  .ph-stories .ph-book-page-note {
    top: 88.5% !important;
    left: 20.2% !important;
    width: 65% !important;
    font-size: clamp(6px, 1.35vw, 8px) !important;
  }
  .ph-stories .ph-book-page-action {
    top: 94.4% !important;
    left: 20.2% !important;
    width: 65% !important;
    font-size: 5px !important;
  }
  .ph-stories .ph-book-turn-page--next {
    left: 0 !important;
    width: 100% !important;
    transform-origin: left center !important;
  }
  .ph-stories .ph-book-turn-page--prev {
    left: 0 !important;
    width: 100% !important;
    transform-origin: right center !important;
  }
  .ph-stories .ph-book-turn-content { min-height: 0 !important; }
  .ph-stories .ph-book-turn-curl {
    width: clamp(52px, 19%, 90px) !important;
    height: clamp(52px, 22%, 100px) !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .ph-stories .ph-book-turn-page.is-settling { transition-duration: .01ms !important; }
}


/* Final white-page guard: the page canvas is white; the shared header keeps its normal site styling. */
html:has(body.ph-site.ph-stories) {
  background: #fff !important;
}
body.ph-site.ph-stories {
  background-color: #fff !important;
  background-image: none !important;
}
body.ph-site.ph-stories main,
body.ph-site.ph-stories #stories-magazine {
  background-color: #fff !important;
  background-image: none !important;
}
.ph-stories .ph-book-stage {
  background-color: #fff !important;
  background-image: url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/40695467-71e3-4d6d-9e58-7b22a29ed040.jpg") !important;
  background-size: 100% 100% !important;
}
@media (max-width: 767px) {
  .ph-stories .ph-book-stage {
    background-size: auto 100% !important;
  }
  .ph-stories .ph-book-spread.is-right-page {
    inset: 7.4% 11% 7.4% 6% !important;
  }
}


/* Match the reference's all-white canvas from header through page margins. */
.ph-stories .ph-header {
  background: rgba(255,255,255,.97) !important;
  border-bottom-color: rgba(41,40,36,.08) !important;
}
.ph-stories .ph-mobile-menu:not(.hidden) {
  background: #fff !important;
}


/* STORIES curved-paper revision: force editorial type to stay inside each printed page. */
body.ph-site.ph-stories #stories-grid .ph-book-page h2,
body.ph-site.ph-stories #stories-grid .ph-book-turn-content h2 {
  position: absolute !important; top: 85% !important; right: auto !important; bottom: auto !important; left: 20.2% !important;
  display: -webkit-box !important; box-sizing: border-box !important; width: 65% !important; max-width: 65% !important;
  height: auto !important; max-height: 4.0% !important; margin: 0 !important; padding: 0 !important; overflow: hidden !important;
  color: #302e29 !important; font-family: "Cormorant Garamond", Georgia, serif !important;
  font-size: clamp(11px, .94vw, 13px) !important; font-weight: 500 !important; line-height: 1.08 !important;
  letter-spacing: -.015em !important; text-align: left !important; white-space: normal !important;
  overflow-wrap: break-word !important; word-break: normal !important; -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important; text-shadow: none !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-page-note,
body.ph-site.ph-stories #stories-grid .ph-book-turn-content .ph-book-page-note {
  top: 89.25% !important; left: 20.2% !important; width: 65% !important; max-width: 65% !important;
  max-height: 3.5% !important; overflow: hidden !important; font-size: clamp(6px, .52vw, 7px) !important; line-height: 1.35 !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-page-action,
body.ph-site.ph-stories #stories-grid .ph-book-turn-content .ph-book-page-action {
  top: 94.3% !important; left: 20.2% !important; width: 65% !important; font-size: clamp(5px, .42vw, 6px) !important; line-height: 1.2 !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-page--right h2,
body.ph-site.ph-stories #stories-grid .ph-book-page--right .ph-book-page-note,
body.ph-site.ph-stories #stories-grid .ph-book-page--right .ph-book-page-action,
body.ph-site.ph-stories #stories-grid .ph-book-turn-content.ph-book-page--right h2,
body.ph-site.ph-stories #stories-grid .ph-book-turn-content.ph-book-page--right .ph-book-page-note,
body.ph-site.ph-stories #stories-grid .ph-book-turn-content.ph-book-page--right .ph-book-page-action { left: 15.5% !important; }
body.ph-site.ph-stories #stories-grid .ph-book-page-meta,
body.ph-site.ph-stories #stories-grid .ph-book-turn-content .ph-book-page-meta {
  top: 82.3% !important; left: 20.2% !important; width: 65% !important; font-size: clamp(5px, .48vw, 7px) !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-page--right .ph-book-page-meta,
body.ph-site.ph-stories #stories-grid .ph-book-turn-content.ph-book-page--right .ph-book-page-meta { left: 15.5% !important; }

/* A twenty-strip mesh gives the sheet a bowed surface; strip angles and depth track drag progress. */
.ph-stories .ph-book-turn-page {
  position: absolute !important; z-index: 25 !important; top: 0 !important; bottom: 0 !important; left: 50% !important; width: 50% !important;
  margin: 0 !important; padding: 0 !important; overflow: visible !important; transform: none !important;
  transform-style: preserve-3d !important; perspective: 1800px !important; background: transparent !important;
  box-shadow: none !important; pointer-events: none !important;
}
.ph-stories .ph-book-turn-page--next { left: 50% !important; }
.ph-stories .ph-book-turn-page--prev { left: 0 !important; }
.ph-stories .ph-book-mesh-strip {
  position: absolute !important; top: 0 !important; bottom: 0 !important; display: block !important;
  margin: 0 !important; padding: 0 !important; overflow: visible !important; transform-origin: center center !important;
  transform-style: preserve-3d !important; backface-visibility: visible !important; will-change: transform !important; transition: none !important;
}
.ph-stories .ph-book-mesh-face {
  position: absolute !important; inset: 0 !important; display: block !important; overflow: hidden !important;
  background-color: #fbfaf7 !important;
  background-image: linear-gradient(90deg, rgba(255,255,255,.96), rgba(247,246,241,.97)),
    url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg") !important;
  background-repeat: no-repeat, repeat !important; background-size: 100% 100%, 420px 420px !important;
  backface-visibility: hidden !important; -webkit-backface-visibility: hidden !important; transform-style: preserve-3d !important;
  box-shadow: inset 0 0 1px rgba(67,61,51,.06);
}
.ph-stories .ph-book-mesh-face--back { transform: rotateY(180deg) !important; }
body.ph-site.ph-stories #stories-grid .ph-book-turn-content {
  position: absolute !important; top: 0 !important; left: calc(var(--strip-index) * -100%) !important; display: block !important;
  width: calc(var(--strip-count) * 100%) !important; height: 100% !important; min-height: 0 !important; max-width: none !important;
  margin: 0 !important; padding: 0 !important; overflow: hidden !important; background: transparent !important;
  background-image: none !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; transform: none !important;
}
.ph-stories .ph-book-mesh-strip::after {
  position: absolute; z-index: 20; inset: 0; content: ""; pointer-events: none;
  background: linear-gradient(90deg, rgba(30,27,22,.16), transparent 38%, rgba(255,255,255,.16));
  opacity: var(--strip-shadow, .04); mix-blend-mode: multiply;
}
.ph-stories .ph-book-turn-curl {
  position: absolute !important; z-index: 60 !important; right: -1px !important; bottom: -1px !important; display: block !important;
  width: clamp(70px, 17%, 165px) !important; height: clamp(72px, 19%, 175px) !important; opacity: .24;
  transform-origin: right bottom !important; pointer-events: none !important; clip-path: polygon(100% 0, 100% 100%, 0 100%) !important;
  background: linear-gradient(137deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.94) 25%, rgba(213,208,198,.97) 50%, rgba(255,255,255,.99) 72%, #cfc9bd 100%) !important;
  filter: drop-shadow(-8px -7px 7px rgba(31,28,22,.22)) !important; transition: none !important;
}
.ph-stories .ph-book-curl-highlight {
  position: absolute !important; inset: 0 !important; display: block !important; clip-path: polygon(100% 0, 100% 100%, 0 100%) !important;
  background: linear-gradient(135deg, transparent 31%, rgba(255,255,255,.96) 46%, rgba(91,84,72,.18) 50%, transparent 68%) !important;
}
.ph-stories .ph-book-turn-page--prev .ph-book-turn-curl { right: auto !important; left: -1px !important; transform-origin: left bottom !important; clip-path: polygon(0 0, 100% 100%, 0 100%) !important; }
.ph-stories .ph-book-turn-page--prev .ph-book-curl-highlight {
  clip-path: polygon(0 0, 100% 100%, 0 100%) !important;
  background: linear-gradient(225deg, transparent 31%, rgba(255,255,255,.96) 46%, rgba(91,84,72,.18) 50%, transparent 68%) !important;
}
.ph-stories .ph-book-turn-page.is-dragging .ph-book-mesh-strip { transition: none !important; }
.ph-stories .ph-book-turn-page.is-settling .ph-book-mesh-strip { transition: transform .62s cubic-bezier(.2,.72,.18,1) !important; }
.ph-stories .ph-book-turn-page.is-settling .ph-book-turn-curl { transition: transform .62s cubic-bezier(.2,.72,.18,1), opacity .62s ease !important; }
@media (max-width: 767px) {
  body.ph-site.ph-stories #stories-grid .ph-book-page h2,
  body.ph-site.ph-stories #stories-grid .ph-book-turn-content h2 { font-size: clamp(10px, 3vw, 12px) !important; max-height: 4% !important; }
  .ph-stories .ph-book-turn-page--next, .ph-stories .ph-book-turn-page--prev { left: 0 !important; width: 100% !important; }
}


/* STORIES single-sheet correction: one aligned sheet, no repeated mesh-strip fan. */
body.ph-site.ph-stories #stories-grid .ph-book-turn-page {
  position: absolute !important;
  z-index: 40 !important;
  top: 0 !important;
  bottom: 0 !important;
  left: 50% !important;
  width: 50% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  background: #fbfaf7 !important;
  transform-origin: left center !important;
  transform-style: preserve-3d !important;
  backface-visibility: visible !important;
  box-shadow: 0 0 1px rgba(47,43,35,.12), 0 3px 8px rgba(47,43,35,.06) !important;
  pointer-events: none !important;
  will-change: transform !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-page--next { left: 50% !important; transform-origin: left center !important; }
body.ph-site.ph-stories #stories-grid .ph-book-turn-page--prev { left: 0 !important; transform-origin: right center !important; }
body.ph-site.ph-stories #stories-grid .ph-book-turn-face {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  overflow: hidden !important;
  background-color: #fbfaf7 !important;
  background-image: linear-gradient(90deg, rgba(255,255,255,.99), rgba(248,247,243,.99)) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: inset 0 0 1px rgba(70,62,49,.08) !important;
  transform-style: preserve-3d !important;
  backface-visibility: hidden !important;
  -webkit-backface-visibility: hidden !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-front { transform: rotateY(0deg) !important; }
body.ph-site.ph-stories #stories-grid .ph-book-turn-back {
  transform: rotateY(180deg) !important;
  background-image: linear-gradient(270deg, rgba(255,255,255,.99), rgba(247,246,242,.99)) !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-content {
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  transform: none !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-content h2 {
  font-size: clamp(11px, .94vw, 13px) !important;
  max-height: 4% !important;
  overflow: hidden !important;
  -webkit-line-clamp: 2 !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-page::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 20 !important;
  pointer-events: none !important;
  background: linear-gradient(90deg,
    rgba(49,43,32,.20) 0%,
    rgba(255,255,255,0) 13%,
    rgba(255,255,255,0) 65%,
    rgba(60,53,41,.10) 100%) !important;
  opacity: calc(.18 + var(--turn-progress, 0) * .25) !important;
  mix-blend-mode: multiply !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-curl {
  position: absolute !important;
  z-index: 50 !important;
  right: -1px !important;
  bottom: -1px !important;
  display: block !important;
  width: 8% !important;
  height: 8% !important;
  overflow: visible !important;
  opacity: 0 !important;
  transform-origin: right bottom !important;
  pointer-events: none !important;
  filter: drop-shadow(-5px -5px 5px rgba(40,35,27,.20)) !important;
  will-change: transform, width, height, opacity !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-curl svg {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-curl-shadow {
  filter: blur(1.2px);
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-page--prev .ph-book-turn-curl {
  right: auto !important;
  left: -1px !important;
  transform-origin: left bottom !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-page.is-dragging {
  transition: none !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-page.is-settling {
  transition: transform .68s cubic-bezier(.22,.68,.16,1) !important;
}
body.ph-site.ph-stories #stories-grid .ph-book-turn-page.is-settling .ph-book-turn-curl {
  transition: transform .68s cubic-bezier(.22,.68,.16,1), width .68s ease, height .68s ease, opacity .45s ease !important;
}
@media (max-width: 767px) {
  body.ph-site.ph-stories #stories-grid .ph-book-turn-page--next,
  body.ph-site.ph-stories #stories-grid .ph-book-turn-page--prev {
    left: 0 !important;
    width: 100% !important;
  }
  body.ph-site.ph-stories #stories-grid .ph-book-turn-page--prev { transform-origin: right center !important; }
  body.ph-site.ph-stories #stories-grid .ph-book-turn-page--next { transform-origin: left center !important; }
  body.ph-site.ph-stories #stories-grid .ph-book-turn-content h2 {
    font-size: clamp(10px, 3vw, 12px) !important;
  }
}


/* Seamless site navigation: header and page canvas are one continuous surface.
   No divider line, shadow edge, or tint mismatch between navigation and content. */
body.ph-site:not(.ph-home) .ph-header {
  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
body.ph-site.ph-work .ph-header {
  background: var(--ph-ivory) !important;
}
body.ph-site.ph-info .ph-header {
  background: transparent !important;
  background-image: none !important;
}
body.ph-site.ph-stories .ph-header {
  background: #fff !important;
}
body.ph-site.ph-dosi .ph-header {
  background: #fff !important;
}


/* PHANEROEL shared wordmark sizing: same logo/symbol scale on every main page. */
body.ph-site .ph-header .ph-wordmark img {
  width: auto !important;
  height: 36px !important;
  max-width: 220px !important;
  object-fit: contain !important;
}
@media (max-width: 767px) {
  body.ph-site .ph-header .ph-wordmark img {
    width: auto !important;
    height: 30px !important;
    max-width: 190px !important;
  }
}


/* CONTACT navigation: soft ivory white dissolves into the concrete backdrop. */
body.ph-site.ph-info .ph-header {
  position: relative !important;
  z-index: 100 !important;
  isolation: isolate !important;
  overflow: visible !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
body.ph-site.ph-info .ph-header::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(
    180deg,
    rgba(251, 250, 247, .98) 0%,
    rgba(251, 250, 247, .88) 24%,
    rgba(251, 250, 247, .58) 56%,
    rgba(251, 250, 247, .24) 82%,
    rgba(251, 250, 247, 0) 100%
  ) !important;
}
body.ph-site.ph-info .ph-header-inner,
body.ph-site.ph-info .ph-mobile-menu {
  position: relative !important;
  z-index: 1 !important;
}
body.ph-site.ph-info .ph-nav-link {
  color: #292824 !important;
  text-shadow: none !important;
}
body.ph-site.ph-info .ph-nav-link:hover { opacity: .72 !important; }
body.ph-site.ph-info .ph-nav-link::after {
  background: #c3a675 !important;
}
@media (max-width: 767px) {
  body.ph-site.ph-info .ph-header::before {
    bottom: 0 !important;
    background: linear-gradient(
      180deg,
      rgba(251, 250, 247, .98) 0%,
      rgba(251, 250, 247, .86) 28%,
      rgba(251, 250, 247, .44) 68%,
      rgba(251, 250, 247, 0) 100%
    ) !important;
  }
  body.ph-site.ph-info .ph-menu-toggle {
    color: #292824 !important;
    text-shadow: none !important;
  }
  body.ph-site.ph-info .ph-mobile-menu:not(.hidden) {
    background: rgba(251, 250, 247, .96) !important;
    border-top: 1px solid rgba(70, 65, 55, .12) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    backdrop-filter: blur(12px) !important;
  }
  body.ph-site.ph-info .ph-mobile-link {
    color: #292824 !important;
  }
  body.ph-site.ph-info .ph-mobile-link[aria-current="page"] {
    color: #9c8052 !important;
  }
}

/* CONTACT footer canvas: prevent the final main margin from collapsing onto the ivory root canvas. */
body.ph-site.ph-info {
  display: flow-root !important;
}


/* Paint the same concrete texture on the root canvas so no ivory strip can appear below CONTACT. */
html:has(body.ph-site.ph-info) {
  background-color: #c8c5bd !important;
  background-image: url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/5cb73b09-f0cc-4740-b427-9ec0aa0eb273.jpg") !important;
  background-repeat: no-repeat !important;
  background-position: center top !important;
  background-size: cover !important;
  background-attachment: fixed !important;
}


/* ===== PHANEROEL inquiry modal: refined form only; leave CONTACT artwork/canvas untouched ===== */
body.ph-info.ph-inquiry-modal-open { overflow: hidden !important; }
.ph-info #contact.ph-contact-form-section.ph-inquiry-hidden { display:none !important; }
.ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) {
  position:fixed !important; z-index:1000 !important; inset:0 !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  box-sizing:border-box !important; width:100% !important; max-width:none !important;
  height:100vh !important; height:100dvh !important; margin:0 !important; padding:24px !important;
  overflow-x:hidden !important; overflow-y:auto !important; background:rgba(25,24,22,.70) !important;
  -webkit-backdrop-filter:blur(7px) !important; backdrop-filter:blur(7px) !important;
}
.ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) > .container {
  position:relative !important; display:block !important; box-sizing:border-box !important;
  width:min(720px,100%) !important; max-width:720px !important; max-height:calc(100dvh - 48px) !important;
  margin:auto !important; padding:clamp(28px,3.2vw,42px) clamp(24px,4vw,44px) 30px !important;
  overflow-x:hidden !important; overflow-y:auto !important; background-color:#faf9f6 !important;
  background-image:url("https://d2ol7oe51mr4n9.cloudfront.net/user_3I7EJsGdLYtCN0NjgV9Yii6rpHr/0bbbb012-c871-4c92-bc5b-b3115c0e31cb.jpg") !important;
  background-size:450px 450px !important; background-repeat:repeat !important; color:#292824 !important;
  border:1px solid rgba(255,255,255,.52) !important; border-radius:0 !important;
  box-shadow:0 24px 80px rgba(0,0,0,.28),0 2px 8px rgba(0,0,0,.12) !important;
}
.ph-info #contact .ph-inquiry-header { margin:0 0 28px !important; }
.ph-info #contact .ph-inquiry-topline { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:16px !important; padding-right:34px !important; margin:0 0 17px !important; }
.ph-info #contact .ph-inquiry-eyebrow { margin:0 !important; color:#8f7b59 !important; font-family:"Inter",Arial,sans-serif !important; font-size:9px !important; font-weight:600 !important; line-height:1.5 !important; letter-spacing:.17em !important; text-transform:uppercase !important; }
.ph-info #contact .ph-inquiry-language-wrap { display:inline-flex !important; align-items:center !important; margin:0 !important; }
.ph-info #contact .ph-inquiry-language {
  width:auto !important; min-width:42px !important; height:25px !important; margin:0 !important; padding:0 18px 0 4px !important;
  border:0 !important; border-bottom:1px solid #c9c2b6 !important; border-radius:0 !important; color:#5e594f !important;
  background-color:transparent !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none'%3E%3Cpath d='m2.5 4.5 3.5 3 3.5-3' stroke='%23645E54' stroke-width='1.1'/%3E%3C/svg%3E") !important;
  background-position:right 2px center !important; background-repeat:no-repeat !important; background-size:12px 12px !important;
  font-family:"Inter","Noto Sans KR",sans-serif !important; font-size:9px !important; font-weight:600 !important; letter-spacing:.06em !important; cursor:pointer !important;
}
.ph-info #contact #inquiry-title { margin:0 !important; padding:0 30px 0 0 !important; color:#242420 !important; font-family:"Inter","Noto Sans KR",sans-serif !important; font-size:clamp(25px,3vw,30px) !important; font-weight:600 !important; line-height:1.22 !important; letter-spacing:-.045em !important; text-align:left !important; overflow-wrap:anywhere !important; }
.ph-info #contact #inquiry-intro { margin:9px 0 0 !important; padding:0 !important; color:#777168 !important; font-family:"Inter","Noto Sans KR",sans-serif !important; font-size:12px !important; font-weight:400 !important; line-height:1.7 !important; letter-spacing:-.01em !important; text-align:left !important; }
.ph-info #contact .ph-inquiry-close {
  position:absolute !important; top:20px !important; right:20px !important; z-index:4 !important; display:inline-flex !important; align-items:center !important; justify-content:center !important;
  width:28px !important; height:28px !important; margin:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important;
  background:transparent !important; color:#38362f !important; font-family:Arial,sans-serif !important; font-size:24px !important; font-weight:300 !important;
  line-height:1 !important; box-shadow:none !important; cursor:pointer !important;
}
.ph-info #contact .ph-inquiry-close:hover { color:#9c8052 !important; }
.ph-info #contact .ph-inquiry-form { display:flex !important; flex-direction:column !important; gap:25px !important; margin:0 !important; padding:0 !important; border:0 !important; border-radius:0 !important; background:transparent !important; box-shadow:none !important; }
.ph-info #contact .ph-inquiry-form.space-y-10 > :not([hidden]) ~ :not([hidden]) { margin-top:0 !important; }
.ph-info #contact .ph-inquiry-contact-fields { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:22px !important; margin:0 !important; }
.ph-info #contact .ph-inquiry-details { display:flex !important; flex-direction:column !important; gap:23px !important; margin:0 !important; padding:25px 0 0 !important; border-top:1px solid #dedbd4 !important; }
.ph-info #contact .ph-inquiry-detail-grid { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:23px 32px !important; margin:0 !important; padding:0 !important; }
.ph-info #contact .ph-inquiry-field { min-width:0 !important; margin:0 !important; padding:0 !important; }
.ph-info #contact .ph-inquiry-field > label, .ph-info #contact .ph-inquiry-field > legend {
  display:block !important; width:100% !important; margin:0 0 8px !important; padding:0 !important; color:#4f4b43 !important;
  font-family:"Inter","Noto Sans KR",sans-serif !important; font-size:9px !important; font-weight:600 !important; line-height:1.5 !important;
  letter-spacing:.105em !important; text-transform:uppercase !important;
}
.ph-info #contact .ph-inquiry-field > legend { float:none !important; }
.ph-info #contact .ph-inquiry-field .form-input {
  display:block !important; box-sizing:border-box !important; width:100% !important; min-width:0 !important; min-height:38px !important;
  margin:0 !important; padding:9px 0 8px !important; border:0 !important; border-bottom:1px solid #c9c5bc !important; border-radius:0 !important;
  outline:none !important; color:#292824 !important; background-color:transparent !important; box-shadow:none !important;
  font-family:"Inter","Noto Sans KR",sans-serif !important; font-size:12px !important; font-weight:400 !important; line-height:1.5 !important;
  letter-spacing:-.012em !important; text-align:left !important; transition:border-color .18s ease !important;
}
.ph-info #contact .ph-inquiry-field .form-input::placeholder { color:#99948a !important; opacity:1 !important; }
.ph-info #contact .ph-inquiry-field .form-input:focus { border-bottom-color:#92784f !important; outline:none !important; }
.ph-info #contact .ph-inquiry-field .form-input:focus-visible { box-shadow:0 1px 0 #92784f !important; }
.ph-info #contact .ph-inquiry-field select.form-input {
  appearance:none !important; -webkit-appearance:none !important; padding-right:22px !important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='m3 6 5 4 5-4' stroke='%23534F46' stroke-width='1.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-position:right 2px center !important; background-repeat:no-repeat !important; background-size:15px 15px !important; cursor:pointer !important;
}
.ph-info #contact .ph-inquiry-field select.form-input option { color:#292824 !important; background:#faf9f6 !important; }
.ph-info #contact .ph-inquiry-location { min-width:0 !important; border:0 !important; }
.ph-info #contact .ph-inquiry-location .radio-group { display:flex !important; flex-wrap:wrap !important; align-items:center !important; gap:10px 20px !important; padding:5px 0 0 !important; }
.ph-info #contact .ph-inquiry-location .radio-group input[type="radio"] { display:none !important; }
.ph-info #contact .ph-inquiry-location .radio-group label {
  position:relative !important; display:inline-flex !important; align-items:center !important; min-height:24px !important; margin:0 !important; padding:0 0 0 25px !important;
  color:#625e55 !important; font-family:"Inter","Noto Sans KR",sans-serif !important; font-size:11px !important; font-weight:400 !important;
  line-height:1.4 !important; letter-spacing:0 !important; text-transform:none !important; cursor:pointer !important;
}
.ph-info #contact .ph-inquiry-location .radio-group label::before {
  position:absolute !important; top:50% !important; left:0 !important; width:15px !important; height:15px !important; box-sizing:border-box !important;
  border:1px solid #b4aea2 !important; border-radius:50% !important; background:transparent !important; box-shadow:none !important; transform:translateY(-50%) !important;
}
.ph-info #contact .ph-inquiry-location .radio-group input[type="radio"]:checked + label { color:#242420 !important; }
.ph-info #contact .ph-inquiry-location .radio-group input[type="radio"]:checked + label::before { border:1px solid #292824 !important; background:#292824 !important; box-shadow:inset 0 0 0 4px #faf9f6 !important; }
.ph-info #contact .ph-inquiry-message-field .form-input { min-height:76px !important; padding-top:7px !important; resize:vertical !important; }
.ph-info #contact .ph-inquiry-actions { display:flex !important; justify-content:center !important; margin:0 !important; padding:0 !important; }
.ph-info #contact .ph-inquiry-submit {
  display:inline-flex !important; align-items:center !important; justify-content:center !important; min-width:172px !important; min-height:42px !important;
  margin:0 !important; padding:12px 22px !important; border:1px solid #292824 !important; border-radius:0 !important; background:#292824 !important;
  color:#fbfaf7 !important; font-family:"Inter","Noto Sans KR",sans-serif !important; font-size:9px !important; font-weight:600 !important;
  line-height:1.4 !important; letter-spacing:.12em !important; text-align:center !important; text-transform:uppercase !important; box-shadow:none !important;
  cursor:pointer !important; transition:background .18s ease,color .18s ease,opacity .18s ease !important;
}
.ph-info #contact .ph-inquiry-submit:hover { background:transparent !important; color:#292824 !important; }
.ph-info #contact .ph-inquiry-submit:disabled { opacity:.55 !important; cursor:wait !important; }
.ph-info #contact .ph-inquiry-direct { margin:20px 0 0 !important; padding:0 !important; text-align:center !important; }
.ph-info #contact .ph-inquiry-or { display:flex !important; align-items:center !important; justify-content:center !important; gap:13px !important; max-width:250px !important; margin:0 auto 13px !important; color:#898378 !important; font-family:"Inter",sans-serif !important; font-size:9px !important; letter-spacing:.12em !important; }
.ph-info #contact .ph-inquiry-or::before, .ph-info #contact .ph-inquiry-or::after { content:"" !important; display:block !important; height:1px !important; flex:1 1 auto !important; background:#dedbd4 !important; }
.ph-info #contact .ph-inquiry-direct p { display:flex !important; flex-wrap:wrap !important; justify-content:center !important; align-items:center !important; gap:5px !important; margin:0 !important; padding:0 !important; color:#777168 !important; font-family:"Inter","Noto Sans KR",sans-serif !important; font-size:11px !important; line-height:1.7 !important; text-align:center !important; }
.ph-info #contact .ph-inquiry-direct a { color:#292824 !important; text-decoration:none !important; text-underline-offset:3px !important; }
.ph-info #contact .ph-inquiry-direct a:hover { text-decoration:underline !important; }
.ph-info #contact .ph-inquiry-arrow { margin-left:4px !important; color:#8f7b59 !important; font-size:17px !important; line-height:1 !important; }
.ph-info #contact :is(button,input,select,textarea,a):focus-visible { outline:2px solid #9c8052 !important; outline-offset:3px !important; }
@media (max-width:767px) {
  .ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) { align-items:flex-start !important; justify-content:center !important; padding:12px !important; }
  .ph-info #contact.ph-contact-form-section:not(.ph-inquiry-hidden) > .container { width:100% !important; max-width:560px !important; max-height:calc(100dvh - 24px) !important; margin:auto !important; padding:25px 20px 24px !important; }
  .ph-info #contact .ph-inquiry-topline { padding-right:32px !important; margin-bottom:14px !important; }
  .ph-info #contact #inquiry-title { font-size:clamp(23px,6vw,28px) !important; }
  .ph-info #contact #inquiry-intro { max-width:95% !important; font-size:11px !important; }
  .ph-info #contact .ph-inquiry-header { margin-bottom:24px !important; }
  .ph-info #contact .ph-inquiry-form { gap:22px !important; }
  .ph-info #contact .ph-inquiry-contact-fields, .ph-info #contact .ph-inquiry-detail-grid { grid-template-columns:minmax(0,1fr) !important; gap:19px !important; }
  .ph-info #contact .ph-inquiry-details { gap:22px !important; padding-top:22px !important; }
  .ph-info #contact .ph-inquiry-close { top:14px !important; right:13px !important; }
  .ph-info #contact .ph-inquiry-direct { margin-top:17px !important; }
}
@media (prefers-reduced-motion:reduce) {
  .ph-info #contact .ph-inquiry-field .form-input, .ph-info #contact .ph-inquiry-submit { transition:none !important; }
}


/* Category names remain semantic headings, but are not repeated as oversized page titles. */
.ph-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  font-size: 1px !important;
  line-height: 1px !important;
}

/* WORK: let the actual projects lead; keep a restrained descriptor and filter controls. */
body.ph-site.ph-work #works {
  padding-top: clamp(26px, 3vw, 42px) !important;
}
body.ph-site.ph-work #works > .container > .ph-page-intro {
  max-width: 560px !important;
  margin: 0 0 clamp(22px, 2.6vw, 36px) !important;
  color: var(--ph-muted) !important;
  font-size: 11px !important;
  line-height: 1.75 !important;
  letter-spacing: .005em !important;
  text-align: left !important;
}

/* STORIES: retain the short archive descriptor, but let the physical book be the visual title. */
body.ph-site.ph-stories #stories-magazine {
  padding-top: clamp(22px, 2.8vw, 40px) !important;
}
body.ph-site.ph-stories .ph-stories-heading {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(260px, .62fr) !important;
  align-items: end !important;
  gap: clamp(24px, 5vw, 76px) !important;
  padding-bottom: clamp(18px, 2.2vw, 30px) !important;
}
body.ph-site.ph-stories .ph-stories-heading > div {
  position: relative !important;
  min-height: 0 !important;
}
body.ph-site.ph-stories .ph-stories-heading h1.ph-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  font-size: 1px !important;
  line-height: 1px !important;
}
body.ph-site.ph-stories .ph-stories-heading .ph-overline {
  margin: 0 !important;
  color: #9a825d !important;
  font-size: 8px !important;
  line-height: 1.7 !important;
  letter-spacing: .17em !important;
}
body.ph-site.ph-stories .ph-stories-heading > p {
  max-width: 390px !important;
  margin: 0 !important;
  color: #77736d !important;
  font-size: 11px !important;
  line-height: 1.8 !important;
}
@media (max-width: 767px) {
  body.ph-site.ph-work #works { padding-top: 22px !important; }
  body.ph-site.ph-work #works > .container > .ph-page-intro {
    margin-bottom: 22px !important;
    font-size: 10px !important;
  }
  body.ph-site.ph-stories #stories-magazine { padding-top: 22px !important; }
  body.ph-site.ph-stories .ph-stories-heading {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 10px !important;
    padding-bottom: 18px !important;
  }
  body.ph-site.ph-stories .ph-stories-heading > p {
    max-width: 420px !important;
    font-size: 10px !important;
  }
}
