.pe-site { background: var(--pe-bg); }
.pe-shell { max-width: var(--pe-shell); margin-inline: auto; padding-inline: var(--pe-gutter); }
.pe-site .skip:focus { background: var(--pe-ink); color: var(--pe-surface); z-index: 100; }
.pe-site #main { scroll-margin-top: 5.5rem; }
.pe-site #main:focus { outline: none; }
.pe-demo {
  padding: .5rem var(--pe-gutter); display: flex; justify-content: center; gap: 1rem;
  background: var(--pe-bg-secondary); color: var(--pe-muted); font: 400 .6875rem/1.5 var(--pe-font-ui);
}
.pe-demo strong { font-weight: 650; letter-spacing: .07em; }
.pe-demo a { text-decoration: underline; text-underline-offset: .2em; }
.pe-header { position: sticky; top: 0; z-index: 20; background: var(--pe-bg); border-bottom: 1px solid var(--pe-line); }
.pe-header__inner { min-height: 88px; display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.pe-brand { font: 400 1.4375rem/1 var(--pe-font-display); letter-spacing: .16em; white-space: nowrap; text-decoration: none; }
.pe-brand span { color: var(--pe-mineral-ink); margin-inline: .05em; }
.pe-nav { display: flex; align-items: center; gap: clamp(1.25rem, 3vw, 3rem); }
.pe-nav a { min-height: 44px; display: inline-flex; align-items: center; font: 500 .75rem/1.5 var(--pe-font-ui); position: relative; text-decoration: none; }
.pe-nav a::after { content: ''; position: absolute; inset: auto 0 .5rem; height: 1px; background: var(--pe-ink); transform: scaleX(0); transform-origin: left; transition: transform var(--pe-motion-fast); }
.pe-nav a:hover::after, .pe-nav a[aria-current]::after { transform: scaleX(1); }
.pe-header__actions { display: flex; align-items: center; gap: .625rem; flex-wrap: wrap; max-width: 100%; }
.pe-header__compact-label { display: none; }
.pe-mobile-nav { display: none; }
.pe-site .cf-closing h2 { overflow-wrap: anywhere; }
.pe-site .faq h2 { overflow-wrap: anywhere; }
.pe-site .footer-bottom { color: var(--pe-muted); }
.pe-site .card-bottom a[data-book] { display: grid; place-items: center; text-decoration: none; border: 1px solid #c2ccb9; background: transparent; border-radius: 50%; width: 44px; height: 44px; font-size: 22px; color: var(--ink); }
.pe-site .card-bottom a[data-book]:hover { background: var(--green); color: white; }
.pe-button { display: inline-flex; justify-content: center; align-items: center; gap: 1.25rem; min-height: 54px; padding: .875rem 1.5rem; border: 1px solid var(--pe-ink); border-radius: var(--pe-radius-pill); background: var(--pe-ink); color: var(--pe-surface); font: 600 .75rem/1.5 var(--pe-font-ui); text-decoration: none; cursor: pointer; transition: background var(--pe-motion-fast), color var(--pe-motion-fast), transform var(--pe-motion-fast); }
.pe-button:hover { background: var(--pe-mineral-ink); border-color: var(--pe-mineral-ink); }
.pe-button:active { transform: translateY(1px); }
.pe-button--small { min-height: 44px; padding: .65rem 1.125rem; }
.pe-button--quiet { background: transparent; color: var(--pe-ink); border-color: #a7afa5; }
.pe-button--quiet:hover { color: var(--pe-ink); background: var(--pe-surface); border-color: var(--pe-muted); }
.pe-menu { display: none; min-height: 44px; padding: .5rem .75rem; border: 1px solid var(--pe-line); border-radius: var(--pe-radius-pill); background: transparent; color: var(--pe-ink); font: 500 .75rem/1.5 var(--pe-font-ui); cursor: pointer; }
.pe-site :is(.pe-button, .pe-brand, .pe-nav a, .pe-menu, .pe-demo a):focus-visible { outline: 2px solid var(--pe-mineral-ink); outline-offset: 5px; }
.pe-hero { font-family: var(--pe-font-ui); position: relative; overflow: clip; }
.pe-hero__layout { display: grid; grid-template-columns: 1.06fr 1fr; align-items: center; gap: 2rem; padding-block: 3.75rem 3.25rem; }
.pe-hero__copy { position: relative; z-index: 2; }
@media(max-height:600px){.pe-header{position:relative}}
.pe-hero__layout > *, .pe-hero__copy > * { min-width: 0; overflow-wrap: anywhere; }
.pe-eyebrow { display: flex; align-items: center; gap: .875rem; color: var(--pe-muted); font: 600 var(--pe-type-label)/1.6 var(--pe-font-ui); letter-spacing: .16em; text-transform: uppercase; margin: 0 0 1.75rem; }
.pe-eyebrow::before { content: ''; width: 28px; height: 1px; background: var(--pe-brass); }
.pe-hero__title { font: 400 var(--pe-type-display)/.96 var(--pe-font-display); letter-spacing: -.035em; margin: 0; max-width: none; color: var(--pe-ink); }
.pe-hero__line { display: block; }
.pe-hero__title em { font: italic 400 1em/.96 var(--pe-font-display); color: var(--pe-mineral-ink); }
.pe-hero__description { font-size: var(--pe-type-body); line-height: 1.85; color: var(--pe-muted); max-width: 29rem; margin: 1.75rem 0; }
.pe-hero__ctas { display: flex; flex-wrap: wrap; gap: .75rem; }
.pe-hero__note { margin: 1.25rem 0 0; color: var(--pe-muted); font-size: .6875rem; line-height: 1.7; }
.pe-scene { margin: 0; position: relative; isolation: isolate; }
.pe-scene__stage { position: relative; }
.pe-scene__canvas { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity 500ms var(--pe-ease); clip-path: inset(4% 15% 10% 13% round 50% 50% 0 0); }
.pe-scene__canvas canvas { display: block; width: 100%; height: 100%; }
.pe-scene__orbit { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.pe-scene[data-3d-ready] .pe-scene__canvas { opacity: 1; }
.pe-scene[data-3d-ready] .pe-ceramic__arrival { animation: none; opacity: 0; visibility: hidden; transition: opacity 500ms, visibility 0s 500ms; }
.pe-scene[data-3d-ready] .pe-ceramic__float { animation-play-state: paused; }
.pe-scene[data-3d-ready] .pe-niche__shadow { opacity: 0; }
.pe-scene__image { display: block; width: 100%; height: auto; }
.pe-ceramic__pointer { transform-origin: 300px 350px; transform: translate(var(--pe-tilt-x, 0px), var(--pe-tilt-y, 0px)) rotate(var(--pe-tilt-angle, 0deg)); transition: transform 750ms var(--pe-ease); }
.pe-ceramic__shine { transform: translate(var(--pe-light-x, -24px), var(--pe-light-y, -8px)); transition: transform 650ms var(--pe-ease); }
.pe-ceramic__shade-left { opacity: var(--pe-shade-left, .12); transition: opacity 650ms var(--pe-ease); }
.pe-ceramic__shade-right { opacity: var(--pe-shade-right, .19); transition: opacity 650ms var(--pe-ease); }
.pe-ceramic__light { pointer-events: none; }
.pe-orbit { pointer-events: none; opacity: .72; }
.pe-orbit__text { font: 500 12px var(--pe-font-ui); }
.pe-orbit__rotation { transform-origin: 300px 350px; }
.pe-scene__caption { display: flex; justify-content: space-between; align-items: baseline; gap: .75rem; border-top: 1px solid var(--pe-line); padding-top: .875rem; color: var(--pe-muted); font: 500 .625rem/1.6 var(--pe-font-ui); letter-spacing: .11em; text-transform: uppercase; }
.pe-scene__caption span:first-child { color: var(--pe-mineral-ink); }
.pe-hero__footer { display: flex; justify-content: space-between; gap: 1rem; padding-block: 1.25rem; border-top: 1px solid var(--pe-line); font: 500 .625rem/1.6 var(--pe-font-ui); letter-spacing: .1em; color: var(--pe-muted); text-transform: uppercase; }
.pe-hero__footer a { text-decoration: underline; text-underline-offset: .3em; }
@keyframes pe-arrive { from { opacity: .55; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes pe-ceramic-arrive { from { opacity: .25; } to { opacity: 1; } }
@keyframes pe-light-arrive { from { opacity: .35; } to { opacity: 1; } }
@keyframes pe-orbit-arrive { from { opacity: 0; } to { opacity: .72; } }
@keyframes pe-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4.5px); } }
@keyframes pe-orbit { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: no-preference) {
  .pe-hero__title { animation: pe-arrive 650ms var(--pe-ease) both; }
  .pe-ceramic__arrival { animation: pe-ceramic-arrive 900ms var(--pe-ease) 90ms both; }
  .pe-ceramic__light { animation: pe-light-arrive 1100ms var(--pe-ease) 240ms both; }
  .pe-orbit { animation: pe-orbit-arrive 900ms var(--pe-ease) 360ms both; }
  .pe-hero__ctas { animation: pe-arrive 650ms var(--pe-ease) 360ms both; }
  .pe-hero__ctas:focus-within { animation: none; }
  .pe-ceramic__float { animation: pe-float 10s ease-in-out infinite; }
  .pe-orbit__rotation { animation: pe-orbit 54s linear infinite; }
  .pe-scene[data-scene-paused] :is(.pe-ceramic__float, .pe-orbit__rotation) { animation-play-state: paused; }
}
@media (max-width: 1100px) {
  .pe-header__inner { gap: 1rem; }
  .pe-hero__layout { gap: 1.5rem; padding-block: 3rem; }
  .pe-hero__title { font-size: clamp(4rem, 7.5vw, 5.5rem); }
  .pe-hero__ctas { gap: .625rem; }
  .pe-button { padding-inline: 1.125rem; }
}
@media (max-width: 800px) {
  .pe-demo { flex-wrap: wrap; justify-content: space-between; gap: .125rem .75rem; }
  .pe-demo span { flex-basis: 100%; order: 3; }
  .pe-header__inner { min-height: 72px; gap: .5rem; padding-block: .75rem; }
  .pe-brand { font-size: 1.25rem; }
  .pe-header__actions { grid-column: 2; grid-row: 1; }
  .pe-nav--desktop { display: none; }
  .pe-mobile-nav { display: block; }
  .pe-mobile-nav .pe-menu { display: flex; align-items: center; list-style: none; }
  .pe-mobile-nav .pe-menu::-webkit-details-marker { display: none; }
  .pe-mobile-nav .pe-nav { position: absolute; inset: 100% 0 auto; display: flex; justify-content: space-between; flex-wrap: wrap; gap: .75rem; padding: .75rem var(--pe-gutter); background: var(--pe-bg); border-bottom: 1px solid var(--pe-line); }
  .pe-hero__layout { grid-template-columns: 1fr; gap: 2rem; padding-block: 2.5rem 1.5rem; }
  .pe-hero__copy { max-width: 38rem; }
  .pe-hero__title { font-size: clamp(3.625rem, 9.25vw, 5.5rem); }
  .pe-hero__description { margin-block: 1.25rem; }
  .pe-eyebrow { margin-bottom: 1.25rem; }
  .pe-scene { width: min(100%, 30rem); margin-inline: auto; }
  .pe-scene__image { max-height: 440px; }
  .pe-orbit__text { font-size: 15px; }
  .pe-hero__footer { padding-block: 1rem; }
}
@media (max-width: 480px) {
  .pe-header__actions { gap: .5rem; }
  .pe-button--small { padding-inline: .75rem; font-size: .6875rem; gap: .625rem; }
  .pe-menu { padding-inline: .625rem; font-size: .6875rem; }
  .pe-header__full-label { display: none; }
  .pe-header__compact-label { display: inline; }
  .pe-hero__layout { padding-top: 2rem; gap: 1.5rem; }
  .pe-hero__title { font-size: clamp(3.125rem, 14.8vw, 4.25rem); }
  .pe-hero__description { font-size: .8125rem; line-height: 1.8; max-width: 22rem; }
  .pe-hero__ctas { flex-direction: column; align-items: stretch; }
  .pe-hero__ctas .pe-button { min-height: 50px; }
  .pe-scene__image { max-height: 355px; }
  .pe-hero__footer { font-size: .5625rem; letter-spacing: .07em; }
}
@media (min-width: 641px) and (max-width: 800px) {
  .pe-hero__layout { grid-template-columns: 1.08fr .92fr; gap: 1rem; padding-block: 3rem; }
  .pe-hero__title { font-size: clamp(3.125rem, 7.2vw, 3.625rem); }
  .pe-eyebrow { font-size: .625rem; letter-spacing: .12em; }
  .pe-hero__description { font-size: .8125rem; }
  .pe-hero__ctas { flex-direction: column; align-items: flex-start; }
  .pe-hero__note { font-size: .625rem; }
  .pe-scene__image { max-height: none; }
  .pe-orbit__text { font-size: 14px; }
  .pe-scene__caption { flex-direction: column; gap: .125rem; }
}
@media (max-width: 380px) {
  .pe-site { --pe-gutter: 1rem; }
  .pe-brand { font-size: 1.125rem; }
}
@media (prefers-reduced-motion: reduce) {
  .pe-hero *, .pe-header * { animation: none; transition: none; }
  .pe-ceramic__pointer, .pe-ceramic__float, .pe-orbit__rotation { transform: none; }
}
