.pf {
  --pf-bg: #061321;
  --pf-raised: #0a1d30;
  --pf-rule: #29455d;
  --pf-type: #f1f7ff;
  --pf-body: #c2d2df;
  --pf-accent: #78e6fc;
  color: var(--pf-type);
  background: var(--pf-bg);
}
.pf * { box-sizing: border-box; }
.pf h2, .pf h3, .pf p, .pf figure, .pf dl, .pf dd, .pf ul { margin: 0; }
.pf h2, .pf h3 { text-wrap: balance; }
.pf h2 {
  font-size: clamp(2rem, 4.35vw, 4rem);
  line-height: 1.04;
  font-weight: 700;
  letter-spacing: -.05em;
}
.pf h3 { font-size: clamp(1.28rem, 2.05vw, 1.72rem); line-height: 1.18; font-weight: 670; letter-spacing: -.035em; }
.pf p, .pf dd { color: var(--pf-body); line-height: 1.65; }
.pf .pf-lead, .pf-intro > p, .pf-photo-intro > p { font-size: clamp(1.03rem, 1.45vw, 1.18rem); line-height: 1.55; }
.pf-inner { width: min(calc(100% - clamp(40px, 9vw, 144px)), 1180px); margin-inline: auto; }
.pf-chapter { padding-block: clamp(44px, 5.8vw, 86px); border-top: 1px solid var(--pf-rule); }
.pf-intro { max-width: 55rem; }
.pf-intro > p { max-width: 69ch; margin-top: 16px; }
.pf img { display: block; max-width: 100%; }
.pf a { color: var(--pf-accent); text-underline-offset: .23em; }
.pf a:hover { color: white; }
.pf a:focus-visible, .pf summary:focus-visible { outline: 3px solid var(--pf-accent); outline-offset: 4px; }
.pf .pf-link { width: fit-content; display: inline-block; font-weight: 650; }
.pf-links { display: flex; align-items: baseline; flex-wrap: wrap; gap: 9px 20px; }
.pf-chapter .pf-contents {
  padding: 0;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: .2rem 1.25rem;
  margin: 18px 0 32px;
}
.pf-contents a { display: inline-block; padding-block: 4px; font-size: .94rem; }

.pf-project-grid, .pf-consult-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(18px,3.1vw,45px); }
.pf-project { display: flex; flex-direction: column; align-items: flex-start; }
.pf-project-img { width: 100%; height: auto; aspect-ratio: 1.85; object-fit: cover; border-radius: 9px; background: #0d2030; }
.pf-chameleon { object-position: 50% 40%; }
.pf-project h3 { margin-top: 20px; }
.pf-project p, .pf-game p, .pf-consult-grid p { margin: 10px 0 15px; }
.pf-project .pf-link { margin-top: auto; }
.pf-film, .pf-photography, .pf-automation, .pf-about { background-color: var(--pf-raised); }
.pf-film-grid { display: grid; grid-template-columns: minmax(0,.87fr) minmax(0,1.13fr); align-items: center; gap: 28px clamp(32px,6vw,82px); }
.pf-film-text p, .pf-film-text .pf-link { margin-top: 16px; }
.pf-frame img { width: 100%; height: auto; border-radius: 10px; }

.pf-section-head { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 14px 36px; margin-bottom: 28px; }
.pf-game-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(24px,5vw,70px); }
.pf-game img { border-radius: 9px; width: 100%; height: auto; aspect-ratio: 1.7; object-fit: contain; background-color: #102420; }
.pf-game h3 { margin-top: 20px; }
.pf-game p { max-width: 56ch; }
.pf-photo-intro { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,.9fr); gap: 14px clamp(26px,5.5vw,75px); align-items: end; }
.pf-photo-intro p { max-width: 43ch; }
.pf-photo-grid { display: grid; grid-template-columns: minmax(0,2.3fr) minmax(0,.85fr); gap: clamp(12px,2vw,30px); margin-top: 28px; align-items: start; }
.pf-photo-grid img { width: 100%; height: auto; aspect-ratio: 2.17; object-fit: cover; border-radius: 8px; }
.pf-photo-grid figure:nth-child(2) img { aspect-ratio: .8; }
.pf figcaption { color: var(--pf-type); margin-top: 8px; font-size: .85rem; line-height: 1.4; }
.pf figcaption span { color: var(--pf-body); white-space: nowrap; }

