/* OHMOXXIE STUDIO · PHYSICAL & MERCH V2.5.1 */

.physical-page { background: var(--bg); }

.physical-hero {
    min-height: calc(100vh - 77px);
    padding-top: clamp(28px, 3vw, 48px);
    padding-bottom: clamp(24px, 2vw, 38px);
    display: grid;
    grid-template-columns: minmax(34px, 58px) minmax(0, .92fr) minmax(420px, 1.08fr);
    gap: clamp(20px, 3vw, 52px);
    border-bottom: 1px solid var(--line);
}
.physical-hero__number { padding-top: 8px; font-size: 10px; font-weight: 700; letter-spacing: .14em; }
.physical-hero__copy { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; }
.physical-hero__copy h1 {
    margin: clamp(52px, 6vw, 92px) 0 28px;
    width: 100%;
    max-width: 100%;
    font-size: clamp(58px, 6.55vw, 114px);
    line-height: .86;
    letter-spacing: -.066em;
    font-weight: 650;
    text-wrap: balance;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: none;
    -webkit-hyphens: none;
}
.physical-hero__copy h1.physical-title--medium { font-size: clamp(50px, 5.25vw, 88px); }
.physical-hero__copy h1.physical-title--long { font-size: clamp(45px, 4.55vw, 76px); }
.physical-hero__copy h1.physical-title--xlong { font-size: clamp(40px, 3.95vw, 66px); }
.physical-hero__lead { max-width: 680px; margin: 0; color: #36342f; font-size: clamp(17px, 1.35vw, 23px); line-height: 1.48; }
.physical-hero__cta { margin-top: 40px; }
.physical-hero__tags { margin-top: auto; padding-top: 70px; padding-bottom: 4px; display: flex; flex-wrap: wrap; gap: 10px 18px; color: var(--muted); font-size: 8px; font-weight: 700; letter-spacing: .13em; }
.physical-hero__tags span:not(:last-child)::after { content: " /"; margin-left: 18px; color: var(--line-strong); }
.physical-hero__visual { min-width: 0; display: flex; }

.material-board {
    width: 100%;
    min-height: min(760px, 76vh);
    display: grid;
    grid-template-rows: 42px 1fr 42px;
    background: #d8d4ca;
    border: 1px solid #b8b4ab;
    overflow: hidden;
}
.material-board__bar, .material-board__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 0 14px;
    background: #161614;
    color: #9c9a92;
    font-size: 6px;
    letter-spacing: .15em;
    text-transform: uppercase;
}
.material-board__footer { background: #e1ded5; color: #66635c; border-top: 1px solid #b8b4ab; }
.material-board__project { position: relative; margin: 0; min-height: 0; overflow: hidden; background: #c9c5bb; }
.material-board__project img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.72) contrast(1.01); }
.material-board__project::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(10,10,9,.65), transparent 42%); pointer-events: none; }
.material-board__project figcaption { position: absolute; z-index: 2; left: 0; right: 0; bottom: 0; padding: 14px; display: flex; justify-content: space-between; gap: 20px; color: #f3f1ea; font-size: 7px; letter-spacing: .13em; }

.material-board__concept { position: relative; min-height: 0; overflow: hidden; background: #dedbd2; isolation: isolate; }
.material-grid { position: absolute; inset: 0; background-image: linear-gradient(rgba(78,76,69,.15) 1px, transparent 1px), linear-gradient(90deg, rgba(78,76,69,.15) 1px, transparent 1px); background-size: 42px 42px; }
.material-object { position: absolute; z-index: 2; border: 1px solid #56534c; background: #eeece6; box-shadow: 0 18px 40px rgba(49,46,40,.08); display: flex; flex-direction: column; justify-content: space-between; padding: 12px; }
.material-object span { color: #6e6a62; font-size: 7px; letter-spacing: .15em; }
.material-object strong { font-size: 10px; font-weight: 600; }
.material-object--box { left: 10%; top: 16%; width: 34%; height: 31%; transform: rotate(-4deg); background: #ebe4d5; }
.material-object--box::after { content: "OHMOXXIE / OBJECT"; position: absolute; left: 18px; top: 48%; font-size: clamp(13px, 1.25vw, 20px); font-weight: 600; letter-spacing: -.04em; }
.material-object--disc { right: 9%; top: 10%; width: clamp(110px, 15vw, 190px); aspect-ratio: 1; border-radius: 50%; background: #b5b1a8; transform: rotate(7deg); }
.material-object--disc::after { content: "FDM"; position: absolute; inset: 0; display: grid; place-items: center; font-size: clamp(22px, 3vw, 44px); letter-spacing: -.06em; }
.material-object--card { left: 18%; bottom: 12%; width: 31%; height: 24%; background: #232321; color: #f0eee8; transform: rotate(3deg); }
.material-object--card span { color: #aaa79f; }
.material-object--card::after { content: "TEXTILE / TRANSFER"; position: absolute; left: 12px; bottom: 40%; font-size: clamp(8px, .85vw, 12px); letter-spacing: .09em; }
.material-object--stand { right: 12%; bottom: 12%; width: 28%; height: 35%; background: #d2cec4; transform: rotate(-2deg); clip-path: polygon(0 0, 100% 9%, 100% 100%, 0 92%); }
.material-object--stand::after { content: "DISPLAY"; position: absolute; left: 14px; bottom: 42%; font-size: clamp(14px, 1.45vw, 22px); letter-spacing: -.04em; font-weight: 600; }
.material-note { position: absolute; z-index: 3; padding: 6px 8px; background: #dedbd2; color: #6d6961; font-size: 6px; letter-spacing: .14em; }
.material-note--a { left: 7%; top: 55%; }
.material-note--b { right: 5%; top: 54%; }
.measure { position: absolute; z-index: 3; color: #77736a; font-size: 6px; letter-spacing: .13em; }
.measure--x { left: 10%; right: 10%; bottom: 7%; border-top: 1px solid #8f8b82; padding-top: 5px; text-align: center; }
.measure--y { top: 12%; bottom: 12%; right: 3%; border-left: 1px solid #8f8b82; writing-mode: vertical-rl; padding-left: 5px; text-align: center; }

.physical-trust { border-bottom: 1px solid var(--line); background: var(--bg-clean); }
.physical-trust__grid { display: grid; grid-template-columns: repeat(3, 1fr); }
.physical-trust__grid > div { min-height: 118px; padding: 24px clamp(18px, 2.4vw, 38px); border-left: 1px solid var(--line); display: grid; grid-template-columns: 38px 1fr; gap: 14px; align-items: center; }
.physical-trust__grid > div:last-child { border-right: 1px solid var(--line); }
.physical-trust span { color: var(--muted); font-size: 8px; letter-spacing: .14em; }
.physical-trust strong { max-width: 300px; font-size: clamp(11px, .95vw, 14px); line-height: 1.35; letter-spacing: .04em; font-weight: 600; }

.physical-section-head h2 strong { font-weight: 350; color: var(--muted); }
.physical-categories { border-top: 0; }
.physical-category-list { border-top: 1px solid var(--line); }
.physical-category { display: grid; grid-template-columns: minmax(34px, 60px) 54px minmax(260px, .78fr) minmax(300px, 1fr); gap: clamp(18px, 3vw, 54px); align-items: center; padding: clamp(34px, 4.4vw, 72px) var(--gutter); border-bottom: 1px solid var(--line); transition: background .25s ease; }
.physical-category:hover { background: var(--bg-clean); }
.physical-category__number { color: var(--muted); font-size: 9px; letter-spacing: .12em; }
.physical-category__icon { font-size: clamp(21px, 2.2vw, 34px); line-height: 1; filter: grayscale(1); }
.physical-category h3 { margin: 0; min-width: 0; font-size: clamp(34px, 4.1vw, 72px); line-height: .9; letter-spacing: -.055em; font-weight: 600; word-break: normal; overflow-wrap: normal; hyphens: none; -webkit-hyphens: none; }
.physical-category p { margin: 0; max-width: 680px; color: var(--muted); font-size: clamp(14px, 1.2vw, 19px); line-height: 1.55; }
.physical-empty { padding-top: 50px; padding-bottom: 50px; }
.physical-empty span { font-size: 8px; letter-spacing: .16em; color: var(--muted); }
.physical-empty p { margin: 10px 0 0; }

.physical-process { background: #ddd8ce; border-bottom: 1px solid #bbb6ac; }
.physical-process__grid { min-height: 700px; padding-top: clamp(84px, 10vw, 165px); padding-bottom: clamp(84px, 10vw, 165px); display: grid; grid-template-columns: minmax(36px, 72px) minmax(0, 1.06fr) minmax(320px, .94fr); gap: clamp(24px, 4vw, 72px); }
.physical-process__index { padding-top: 8px; font-size: 10px; letter-spacing: .16em; }
.physical-process__statement { min-width: 0; }
.physical-process__statement h2 { margin: 25px 0 0; max-width: 100%; font-size: clamp(48px, 5.7vw, 100px); line-height: .88; letter-spacing: -.064em; font-weight: 600; text-wrap: balance; word-break: normal; overflow-wrap: normal; hyphens: none; -webkit-hyphens: none; }
.physical-process__copy { align-self: end; min-width: 0; }
.physical-process__copy > p { max-width: 640px; margin: 0 0 58px; font-size: clamp(17px, 1.45vw, 23px); line-height: 1.55; }
.physical-flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid #aaa59b; border-left: 1px solid #aaa59b; }
.physical-flow li { min-height: 74px; padding: 12px; border-right: 1px solid #aaa59b; border-bottom: 1px solid #aaa59b; display: flex; flex-direction: column; justify-content: space-between; }
.physical-flow span { color: #77736c; font-size: 8px; letter-spacing: .14em; }
.physical-flow strong { font-size: 10px; letter-spacing: .12em; font-weight: 600; }

.physical-work { background: var(--bg-clean); }
.physical-work__grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(24px, 3.6vw, 58px); }
.physical-work__item { grid-column: span 6; margin-bottom: clamp(30px, 5vw, 82px); }
.physical-work__item:nth-child(3n + 2) { grid-column: 8 / span 5; margin-top: clamp(70px, 8vw, 130px); }
.physical-work__item:nth-child(3n) { grid-column: 2 / span 6; }
.physical-work__item figure { margin: 0; aspect-ratio: 4 / 3; overflow: hidden; background: var(--surface); border: 1px solid var(--line); }
.physical-work__item img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.7); transition: transform .8s var(--ease), filter .4s ease; }
.physical-work__item:hover img { transform: scale(1.018); filter: saturate(.96); }
.physical-work__placeholder { height: 100%; display: grid; place-items: center; color: var(--muted); font-size: 9px; letter-spacing: .15em; }
.physical-work__meta { margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line); display: grid; grid-template-columns: 34px 1fr; gap: 12px; }
.physical-work__meta > span, .physical-work__meta p { color: var(--muted); font-size: 8px; letter-spacing: .12em; text-transform: uppercase; }
.physical-work__meta h3 { margin: 0; font-size: 16px; letter-spacing: -.025em; font-weight: 600; }
.physical-work__meta p { margin: 4px 0 0; }

.physical-layers { background: #171715; color: var(--ink-inverse); border-bottom: 1px solid #34342f; }
.physical-layers__grid { min-height: 670px; padding-top: clamp(84px, 10vw, 160px); padding-bottom: clamp(84px, 10vw, 160px); display: grid; grid-template-columns: minmax(36px, 72px) minmax(0, 1fr) minmax(380px, 1fr); gap: clamp(24px, 4vw, 72px); }
.physical-layers__index { padding-top: 8px; color: #8e8c84; font-size: 10px; letter-spacing: .16em; }
.physical-layers .section-kicker { color: #8e8c84; }
.physical-layers__statement h2 { margin: 25px 0 0; font-size: clamp(48px, 5.5vw, 96px); line-height: .88; letter-spacing: -.064em; font-weight: 600; }
.physical-layers__matrix { align-self: end; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid #3c3c37; border-left: 1px solid #3c3c37; }
.physical-layers__matrix > div { min-height: 120px; padding: 15px; border-right: 1px solid #3c3c37; border-bottom: 1px solid #3c3c37; display: flex; flex-direction: column; }
.physical-layers__matrix span { color: #77756e; font-size: 7px; letter-spacing: .13em; }
.physical-layers__matrix strong { margin-top: auto; font-size: 12px; letter-spacing: .1em; font-weight: 600; }
.physical-layers__matrix small { margin-top: 5px; color: #8f8d85; font-size: 8px; line-height: 1.35; }

.physical-contact { border-bottom: 0; }

@media (max-width: 1320px) {
    .physical-hero { grid-template-columns: minmax(34px, 48px) minmax(0, 1.08fr) minmax(380px, .92fr); }
    .physical-hero__copy h1 { font-size: clamp(50px, 4.8vw, 74px); }
    .physical-hero__copy h1.physical-title--medium { font-size: clamp(45px, 4.15vw, 64px); }
    .physical-hero__copy h1.physical-title--long { font-size: clamp(41px, 3.7vw, 57px); }
    .physical-hero__copy h1.physical-title--xlong { font-size: clamp(37px, 3.3vw, 50px); }
}

@media (max-width: 1120px) {
    .physical-hero { grid-template-columns: 42px minmax(0, 1fr); min-height: auto; }
    .physical-hero__number { grid-column: 1; grid-row: 1; }
    .physical-hero__copy { grid-column: 2; grid-row: 1; }
    .physical-hero__visual { grid-column: 2; grid-row: 2; margin-top: 12px; }
    .physical-hero__copy h1,
    .physical-hero__copy h1.physical-title--medium,
    .physical-hero__copy h1.physical-title--long,
    .physical-hero__copy h1.physical-title--xlong { max-width: 100%; font-size: clamp(48px, 7.5vw, 82px); line-height: .89; }
    .physical-hero__lead { max-width: 760px; }
    .physical-hero__tags { padding-top: 58px; margin-bottom: 24px; }
    .material-board { min-height: 660px; max-width: 920px; }

    .physical-category { grid-template-columns: 40px 48px 1fr; }
    .physical-category p { grid-column: 3; margin-top: 8px; }

    .physical-process__grid, .physical-layers__grid { grid-template-columns: 42px 1fr; }
    .physical-process__copy, .physical-layers__matrix { grid-column: 2; margin-top: 20px; }
    .physical-process__statement h2, .physical-layers__statement h2 { max-width: 12ch; }
}

@media (max-width: 760px) {
    .physical-hero { display: block; padding-top: 34px; }
    .physical-hero__number { margin-bottom: 50px; }
    .physical-hero__copy h1,
    .physical-hero__copy h1.physical-title--medium,
    .physical-hero__copy h1.physical-title--long,
    .physical-hero__copy h1.physical-title--xlong { max-width: 100%; font-size: clamp(42px, 12vw, 72px); line-height: .91; letter-spacing: -.055em; word-break: normal; overflow-wrap: normal; hyphens: none; -webkit-hyphens: none; }
    .physical-hero__lead { font-size: 16px; }
    .physical-hero__tags { padding-top: 48px; gap: 10px 14px; }
    .physical-hero__tags span:not(:last-child)::after { display: none; }
    .physical-hero__visual { margin-top: 38px; }
    .material-board { min-height: 590px; }
    .material-object--box { left: 7%; width: 46%; }
    .material-object--disc { right: 7%; width: 120px; }
    .material-object--card { left: 10%; width: 42%; }
    .material-object--stand { right: 7%; width: 35%; }
    .material-note { display: none; }

    .physical-trust__grid { grid-template-columns: 1fr; }
    .physical-trust__grid > div { min-height: 82px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
    .physical-trust__grid > div:last-child { border-bottom: 0; }

    .physical-category { grid-template-columns: 28px 40px 1fr; gap: 12px; padding-block: 34px; }
    .physical-category h3 { font-size: clamp(28px, 8.8vw, 44px); word-break: normal; overflow-wrap: normal; hyphens: none; -webkit-hyphens: none; }
    .physical-category p { grid-column: 3; font-size: 13px; }

    .physical-process__grid, .physical-layers__grid { display: block; }
    .physical-process__index, .physical-layers__index { margin-bottom: 48px; display: block; }
    .physical-process__statement h2, .physical-layers__statement h2 { max-width: 100%; font-size: clamp(42px, 12vw, 68px); word-break: normal; overflow-wrap: normal; hyphens: none; -webkit-hyphens: none; }
    .physical-process__copy, .physical-layers__matrix { margin-top: 58px; }

    .physical-work__grid { grid-template-columns: 1fr; }
    .physical-work__item, .physical-work__item:nth-child(n) { grid-column: 1; margin-top: 0; }
}

@media (max-width: 430px) {
    .physical-hero__copy h1,
    .physical-hero__copy h1.physical-title--medium,
    .physical-hero__copy h1.physical-title--long,
    .physical-hero__copy h1.physical-title--xlong { font-size: clamp(39px, 11.8vw, 54px); }
    .material-board { min-height: 535px; }
    .material-object--box { top: 12%; height: 29%; }
    .material-object--disc { width: 96px; }
    .material-object--card { bottom: 13%; height: 22%; }
    .material-object--stand { bottom: 11%; height: 31%; }
    .physical-category { grid-template-columns: 24px 1fr; }
    .physical-category__icon { display: none; }
    .physical-category h3, .physical-category p { grid-column: 2; }
    .physical-flow { grid-template-columns: 1fr; }
    .physical-layers__matrix { grid-template-columns: 1fr; }
}

/* V2.24 · responsive media */
.material-board__project picture,
.physical-work__item figure picture { display:block; width:100%; height:100%; }
.material-board__project picture img,
.physical-work__item figure picture img { width:100%; height:100%; object-fit:cover; }

/* V2.25 · Section media, optional and CMS-controlled */
.physical-section-media{margin:0 0 24px;aspect-ratio:16/9;overflow:hidden;background:#d6d1c7;border:1px solid #aaa59b}
.physical-section-media picture,.physical-section-media img{display:block;width:100%;height:100%}
.physical-section-media img{object-fit:cover}
.physical-layers__content{align-self:end}
@media(min-width:901px){.physical-layers__content{grid-column:3}.physical-layers__content .physical-layers__matrix{margin-top:0}}
@media(max-width:900px){.physical-layers__content{grid-column:2;margin-top:20px}}
@media(max-width:760px){.physical-layers__content{grid-column:auto;margin-top:58px}.physical-section-media{margin-bottom:20px}}
