/*
Theme Name: Insp. Benone – Portfolio
Theme URI: https://bennat.net/
Author: Christian Bennat
Description: Bildorientiertes Portfolio-System für Design, Fotografie, Kunst, Architektur und Agenturen. PORTFOLIO: responsives Kachelraster, Kategorienfilter, Suche, manuelle Sortierung und unterschiedliche Kachelformate. PROJEKTE: kombinierbare Bild- und Videofolgen, Projektinformationen, mehrsprachige Beschreibungen, Links, Fokuspunkt und verschiedene Bildansichten. BEDIENUNG: Vollbildansicht, Maus, Tastatur, Touch, Wischgesten, Zoom sowie Hell-/Dunkelmodus. GESTALTUNG: neun Kopfzeilen, lokale Schriften, getrennte Typografie, Farben, Abstände und mobile Einstellungen. VERWALTUNG: Datenprüfung, Medienprüfung, Sicherung, Migration und Systemprüfung. Das Plugin „Insp. Benone – Portfolio“ ist erforderlich und muss vor dem Theme aktiviert werden.
Version: 0.9.19
Requires at least: 6.5
Requires PHP: 8.1
Text Domain: insp-benone
Tags: portfolio, photography, grid-layout, one-column, custom-colors, custom-logo, custom-menu, featured-images, theme-options
*/

