/*
Theme Name: Greta Portfolio
Author: Greta Portfolio
Description: Minimal editorial portfolio with horizontal desktop project navigation and vertical mobile feed.
Version: 0.2.0
Requires PHP: 7.4
Text Domain: greta-portfolio
*/
:root{--bg:#f3f2ed;--ink:#171717;--muted:#7e7d78;--line:#d9d7d0;--gutter:clamp(24px,3vw,52px);--sidebar:clamp(300px,28vw,420px)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Inter",Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
a:focus-visible,button:focus-visible{outline:2px solid #222;outline-offset:4px}
.site-header{position:relative;z-index:5;display:flex;justify-content:space-between;align-items:flex-start;padding:22px var(--gutter) 12px;gap:20px}
.site-header-left{min-width:1px}
.site-header-right{margin-left:auto;display:flex;align-items:center;gap:28px}
.site-brand{font-size:12px;letter-spacing:.01em;white-space:nowrap}
.site-header-action,.view-link,.back-link{font-size:12px;line-height:1.2;border-bottom:1px solid currentColor;padding-bottom:4px;display:inline-flex;align-items:center;gap:4px}
.work-shell{display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);height:calc(100svh - 104px);min-height:560px}
.work-info{padding:clamp(26px,4.6vh,56px) 32px 26px var(--gutter);display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}
.work-info .eyebrow,.project-caption .eyebrow,.project-meta,.meta-grid dt{font-size:11px;color:var(--muted);letter-spacing:.01em}
.work-info h1{font-size:clamp(34px,3.3vw,58px);line-height:.98;font-weight:500;letter-spacing:-.055em;margin:22px 0 22px;overflow-wrap:anywhere}
.work-info p{font-size:14px;line-height:1.55;max-width:31ch;margin:0 0 28px}
.meta-divider{border:0;border-top:1px solid var(--line);width:min(100%,440px);margin:0 0 18px}
.meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px 26px;font-size:12px;margin:0 0 28px;width:min(100%,440px)}
.meta-grid div{display:grid;gap:6px}
.meta-grid dd{margin:0}
.work-gallery{overflow:hidden;display:flex;align-items:stretch;min-width:0;border-left:1px solid var(--line)}
.work-track{display:flex;align-items:stretch;gap:clamp(22px,2.4vw,34px);height:100%;will-change:transform;transition:transform .82s cubic-bezier(.22,1,.36,1);padding-left:0;padding-right:8vw}
.work-card{flex:0 0 min(68vw,1040px);height:100%;display:flex;flex-direction:column;justify-content:center;min-width:0;opacity:.58;transform:scale(.984);transition:opacity .55s ease,transform .82s cubic-bezier(.22,1,.36,1)}
.work-card.is-active{opacity:1;transform:scale(1)}
.work-card a{display:block;min-height:0;height:100%}
.work-card img,.placeholder-image{width:100%;height:100%;max-height:calc(100svh - 156px);object-fit:contain;display:block}
.placeholder-image{display:flex;align-items:center;justify-content:center;font-size:clamp(22px,4vw,70px);font-weight:600;letter-spacing:-.06em;padding:20px;text-align:center}
.work-card:nth-child(4n+1) .placeholder-image{background:#c9d8d0}.work-card:nth-child(4n+2) .placeholder-image{background:#e6c0b9}.work-card:nth-child(4n+3) .placeholder-image{background:#c5d1e3}.work-card:nth-child(4n) .placeholder-image{background:#ddd5c7}
.project-caption{display:none}
.work-footer{height:44px;padding:0 var(--gutter);display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted)}
.work-controls{display:flex;align-items:center;gap:12px}.work-controls button{background:transparent;border:1px solid var(--line);color:var(--ink);border-radius:50%;width:34px;height:34px;cursor:pointer;font-size:18px}.work-controls button:disabled{opacity:.3;cursor:default}.work-progress{font-variant-numeric:tabular-nums}
.content-wrap{max-width:1240px;margin:0 auto;padding:70px var(--gutter) 110px}
.project-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:60px}.project-heading h1{font-size:clamp(45px,7vw,110px);font-weight:500;letter-spacing:-.065em;line-height:.95;margin:12px 0}.project-body{font-size:16px;line-height:1.65}.project-body img{max-width:100%;height:auto}.project-body .wp-block-image,.project-body .wp-block-gallery{margin:0 0 24px}
.contact-page h1{font-size:clamp(52px,10vw,150px);font-weight:500;letter-spacing:-.07em;line-height:1;margin:0 0 35px}.contact-page a{border-bottom:1px solid}.empty-state{padding:50px var(--gutter)}
@media(max-width:980px){.site-header{padding-bottom:16px}.site-header-right{gap:18px}.work-shell{grid-template-columns:minmax(270px,38vw) minmax(0,1fr)}.work-info h1{font-size:clamp(30px,3vw,46px)}.work-card{flex-basis:min(72vw,860px)}}
@media(max-width:800px){.site-header{padding:18px var(--gutter)}.site-header-right{width:100%;justify-content:space-between}.site-brand{font-size:12px}.work-shell{height:auto;min-height:0;display:block}.work-info,.work-footer{display:none}.work-gallery{display:block;overflow:visible;border-left:0}.work-track{display:block;transform:none!important;padding:0 var(--gutter);height:auto}.work-card{height:auto;display:block;margin-bottom:45px;opacity:1;transform:none}.work-card img,.placeholder-image{height:auto;aspect-ratio:4/5;object-fit:contain;max-height:none}.project-caption{display:block;margin-top:12px}.project-caption h2{font-size:24px;font-weight:500;letter-spacing:-.04em;margin:6px 0}.project-heading{display:block;margin-bottom:35px}.content-wrap{padding-top:50px}.project-body .wp-block-image{margin-bottom:16px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.work-track,.work-card{transition:none}}
