@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=Italiana&display=swap');

html { scroll-behavior: smooth; }
.pps {
  --paper: #ffffff;
  --white: #ffffff;
  --ink: #20231f;
  --muted: #66695f;
  --olive: #5f654f;
  --rule: rgba(32,35,31,.17);
  --pad: clamp(22px, 4.7vw, 80px);
  --serif: 'Italiana', Georgia, serif;
  --sans: 'DM Sans', Arial, sans-serif;
  min-height: 100vh;
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font: 300 16px/1.55 var(--sans);
  -webkit-font-smoothing: antialiased;
}
.pps *, .pps *::before, .pps *::after { box-sizing: border-box; }
.pps a { color: inherit; text-decoration: none; }
.pps h1, .pps h2, .pps h3, .pps p { margin: 0; }
.pps img { display: block; max-width: 100%; }
.pps section[id], .pps div[id] { scroll-margin-top: 100px; }
.pps :focus-visible { outline: 2px solid var(--olive); outline-offset: 5px; }
.pps .eyebrow { font-size: 10px; font-weight: 600; line-height: 1.5; letter-spacing: .19em; text-transform: uppercase; }
.pps .muted { color: var(--muted); }
.pps .site-header {
  position: sticky; top: 0; z-index: 20; height: 82px; padding: 0 var(--pad);
  display: flex; align-items: center; justify-content: space-between;
  border-bottom: 1px solid var(--rule);
  background: rgba(255,255,255,.96); backdrop-filter: blur(16px);
}
.pps .wordmark { display: inline-flex; flex-direction: column; line-height: .9; white-space: nowrap; }
.pps .wordmark-main { font: 400 30px/.87 var(--serif); letter-spacing: -.035em; }
.pps .wordmark-sub { margin: 8px 0 0 2px; font-size: 9px; font-weight: 600; letter-spacing: .48em; }
.pps .desktop-nav { display: flex; gap: clamp(18px, 2.5vw, 38px); align-items: center; }
.pps .desktop-nav a, .pps .mobile-nav a { font-size: 10px; font-weight: 500; letter-spacing: .17em; text-transform: uppercase; transition: color .18s ease; }
.pps .desktop-nav a:hover, .pps .mobile-nav a:hover { color: var(--olive); }
.pps .desktop-nav .nav-contact { display: inline-flex; align-items: center; gap: 6px; border-bottom: 1px solid var(--ink); padding: 7px 0; }
.pps .nav-contact .arrow-icon { width: 13px; height: 13px; }
.pps .mobile-nav { display: none; position: relative; }
.pps .mobile-nav summary { cursor: pointer; list-style: none; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }
.pps .mobile-nav summary::-webkit-details-marker { display: none; }
.pps .mobile-nav[open] .mobile-nav-items { position: absolute; right: 0; top: 42px; display: grid; gap: 18px; min-width: 185px; padding: 24px; background: var(--paper); border: 1px solid var(--rule); box-shadow: 0 12px 32px rgba(20,24,18,.11); }
.pps .hero { padding: clamp(45px, 6.2vw, 100px) var(--pad) clamp(90px, 10vw, 150px); }
.pps .hero-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(28px, 4.5vw, 74px); align-items: stretch; }
.pps .hero-content { display: flex; flex-direction: column; min-width: 0; padding-top: 7px; }
.pps .hero-topline { display: flex; align-items: center; gap: 20px; }
.pps .hero-topline::after { content: ''; height: 1px; background: var(--rule); flex: 1; }
.pps .hero h1 { margin: clamp(38px, 5vw, 80px) 0 0 -5px; font: 400 clamp(67px, 8.2vw, 148px)/.86 var(--serif); letter-spacing: -.052em; }
.pps .hero h1 span { color: var(--olive); }
.pps .hero-bottom { margin-top: auto; padding-top: 68px; display: grid; grid-template-columns: 1fr 1.15fr; gap: 26px; align-items: start; }
.pps .hero-bottom .eyebrow { padding-top: 6px; }
.pps .hero-copy { max-width: 365px; color: var(--muted); font-size: 14px; line-height: 1.72; }
.pps .hero-copy p { margin-bottom: 22px; }
.pps .text-link { display: inline-flex; align-items: center; gap: 16px; padding: 0 0 7px; border-bottom: 1px solid currentColor; font-size: 10px; font-weight: 600; letter-spacing: .17em; line-height: 1.5; text-transform: uppercase; transition: gap .22s cubic-bezier(.23,1,.32,1), color .18s ease; }
.pps .text-link:hover { gap: 23px; color: var(--olive); }
.pps .arrow-icon { width: 18px; height: 18px; flex: none; transition: transform .22s cubic-bezier(.23,1,.32,1); }
.pps .text-link:hover .arrow-icon, .pps .footer-project-link:hover .arrow-icon, .pps .nav-contact:hover .arrow-icon, .pps .service-card:hover .arrow-icon { transform: translate(2px,-2px); }
.pps .hero-media { min-width: 0; height: clamp(450px, 47vw, 680px); position: relative; overflow: hidden; background: #ffffff; }
.pps .hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: 55% 50%; }
.pps .hero-caption { position: absolute; bottom: 0; left: 0; right: 0; padding: 44px 25px 20px; color: white; background: linear-gradient(transparent, rgba(12,15,11,.55)); font-size: 10px; font-weight: 500; letter-spacing: .17em; text-transform: uppercase; }
.pps .studio-section { padding: 0 var(--pad) clamp(100px, 11vw, 160px); }
.pps .section-rule { height: 1px; background: var(--rule); }
.pps .studio-grid { display: grid; grid-template-columns: .29fr 1fr; gap: 8vw; padding-top: 35px; }
.pps .studio-grid .eyebrow { padding-top: 10px; }
.pps .studio-copy { max-width: 1020px; }
.pps .studio-lead { font: 400 clamp(39px, 5vw, 77px)/1.07 var(--serif); letter-spacing: -.029em; }
.pps .studio-note { max-width: 500px; margin-top: 35px !important; color: var(--muted); font-size: 14px; line-height: 1.76; }
.pps .services-section { padding: clamp(90px, 10vw, 148px) var(--pad) clamp(110px, 12vw, 170px); background: var(--white); }
.pps .section-intro { display: grid; grid-template-columns: .29fr 1fr; gap: 8vw; align-items: start; margin-bottom: clamp(52px, 6vw, 88px); }
.pps .section-intro > .eyebrow { padding-top: 12px; }
.pps .section-intro h2 { font: 400 clamp(53px, 6vw, 102px)/.96 var(--serif); letter-spacing: -.043em; }
.pps .section-intro p { max-width: 660px; margin-top: 19px; color: var(--muted); font-size: 14px; line-height: 1.75; }
.pps .service-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); column-gap: clamp(24px, 5vw, 82px); row-gap: clamp(65px, 8vw, 118px); align-items: start; }
.pps .service-card:nth-child(even) { transform: translateY(90px); }
.pps .service-photo { overflow: hidden; aspect-ratio: 4 / 5; background: #ffffff; }
.pps .service-photo img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s cubic-bezier(.23,1,.32,1); }
.pps .service-card:hover img { transform: scale(1.035); }
.pps .service-meta { display: flex; justify-content: space-between; padding: 19px 0 15px; border-bottom: 1px solid var(--rule); color: var(--muted); }
.pps .service-title { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-top: 18px; }
.pps .service-title h3 { font: 400 clamp(33px, 3.6vw, 57px)/1.05 var(--serif); letter-spacing: -.02em; }
.pps .service-title .arrow-icon { width: 22px; height: 22px; color: var(--olive); }
.pps .service-card > p { margin-top: 11px; max-width: 430px; color: var(--muted); font-size: 13px; line-height: 1.75; }
.pps .manifesto { padding: clamp(80px, 10vw, 155px) var(--pad); color: #f8f6f0; background: #242820; }
.pps .manifesto-top { display: grid; grid-template-columns: .29fr 1fr; gap: 8vw; }
.pps .manifesto-top .eyebrow { color: #c4c8b8; padding-top: 12px; }
.pps .manifesto-quote { max-width: 1150px; font: 400 clamp(48px, 7vw, 116px)/.98 var(--serif); letter-spacing: -.04em; }
.pps .manifesto-quote em { font-style: normal; color: #bec5ad; }
.pps .process { display: grid; grid-template-columns: repeat(3,1fr); gap: 34px; margin-top: clamp(75px, 9vw, 140px); border-top: 1px solid rgba(255,255,255,.25); }
.pps .process-item { padding-top: 20px; }
.pps .process-item .eyebrow { color: #b8bcac; }
.pps .process-item h3 { margin-top: 24px; font: 400 clamp(30px, 3vw, 48px)/1 var(--serif); }
.pps .process-item p { margin-top: 11px; max-width: 320px; color: #bfc3b7; font-size: 13px; line-height: 1.7; }
.pps .contact-section { display: grid; grid-template-columns: 1fr .48fr; gap: 6vw; align-items: end; padding: clamp(105px, 13vw, 190px) var(--pad); }
.pps .contact-section h2 { font: 400 clamp(65px, 8.5vw, 140px)/.87 var(--serif); letter-spacing: -.045em; }
.pps .contact-copy { max-width: 400px; padding-bottom: 5px; }
.pps .contact-copy p { margin: 20px 0 28px; color: var(--muted); font-size: 14px; line-height: 1.76; }
.pps .site-footer { padding: 53px var(--pad) 25px; border-top: 1px solid var(--rule); }
.pps .footer-main { display: flex; justify-content: space-between; gap: 35px; padding-bottom: 67px; }
.pps .footer-main .wordmark-main { font-size: 43px; }
.pps .footer-columns { display: flex; gap: clamp(40px, 6vw, 100px); }
.pps .footer-columns .eyebrow { color: var(--muted); margin-bottom: 14px; }
.pps .footer-columns span, .pps .footer-columns a { display: block; margin: 5px 0; font-size: 12px; }
.pps .footer-columns a.footer-project-link { display: inline-flex; align-items: center; gap: 5px; }
.pps .footer-project-link .arrow-icon { width: 13px; height: 13px; }
.pps .footer-columns a:hover { text-decoration: underline; }
.pps .footer-bottom { display: flex; justify-content: space-between; gap: 20px; padding-top: 18px; border-top: 1px solid var(--rule); color: var(--muted); font-size: 10px; letter-spacing: .07em; text-transform: uppercase; }
@media (max-width: 1100px) {
  .pps .hero h1 { font-size: clamp(62px, 8.1vw, 95px); }
  .pps .hero-bottom { grid-template-columns: 1fr; gap: 15px; padding-top: 38px; }
  .pps .hero-media { height: 540px; }
}
@media (max-width: 780px) {
  .pps .desktop-nav { display: none; }
  .pps .mobile-nav { display: block; }
  .pps .site-header { height: 74px; }
  .pps .hero { padding-top: 48px; }
  .pps .hero-grid, .pps .studio-grid, .pps .section-intro, .pps .manifesto-top, .pps .contact-section { grid-template-columns: 1fr; gap: 26px; }
  .pps .hero h1 { margin-top: 39px; font-size: clamp(76px, 14.2vw, 118px); }
  .pps .hero-bottom { grid-template-columns: .75fr 1fr; gap: 20px; padding: 33px 0 45px; }
  .pps .hero-media { height: min(75vw, 550px); }
  .pps .studio-grid, .pps .section-intro, .pps .manifesto-top { gap: 24px; }
  .pps .section-intro > .eyebrow, .pps .studio-grid .eyebrow { padding-top: 0; }
  .pps .service-card:nth-child(even) { transform: translateY(52px); }
  .pps .footer-main { flex-direction: column; gap: 38px; }
}
@media (max-width: 620px) {
  .pps .wordmark-main { font-size: 26px; }
  .pps .hero { padding-bottom: 88px; }
  .pps .hero h1 { margin-left: -3px; font-size: clamp(59px, 16vw, 99px); }
  .pps .hero-bottom { grid-template-columns: 1fr; gap: 13px; }
  .pps .hero-bottom .eyebrow { padding: 0; }
  .pps .hero-media { height: 108vw; max-height: 530px; }
  .pps .studio-section { padding-bottom: 92px; }
  .pps .studio-lead { font-size: clamp(40px, 10vw, 62px); }
  .pps .services-section { padding-top: 85px; padding-bottom: 96px; }
  .pps .section-intro h2 { font-size: clamp(56px, 12vw, 75px); }
  .pps .service-grid { grid-template-columns: 1fr; row-gap: 54px; }
  .pps .service-card:nth-child(even) { transform: none; }
  .pps .service-photo { aspect-ratio: 4 / 4.5; }
  .pps .service-title h3 { font-size: 42px; }
  .pps .manifesto { padding-top: 90px; padding-bottom: 92px; }
  .pps .manifesto-quote { font-size: clamp(48px, 11.7vw, 68px); }
  .pps .process { grid-template-columns: 1fr; gap: 0; margin-top: 70px; }
  .pps .process-item { padding: 23px 0 29px; border-bottom: 1px solid rgba(255,255,255,.2); }
  .pps .process-item h3 { margin-top: 15px; }
  .pps .contact-section { padding-top: 100px; padding-bottom: 105px; }
  .pps .contact-section h2 { font-size: clamp(68px, 15vw, 100px); }
  .pps .footer-columns { flex-wrap: wrap; gap: 35px 55px; }
  .pps .footer-bottom { flex-direction: column; gap: 4px; }
}
@media (prefers-reduced-motion: reduce) {
  .pps .text-link, .pps .arrow-icon, .pps .service-photo img, .pps .desktop-nav a, .pps .mobile-nav a { transition: none; }
}