:root{--ib-bg:#fff;--ib-text:#111;--ib-muted:#666;--ib-panel:rgba(0,0,0,.72);--ib-panel-text:#fff;--ib-gap-h:8px;--ib-gap-v:10px;--ib-pad:0px;--ib-cols:5;--ib-max:1600px;--ib-control-size:64px;--ib-control-icon-size:36px;--ib-control-font:Arial,sans-serif;--ib-heading:"Roboto",Arial,sans-serif;--ib-body:"Roboto",Arial,sans-serif}
*{box-sizing:border-box}html{color-scheme:light}html[data-theme=dark]{color-scheme:dark;--ib-bg:#101010;--ib-text:#f2f2f2;--ib-muted:#aaa}body{margin:0;background:var(--ib-bg);color:var(--ib-text);font:var(--ib-body-weight,400) 16px/1.5 var(--ib-body);transition:background .2s,color .2s}a{color:inherit}img{max-width:100%;height:auto}.screen-reader-text{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{position:sticky;z-index:30;top:0;display:flex;align-items:center;gap:24px;padding:16px clamp(16px,3vw,48px);background:color-mix(in srgb,var(--ib-bg) 92%,transparent);backdrop-filter:blur(10px)}.site-branding{margin-right:auto}.custom-logo{display:block;max-height:44px;width:auto}.site-title{font-family:var(--ib-heading);font-weight:var(--ib-heading-weight,700);text-decoration:none}.main-navigation ul{display:flex;gap:18px;list-style:none;margin:0;padding:0}.menu-toggle{display:none}.header-search input{width:clamp(110px,14vw,220px);border:0;border-bottom:1px solid currentColor;background:transparent;color:inherit;padding:6px}.theme-toggle{border:0;background:transparent;color:inherit;cursor:pointer;font-size:18px}
.site-main:not(.portfolio-main){max-width:1100px;margin:auto;padding:48px 24px}.entry-title,h1,h2,h3{font-family:var(--ib-heading);font-weight:var(--ib-heading-weight,700)}
.portfolio-toolbar{display:flex;align-items:center;padding:18px clamp(16px,3vw,48px)}.portfolio-filter-select{background:var(--ib-bg);color:var(--ib-text);border:1px solid color-mix(in srgb,var(--ib-text) 25%,transparent);padding:9px 12px;min-width:220px}
.portfolio-grid{display:grid;grid-template-columns:repeat(var(--ib-cols),minmax(0,1fr));column-gap:var(--ib-gap-h);row-gap:var(--ib-gap-v);max-width:var(--ib-max);margin:auto;padding:var(--ib-gap-v) var(--ib-gap-h)}.project-tile{position:relative;aspect-ratio:var(--tile-ratio,8/5);padding:var(--ib-pad);background:var(--tile-edge,var(--ib-bg));overflow:hidden;transition:opacity .3s,filter .3s}.project-tile.is-filtered{opacity:.14;filter:grayscale(1)}.project-tile.is-filtered a{pointer-events:none}.project-tile>a{position:relative;display:block;width:100%;height:100%;overflow:hidden}.project-tile img{width:100%;height:100%;object-fit:cover;object-position:var(--focus,50% 50%);transition:transform .35s}.project-tile:hover img,.project-tile:focus-within img{transform:scale(1.025)}.tile-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:18px;color:#fff;background:color-mix(in srgb,var(--hover,#111) 76%,transparent);opacity:0;transition:opacity .2s}.project-tile:hover .tile-overlay,.project-tile:focus-within .tile-overlay{opacity:1}.tile-title{font-family:var(--ib-heading);font-size:clamp(15px,1.3vw,22px);font-weight:700}.tile-categories{font-size:13px}.tile-separator{position:absolute;right:-.25em;top:50%;z-index:2;font-size:clamp(24px,3vw,52px);line-height:1;transform:translateY(-50%);pointer-events:none}
.project-viewer{position:fixed;z-index:100;inset:0;background:#000;color:#fff;display:none}.project-viewer.is-open{display:block}.viewer-stage,.viewer-slides,.viewer-slide{position:absolute;inset:0}.viewer-slide{display:none;overflow:hidden;touch-action:pan-y}.viewer-slide.is-active{display:block}.viewer-media{width:100%;height:100%;object-fit:contain;object-position:var(--focus,50% 50%);transform-origin:center;transition:transform .2s}.viewer-slide[data-mode=cover] .viewer-media{object-fit:cover}.viewer-slide[data-mode=width] .viewer-media{width:100%;height:auto;max-height:none;position:absolute;top:50%;transform:translateY(-50%)}.viewer-slide[data-mode=height] .viewer-media{width:auto;height:100%;max-width:none;position:absolute;left:50%;transform:translateX(-50%)}.viewer-slide[data-mode=auto][data-image-orientation=portrait][data-screen-orientation=landscape] .viewer-media{object-fit:contain}.viewer-slide[data-mode=auto][data-image-orientation=landscape][data-screen-orientation=portrait] .viewer-media{object-fit:contain}.viewer-slide.is-zoomed{overflow:auto;cursor:grab}.viewer-slide.is-zoomed .viewer-media{max-width:none;max-height:none}
.viewer-control{position:absolute;z-index:8;display:grid;place-items:center;border:0;background:rgba(0,0,0,.5);color:#fff;border-radius:999px;width:var(--ib-control-size);height:var(--ib-control-size);cursor:pointer;font:700 var(--ib-control-icon-size)/1 var(--ib-control-font);box-shadow:0 0 0 1px rgba(255,255,255,.28)}.viewer-close{top:18px;right:18px}.viewer-prev{left:18px;top:50%;transform:translateY(-50%)}.viewer-next{right:18px;top:50%;transform:translateY(-50%)}.viewer-info-toggle{right:24px;bottom:24px}.viewer-counter{position:absolute;z-index:7;left:24px;bottom:24px;padding:6px 10px;background:rgba(0,0,0,.45);border-radius:12px}.viewer-cover-slide{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:8vw;background:var(--ib-bg);color:var(--ib-text)}.viewer-cover-slide .cover-content{max-width:900px}.viewer-cover-slide h1{font-size:clamp(34px,7vw,96px);margin:0 0 24px}
.viewer-info{position:absolute;z-index:6;right:24px;bottom:78px;width:min(460px,calc(100vw - 48px));max-height:min(70vh,680px);overflow:auto;padding:18px 20px;border-radius:16px;background:rgb(from var(--overlay,#000) r g b/var(--overlay-opacity,.72));color:#fff;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .2s,transform .25s}.viewer-info.is-visible,.project-viewer.info-project .viewer-info,.project-viewer.info-global .viewer-info{opacity:1;transform:none;pointer-events:auto}.viewer-info h1{margin:0 0 8px;font-size:clamp(22px,3vw,42px)}.viewer-meta{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;margin:12px 0}.viewer-links{display:flex;gap:10px;flex-wrap:wrap}.viewer-links a{border-bottom:1px solid currentColor;text-decoration:none}.viewer-description{white-space:normal}.viewer-slide-title{font-family:var(--ib-heading);font-weight:700;margin-top:14px}.viewer-slide-description{margin-top:4px}
.site-footer{padding:36px clamp(16px,3vw,48px);color:var(--ib-muted)}
@media(max-width:1100px){:root{--ib-cols:min(4,var(--ib-cols))}}
@media(max-width:760px){:root{--ib-cols:2}.site-header{flex-wrap:wrap}.menu-toggle{display:block}.main-navigation{display:none;flex-basis:100%;order:5}.main-navigation.is-open{display:block}.main-navigation ul{display:block}.main-navigation li{margin:10px 0}.header-search{order:4}.viewer-prev{left:10px}.viewer-next{right:10px}.viewer-info{right:12px;bottom:82px;width:calc(100vw - 24px);max-height:65vh;transform:translateY(calc(100% + 100px));opacity:1}.viewer-info.is-visible,.project-viewer.info-project .viewer-info,.project-viewer.info-global .viewer-info{transform:translateY(0)}.viewer-info-toggle{right:12px;bottom:12px}.viewer-counter{left:12px;bottom:12px}}
/* Viewer, controls and tile motion */
.project-tile img{transition:none}.project-tile:hover img,.project-tile:focus-within img{transform:none}.tile-overlay{justify-content:flex-start;background:var(--hover,#111);opacity:0;transform:translateY(-145%);transition:opacity .32s ease-out,transform .52s cubic-bezier(.18,.72,.22,1)}.project-tile[data-enter=bottom] .tile-overlay{transform:translateY(145%)}.project-tile[data-enter=left] .tile-overlay{transform:translateX(-145%)}.project-tile[data-enter=right] .tile-overlay{transform:translateX(145%)}.project-tile:hover .tile-overlay,.project-tile:focus-within .tile-overlay{opacity:1;transform:translate(0,0)}.tile-title{font-size:var(--ib-tile-font-size);line-height:var(--ib-tile-line-height);text-transform:var(--ib-tile-transform)}
.project-viewer{background:var(--ib-bg);color:var(--ib-text)}.viewer-control{background:rgba(255,255,255,.9);color:#777;box-shadow:none;font-weight:400}.viewer-control:hover,.viewer-control:focus-visible{color:#000;background:#fff}html[data-theme=dark] .viewer-control{background:rgba(0,0,0,.9);color:#aaa}html[data-theme=dark] .viewer-control:hover,html[data-theme=dark] .viewer-control:focus-visible{color:#fff;background:#000}.viewer-counter{background:color-mix(in srgb,var(--ib-bg) 88%,transparent);color:var(--ib-text)}.viewer-info h1,.viewer-cover-slide h1{text-transform:var(--ib-info-transform)}
.viewer-slide[data-zoom-mode=contain] .viewer-media{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;transform:none!important}.viewer-slide[data-zoom-mode=cover] .viewer-media{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:cover!important;transform:none!important}.viewer-slide[data-zoom-mode=native] .viewer-media{position:absolute!important;left:50%!important;top:50%!important;width:auto!important;height:auto!important;max-width:none!important;max-height:none!important;object-fit:none!important;transform:translate(-50%,-50%)!important}.viewer-slide[data-zoom-mode=200] .viewer-media{position:static!important;object-fit:contain!important;max-width:none!important;max-height:none!important}.viewer-cover-thumbs{display:flex;flex-wrap:wrap;gap:var(--ib-cover-thumb-gap);margin-top:28px}.viewer-cover-thumb{width:120px;aspect-ratio:var(--ib-cover-thumb-ratio);padding:0;border:0;background:transparent;cursor:pointer;overflow:hidden}.viewer-cover-thumb img{width:100%;height:100%;object-fit:cover}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media print{.site-header,.site-footer,.portfolio-toolbar,.viewer-control,.viewer-counter{display:none!important}.project-viewer{position:static;display:block!important;background:#fff;color:#000}.viewer-slide{position:static;display:block!important;page-break-after:always;height:auto}.viewer-media{position:static!important;display:block;max-width:100%;height:auto!important;transform:none!important}.viewer-info{position:static;width:auto;max-height:none;overflow:visible;opacity:1;transform:none;background:none!important;color:#000}.portfolio-grid{display:none}}
.viewer-control[hidden]{display:none!important}.skip-link:focus{position:fixed;z-index:9999;left:12px;top:12px;width:auto;height:auto;margin:0;padding:10px 14px;clip:auto;background:#fff;color:#111}
.tile-separator{display:none!important}
.viewer-info{bottom:calc(24px + var(--ib-control-size) + 14px)}.viewer-info-toggle{background-image:url("assets/icons/info.svg");background-position:center;background-repeat:no-repeat;background-size:min(42%,var(--ib-control-icon-size))}.viewer-info-toggle[hidden],.viewer-info[hidden]{display:none!important}