/* Art direction: a typographic cover and an editorial sequence of real projects. */
:root{--bg:#101110;--surface:#1b1d1a;--line:#353830;--ink:#f3f4ec;--muted:#aab0a3}
.header{height:88px;position:sticky;top:0;z-index:10;background:rgba(16,17,16,.93);backdrop-filter:blur(14px);padding-inline:48px}
.wrap{width:calc(100% - 96px);max-width:1480px}.brand-mark{font-size:2.35rem}.header nav a[aria-current]{color:var(--acid)}
.hero{padding:38px 0 38px}.hero-top{border-bottom:1px solid var(--line);padding-bottom:22px}
.hero-composition{display:grid;grid-template-columns:1fr 1.03fr;align-items:center;gap:40px;padding:42px 0 10px}
.hero-title-block{position:relative;z-index:1;min-width:0}h1{font-size:clamp(3.5rem,9.1vw,9.8rem);font-weight:700;letter-spacing:-.075em;line-height:.9;margin:0;overflow-wrap:normal}
h1>span{display:block}.name-outline{-webkit-text-stroke:1px #e5e7da;color:transparent;margin-top:12px}.name-period{color:var(--acid);-webkit-text-stroke:0}
.hero-description{font-size:1rem;line-height:1.65;margin-top:30px;color:var(--muted)}
.hero-stage{height:440px;position:relative;perspective:1200px;isolation:isolate;--stage-x:0deg;--stage-y:0deg}
.stage-caption{position:absolute;right:0;top:0;font:.75rem/1.5 'Courier New',monospace;letter-spacing:.08em;color:var(--muted)}
.hero-fragment{padding:0;position:absolute;background:#ebece6;box-shadow:0 20px 55px #0007;text-align:left;transform:rotate(var(--rotation)) rotateX(var(--stage-y)) rotateY(var(--stage-x));transition:transform .35s ease,box-shadow .35s;outline-offset:6px;border:5px solid #e7e9df;border-bottom:0;color:var(--bg)}
.hero-fragment img{width:100%;height:calc(100% - 26px);object-fit:cover}.hero-fragment>span{display:block;height:26px;padding:7px 7px 5px;font:.75rem/1 'Courier New',monospace;letter-spacing:.025em}
.hero-fragment:hover{z-index:5;transform:rotate(0deg) translateY(-9px);box-shadow:0 25px 60px #000a}
.fragment-interior{width:76%;height:245px;left:13%;top:50px;--rotation:5deg;z-index:2}.fragment-catalog{width:34%;height:260px;left:1%;top:166px;--rotation:-9deg;z-index:3}.fragment-catalog img{object-fit:cover;object-position:top}
.fragment-packaging{width:43%;height:195px;right:0;top:231px;--rotation:8deg;z-index:4}.fragment-packaging img{object-fit:contain;padding:10px;mix-blend-mode:multiply}
.hero-bottom{margin-top:22px;padding-top:25px;border-top:1px solid var(--line)}.hero-bottom p{font-size:.875rem}.hero-scroll-note{font:.75rem/1.5 'Courier New',monospace;color:var(--muted);letter-spacing:.04em;max-width:145px;text-align:right}
.project-cta{background:transparent;color:var(--acid);border-color:#708044;padding:17px 22px}.project-cta:hover{color:var(--bg);background:var(--acid);border-color:var(--acid)}.cta-count{border-color:#708044}
.work{padding-top:60px;border-top:0}.section-head{margin-bottom:38px}h2{font-size:clamp(2.5rem,4.5vw,4.6rem)}
.filters{margin:36px 0 45px;gap:0;border-block:1px solid var(--line)}.filter{border:0;border-right:1px solid var(--line);border-radius:0;padding:16px 23px}.filter:first-child{border-left:1px solid var(--line)}.filter.active{background:var(--acid)}.filter:not(.active):hover{background:var(--surface)}
.project-grid{grid-template-columns:repeat(12,minmax(0,1fr));gap:70px 30px;align-items:end}
.project{grid-column:span 4;min-width:0}.project[data-project=bianko]{grid-column:span 8}.project[data-project=softina]{grid-column:span 5}.project[data-project=accessories]{grid-column:span 3}.project[data-project=office]{grid-column:span 7}.project[data-project=pot]{grid-column:span 5}.project[data-project=catalog]{grid-column:span 8}
.project-image{border-radius:0;height:380px}.project[data-project=bianko] .project-image{height:500px}.project[data-project=office] .project-image,.project[data-project=pot] .project-image{height:460px}.project[data-project=catalog] .project-image{height:480px}
.project-image:after{content:'';position:absolute;inset:0;border:1px solid #ffffff0d;pointer-events:none}
.project-caption{display:flex;justify-content:space-between;gap:16px;align-items:baseline;border-top:1px solid var(--line);padding-top:15px;margin-top:20px}.project-caption h3{font-size:1.25rem;font-weight:400;line-height:1.35}.project-caption>span{font-size:.75rem;max-width:150px;text-align:right;margin:0;line-height:1.6}.project[data-project=accessories] .project-caption{display:block}.project[data-project=accessories] .project-caption>span{max-width:none;text-align:left;margin-top:7px}
.project-badge{top:15px;left:15px;background:#101110e8}.project-open{border-radius:2px;width:40px;height:40px;background:var(--bg);border:1px solid #ffffff4a;color:var(--ink)}.project:hover .project-open{transform:none;background:var(--acid);border-color:var(--acid);color:var(--bg)}
.project:hover .project-image img{transform:scale(1.025)}.project:hover .catalog-preview img{transform:none}.catalog-preview{padding:50px 25px 25px;background:#d9dad3;gap:16px}.catalog-preview img{box-shadow:0 10px 24px #0002}
.project-grid.is-filtered .project{grid-column:span 6}.project-grid.is-filtered .project-image{height:420px}.project-grid.is-filtered .project-caption{display:flex}
.work-note{margin-top:42px}.lab{padding:82px 0;background:#1d2319}.lab-shell{margin-top:44px}.lab-canvas{min-height:500px}.lab-controls{background:#242c1e}.lab-controls h3{font-size:2.6rem}.lab h2 em{color:var(--acid)}
.about{padding:100px 0;gap:100px}.about h2{font-size:clamp(3rem,5.2vw,5.6rem)}.about-content>.about-intro{font-size:1.6rem;line-height:1.45}.tool-list span{border-radius:0}.about-timeline>div{padding:22px 0}.contact{padding:90px 0 80px}.contact h2{font-size:clamp(3.5rem,8vw,8rem)}
.contact-info>a{transition:color .2s}.dialog-body h2{font-size:2.6rem}.dialog-body>p{font-size:1rem;line-height:1.7}.dialog-credit{border-top:1px solid var(--line);padding-top:24px}
@media(min-width:1600px){.hero-stage{height:500px}.fragment-interior{height:285px;top:65px}.fragment-catalog{height:300px;top:185px}.fragment-packaging{height:230px;top:260px}}
@media(max-width:1100px){.wrap{width:calc(100% - 64px)}.header{padding-inline:32px}.hero-composition{gap:24px}.hero-stage{height:380px}.fragment-interior{height:215px}.fragment-catalog{height:220px;top:150px}.fragment-packaging{height:165px;top:208px}.project-grid{gap:50px 20px}.project-image{height:310px}.project[data-project=bianko] .project-image{height:430px}.project[data-project=office] .project-image,.project[data-project=pot] .project-image{height:380px}.project[data-project=catalog] .project-image{height:400px}.project-caption{display:block}.project-caption>span{text-align:left;max-width:none;margin-top:8px}.about{gap:45px}}
@media(max-width:760px){.wrap{width:calc(100% - 36px)}.header{padding:13px 18px;min-height:76px;height:auto}.hero{padding-top:24px}.hero-top{padding-bottom:17px}.hero-composition{grid-template-columns:1fr;gap:12px;padding:28px 0 0}.hero-title-block h1{font-size:clamp(3rem,18vw,7rem);line-height:.92}.name-outline{margin-top:8px}.hero-description{font-size:.875rem;margin-top:23px}.hero-stage{height:355px;max-width:560px;width:100%;margin:10px auto 0}.stage-caption{font-size:.75rem;top:4px}.fragment-interior{top:36px;height:215px;width:76%;left:15%}.fragment-catalog{top:125px;height:210px;left:3%;width:31%}.fragment-packaging{top:187px;height:150px;right:3%;width:42%}.hero-bottom{margin-top:22px;gap:18px}.hero-scroll-note{display:none}.hero-bottom p{max-width:240px}.project-cta{padding:14px 18px}.work{padding-top:36px}.section-head h2{font-size:clamp(2rem,7.5vw,3.5rem)}.section-head p{margin-top:20px}.filters{border:0;gap:7px;margin:26px 0 30px}.filter,.filter:first-child{border:1px solid var(--line);padding:10px 13px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:35px 16px}.project,.project[data-project=bianko],.project[data-project=softina],.project[data-project=accessories],.project[data-project=office],.project[data-project=pot],.project[data-project=catalog],.project-grid.is-filtered .project{grid-column:span 1}.project[data-project=bianko],.project[data-project=office],.project[data-project=catalog]{grid-column:span 2}.project-image,.project[data-project=pot] .project-image{height:280px}.project[data-project=bianko] .project-image,.project[data-project=office] .project-image,.project[data-project=catalog] .project-image,.project-grid.is-filtered .project-image{height:360px}.project-grid.is-filtered .project{grid-column:span 2}.project-caption,.project-grid.is-filtered .project-caption{display:block;margin-top:15px;padding-top:13px}.project-caption h3{font-size:1.1rem}.project-caption>span{font-size:.75rem;line-height:1.55;text-align:left;max-width:none;margin-top:7px}.catalog-preview{padding:44px 16px 20px;gap:10px}.lab{padding:55px 0}.lab-canvas{min-height:350px}.lab-controls{padding:24px}.lab-controls h3{font-size:2rem}.about{padding:65px 0;gap:40px}.about h2{font-size:clamp(2rem,13vw,3.7rem)}.about-content>.about-intro{font-size:1.4rem!important}.contact{padding:55px 0 65px}.contact h2{font-size:clamp(3rem,13vw,5rem)}.dialog-body h2{font-size:2rem}}
@media(max-width:420px){.hero-stage{height:290px}.fragment-interior{height:170px;top:35px}.fragment-catalog{height:170px;top:106px}.fragment-packaging{height:125px;top:146px}.hero-bottom p{max-width:none}.project-grid{grid-template-columns:1fr;gap:35px}.project,.project[data-project=bianko],.project[data-project=softina],.project[data-project=accessories],.project[data-project=office],.project[data-project=pot],.project[data-project=catalog],.project-grid.is-filtered .project{grid-column:span 1}.project-image,.project[data-project=pot] .project-image,.project[data-project=bianko] .project-image,.project[data-project=office] .project-image,.project[data-project=catalog] .project-image,.project-grid.is-filtered .project-image{height:310px}.catalog-preview{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-preview>img:nth-child(3){display:none}}
@media(prefers-reduced-motion:reduce){.hero-fragment{transform:rotate(var(--rotation))}.hero-fragment:hover{transform:rotate(var(--rotation))}.header{backdrop-filter:none}}
.project[data-project=rice]{grid-column:span 12}.rice-preview{display:grid;grid-template-columns:1.5fr 1fr;height:500px;background:#f7eddb;gap:0}.rice-preview img:first-child{object-fit:contain;padding:26px}.rice-preview img:last-of-type{object-fit:cover;object-position:center 55%}.project:hover .rice-preview img{transform:none}.project-grid.is-filtered .rice-preview{grid-template-columns:1fr}.project-grid.is-filtered .rice-preview img:last-of-type{display:none}@media(max-width:760px){.project[data-project=rice]{grid-column:span 2}.rice-preview{height:360px}.rice-preview img:first-child{padding:12px}}@media(max-width:420px){.project[data-project=rice]{grid-column:span 1}.rice-preview{grid-template-columns:1fr;height:310px}.rice-preview img:last-of-type{display:none}}

/* New work follows the same alternating rhythm of images and printed pieces. */
.project[data-project=pcon-interiors]{grid-column:span 8}
.project[data-project=pcon-rooms]{grid-column:span 7}
.project[data-project=collections-ai]{grid-column:span 5}
.project[data-project=pcon-interiors] .project-image,.project[data-project=posters] .project-image{height:500px}
.project[data-project=agd] .project-image{height:480px}
.project[data-project=pcon-rooms] .project-image,.project[data-project=collections-ai] .project-image{height:460px}
.print-preview{padding:48px 24px 24px;background:#dfded8}
.poster-preview{background:#d8d4ca;isolation:isolate}
.poster-preview img{position:absolute;object-fit:contain;filter:drop-shadow(0 12px 14px #0003)}
.poster-preview img:first-child{width:75%;height:88%;top:3%;left:1%;transform:rotate(-7deg)}
.poster-preview img:nth-child(2){width:68%;height:76%;bottom:-2%;right:-3%;transform:rotate(8deg)}
.project:hover .poster-preview img:first-child{transform:rotate(-5deg) translateY(-4px)}
.project:hover .poster-preview img:nth-child(2){transform:rotate(6deg) translateY(-4px)}
.brand-preview{display:grid;grid-template-rows:1fr 1fr;gap:30px;align-items:center;justify-items:center;background:#d5d7d0;padding:54px 25px 35px}
.brand-preview img{width:92%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 12px #0003)}
.brand-preview img:first-child{transform:rotate(-6deg)}
.brand-preview img:nth-child(2){transform:rotate(6deg)}
.project:hover .brand-preview img:first-child{transform:rotate(-4deg)}
.project:hover .brand-preview img:nth-child(2){transform:rotate(4deg)}
.material-preview{background:#ecdcd3;padding:56px 22px 28px}
.gallery-section{min-width:0}.gallery-section h3{font-size:1rem;font-weight:400;letter-spacing:.01em;border-bottom:1px solid var(--line);padding:22px 0 16px;margin-bottom:20px;color:var(--ink)}
.gallery-group{display:grid;gap:22px}
#dialog-gallery.gallery-documents,.gallery-group.gallery-documents{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 20px;align-items:start}
#dialog-gallery.gallery-covers,.gallery-group.gallery-covers{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 18px;align-items:start}
.gallery-documents figure,.gallery-covers figure{min-width:0}
#dialog-gallery.gallery-documents img,.gallery-group.gallery-documents img{height:490px;object-fit:contain;padding:12px;background:#e8e8e2}
#dialog-gallery.gallery-covers img,.gallery-group.gallery-covers img{height:310px;object-fit:contain;padding:8px;background:#e8e8e2}
.gallery-documents a,.gallery-covers a{display:block}
.gallery-documents a:hover,.gallery-covers a:hover{outline:1px solid var(--acid);outline-offset:3px}
#dialog-gallery.gallery-cards,.gallery-group.gallery-cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 20px;align-items:start}
.gallery-cards figure{min-width:0}.gallery-cards a{display:block}.gallery-cards a:hover{outline:1px solid var(--acid);outline-offset:3px}
#dialog-gallery.gallery-cards img,.gallery-group.gallery-cards img{height:auto;object-fit:contain;background:#e8e8e2}
.certificates{margin:35px 0 38px}.certificates>h3{margin-bottom:16px}
.certificate{display:grid;grid-template-columns:75px minmax(0,1fr) 24px;gap:17px;width:100%;align-items:center;text-align:left;padding:21px 0;border-top:1px solid var(--line);background:transparent}
.certificate:last-child{border-bottom:1px solid var(--line)}
.certificate-date{font:.75rem/1.5 'Courier New',monospace;color:var(--muted)}
.certificate strong{font-size:1.125rem;font-weight:400}.certificate small{display:block;margin-top:7px;font-size:.8125rem;line-height:1.6;color:var(--muted)}
.certificate-arrow{font-size:1.4rem;color:var(--acid);transition:translate .2s}
.certificate:hover .certificate-arrow{translate:3px -3px}.certificate:hover strong{color:var(--acid)}
@media(max-width:1100px){
  .project[data-project=pcon-interiors] .project-image,.project[data-project=posters] .project-image{height:430px}
  .project[data-project=agd] .project-image{height:400px}
  .project[data-project=pcon-rooms] .project-image,.project[data-project=collections-ai] .project-image{height:380px}
}
@media(max-width:760px){
  .project[data-project=pcon-interiors],.project[data-project=pcon-rooms]{grid-column:span 2}
  .project[data-project=collections-ai]{grid-column:span 1}
  .project[data-project=pcon-interiors] .project-image,.project[data-project=pcon-rooms] .project-image{height:360px}
  .project[data-project=posters] .project-image,.project[data-project=agd] .project-image,.project[data-project=collections-ai] .project-image{height:280px}
  .brand-preview{gap:20px;padding:46px 13px 24px}.material-preview{padding:45px 12px 24px}
  #dialog-gallery.gallery-covers,.gallery-group.gallery-covers{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}
  #dialog-gallery.gallery-covers img,.gallery-group.gallery-covers img{height:250px}
  #dialog-gallery.gallery-documents img,.gallery-group.gallery-documents img{height:290px;padding:6px}
  .certificate{grid-template-columns:64px minmax(0,1fr) 20px;gap:10px}
}
@media(max-width:420px){
  .project[data-project=pcon-interiors],.project[data-project=pcon-rooms],.project[data-project=collections-ai]{grid-column:span 1}
  .project[data-project=pcon-interiors] .project-image,.project[data-project=pcon-rooms] .project-image,.project[data-project=posters] .project-image,.project[data-project=agd] .project-image,.project[data-project=collections-ai] .project-image{height:310px}
  #dialog-gallery.gallery-documents,.gallery-group.gallery-documents{grid-template-columns:1fr}
  #dialog-gallery.gallery-cards,.gallery-group.gallery-cards{grid-template-columns:1fr}
  #dialog-gallery.gallery-documents img,.gallery-group.gallery-documents img{height:370px}
  #dialog-gallery.gallery-covers img,.gallery-group.gallery-covers img{height:190px}
}
/* Filters keep a regular two-column gallery regardless of a project's cover size. */
@media(min-width:761px){.project-grid.is-filtered .project{grid-column:span 6}.project-grid.is-filtered .project-image{height:420px}}
@media(max-width:760px){.project-grid.is-filtered .project{grid-column:span 2}.project-grid.is-filtered .project-image{height:360px}}
@media(max-width:420px){.project-grid.is-filtered .project{grid-column:span 1}.project-grid.is-filtered .project-image{height:310px}}