.pf-technical { background: #05111e; }
.pf .pf-data { margin-top: 28px; }
.pf-data > div { display: grid; grid-template-columns: minmax(0,.65fr) minmax(0,1.35fr); gap: 10px clamp(26px,4vw,60px); padding-block: clamp(18px,2.5vw,32px); border-top: 1px solid var(--pf-rule); }
.pf-data > div:last-child { border-bottom: 1px solid var(--pf-rule); }
.pf-data strong { display: block; color: var(--pf-accent); font-size: clamp(2.1rem,4vw,3.4rem); line-height: 1.05; font-weight: 640; letter-spacing: -.055em; font-variant-numeric: tabular-nums; }
.pf-data dt span { display: block; max-width: 31ch; margin-top: 5px; color: var(--pf-body); font-size: .9rem; line-height: 1.46; }
.pf-data h3 { color: var(--pf-type); }
.pf-data dd p { margin-top: 7px; max-width: 68ch; }

.pf-two-column { display: grid; grid-template-columns: minmax(0,.83fr) minmax(0,1.17fr); gap: 22px clamp(30px,7vw,95px); align-items: start; }
.pf-two-column .pf-lead { margin-top: 16px; }
.pf-notes { display: grid; gap: 24px; }
.pf-notes article + article { padding-top: 20px; border-top: 1px solid var(--pf-rule); }
.pf-notes p { margin-top: 8px; }
.pf-notes a { margin-top: 10px; }
.pf-consult-grid { margin-top: 26px; }
.pf-consult-grid article { border-top: 1px solid var(--pf-rule); padding-top: 17px; }
.pf-consult-grid article p { margin-bottom: 0; }
.pf-about-grid { display: grid; grid-template-columns: minmax(140px,220px) minmax(0,1fr); align-items: center; gap: 22px clamp(32px,6vw,90px); }
.pf-about-grid img { width: 100%; height: auto; border-radius: 50%; }
.pf-about-grid p { margin-top: 14px; max-width: 69ch; }
.pf-answers details { border-top: 1px solid var(--pf-rule); padding-block: 12px; }
.pf-answers details:last-child { border-bottom: 1px solid var(--pf-rule); }
.pf-answers summary { cursor: pointer; font-weight: 650; padding: 3px 0; }
.pf-answers summary::marker { color: var(--pf-accent); }
.pf-answers p { margin-top: 9px; max-width: 58ch; }

@media (max-width: 800px) {
  .pf-project-grid, .pf-consult-grid { gap: 20px; }
  .pf-project h3 { font-size: 1.25rem; }
  .pf-film-grid, .pf-two-column { gap: 26px; }
}
@media (max-width: 680px) {
  .pf-chapter { padding-block: 42px; }
  .pf-project-grid, .pf-consult-grid, .pf-film-grid, .pf-game-grid, .pf-photo-intro, .pf-two-column { grid-template-columns: 1fr; }
  .pf-project-grid, .pf-game-grid { gap: 33px; }
  .pf-film-grid { gap: 24px; }
  .pf-project h3 { font-size: 1.46rem; }
  .pf-chapter .pf-contents { gap: 0 16px; margin: 13px 0 23px; }
  .pf-project h3, .pf-game h3 { margin-top: 14px; }
  .pf-section-head { margin-bottom: 21px; }
  .pf-photo-grid { grid-template-columns: minmax(0,1.6fr) minmax(0,1fr); gap: 12px; }
  .pf-photo-grid img { aspect-ratio: 1.24; }
  .pf-photo-grid figure:nth-child(2) img { aspect-ratio: .775; }
  .pf-data > div { grid-template-columns: minmax(0,.6fr) minmax(0,1.1fr); gap: 18px; }
  .pf-data dt span { font-size: .84rem; }
  .pf-data dd p { line-height: 1.55; }
  .pf-about-grid { grid-template-columns: 1fr; }
  .pf-about-grid img { width: 106px; }
}
@media (max-width: 480px) {
  .pf-data > div { grid-template-columns: 1fr; gap: 11px; }
  .pf-data dt { display: flex; align-items: center; gap: 14px; }
  .pf-data strong { flex-shrink: 0; }
  .pf-data dt span { max-width: 20ch; margin-top: 0; }
}