/*
Theme Name: TwórKa — papierowe portfolio
Template: tworka
Version: 1.2.3
Requires at least: 6.6
Requires PHP: 8.1
Description: Motyw potomny: autorskie SVG Portfolio i subtelna animacja papieru.
Text Domain: tworka-paper
*/
@import url('../tworka/assets/fonts-1.0.3.css');
:root{--cream:#fffdea;--orange:#f06231;--yellow:#ffe479;--ink:#1c1b18;--muted:#727163;--line:#d7d4ba;--side:360px;--gap:40px;--radius:6px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:30px}
body{margin:0;background:var(--cream);color:var(--ink);font:16px/1.35 'Be Vietnam Pro',sans-serif}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button,a{touch-action:manipulation}
button{color:inherit;cursor:pointer}
img{max-width:100%;height:auto;display:block}
figure{margin:0}
h1,h2,h3,h4,p{margin:0}
h1,h2,h3,h4{font-family:'Bricolage Grotesque',sans-serif;line-height:1.08;font-weight:600}
h1{font-size:60px}
h2{font-size:40px}
h3{font-size:28px}
:focus-visible{outline:3px solid var(--ink);outline-offset:5px}
::selection{background:var(--yellow)}
.skip-link{position:fixed;left:10px;top:-100px;background:var(--yellow);padding:14px;z-index:100}
.skip-link:focus{top:10px}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.site-shell{max-width:1920px;margin:auto;padding:20px 40px 0 20px;display:grid;grid-template-columns:var(--side) minmax(0,1fr);gap:var(--gap)}
.site-main{min-width:0}
.sidebar{position:sticky;top:20px;height:calc(100dvh - 40px);background:var(--orange);border-radius:var(--radius);padding:20px;display:flex;flex-direction:column;z-index:30;overflow:auto}
.brand{display:block;width:66px;margin:0 auto 10px}
.brand img{width:66px;height:40px;object-fit:contain}
.menu-toggle{display:none}
.nav-list{display:flex;flex-direction:column;gap:8px;list-style:none;margin:0;padding:0}
.nav-list li{min-width:0}
.nav-list a{display:block;background:var(--yellow);border:1px solid #eed56f;border-radius:7px;padding:8px 16px;overflow:hidden}
.nav-top{display:flex;justify-content:space-between;gap:12px;align-items:center;font-family:'Bricolage Grotesque',sans-serif;font-size:22px;font-weight:600}
.nav-preview{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s ease,opacity .3s;opacity:0}
.nav-preview>div{overflow:hidden;min-height:0}
.nav-preview p{padding-top:20px}
.nav-preview img{width:90px;height:75px;object-fit:cover;border-radius:4px;margin:14px auto}
.nav-list a:hover .nav-preview,.nav-list a:focus-visible .nav-preview{grid-template-rows:1fr;opacity:1}
.sidebar-bottom{margin-top:auto;padding-top:30px}
.call-button{display:inline-flex;background:var(--ink);color:var(--cream);border:0;border-radius:4px;padding:9px 14px;font-size:14px}
.sidebar-info{background:var(--cream);border:1px dashed var(--line);border-radius:4px;padding:12px;margin-top:12px}
.socials{display:flex;gap:14px;align-items:center;margin-top:10px}
.socials a{min-width:32px;min-height:32px;display:inline-flex;align-items:center;justify-content:center}
.socials svg{width:21px;height:21px}
.menu-overlay{display:none}
.status-bar{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:25px}
.availability{display:flex;align-items:center;gap:8px}
.availability:before{content:'';width:10px;height:10px;background:#67b935;box-shadow:0 0 0 6px #67b9350c;border-radius:50%;flex-shrink:0}
.since{display:flex;gap:12px;align-items:center}
.since span{background:#fff5d4;padding:1px 5px}
.button{border:1px solid #efd578;background:var(--yellow);border-radius:5px;padding:24px 35px;display:inline-flex;align-items:center;justify-content:center;gap:10px;position:relative;transition:background .2s,transform .2s;min-height:48px}
.button:hover{background:var(--orange);transform:translateY(-2px)}
.home-projects{padding-bottom:100px}
.featured-project{display:block;position:relative}
.featured-project img{width:100%;aspect-ratio:1.65;object-fit:cover;border-radius:5px}
.featured-label{position:absolute;top:20px;left:20px;background:var(--yellow);padding:3px 8px;z-index:1}
.featured-meta{display:flex;justify-content:space-between;gap:20px;padding:20px 0 28px}
.featured-meta h2{font-size:36px;max-width:650px}
.project-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto;gap:20px;align-items:center;padding:23px 0;border-top:1px solid var(--line);position:relative}
.project-row:last-child{border-bottom:1px solid var(--line)}
.project-row h3{font-size:24px}
.row-preview{position:absolute;right:18%;top:50%;width:180px;height:130px;object-fit:cover;border-radius:5px;transform:translateY(-50%) rotate(-5deg) scale(.85);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;z-index:2}
.project-row:hover .row-preview,.project-row:focus-visible .row-preview{opacity:1;transform:translateY(-50%) rotate(-5deg) scale(1)}
.all-projects{display:flex;align-items:center;justify-content:center;gap:30px;padding:65px 0 0;font:600 65px/1 'Bricolage Grotesque',sans-serif}
.all-projects .button{font:16px/1.3 'Be Vietnam Pro',sans-serif;min-width:160px}
.about-section{padding:50px 0 100px}
.about-statement{font-size:clamp(40px,5vw,80px);max-width:1050px;margin:0 0 60px}
.about-grid{display:grid;grid-template-columns:300px minmax(0,1fr);gap:60px}
.portrait{aspect-ratio:4/5;width:100%;object-fit:cover;border-radius:5px;margin-top:35px}
.about-heading h3{font-size:28px}
.about-heading p{margin-top:10px}
.about-copy{font-size:18px;line-height:1.5}
.about-copy p{margin-bottom:24px}
.about-copy h2,.about-copy h3,.about-copy h4{font-size:25px;margin:20px 0}
.about-copy>h2:first-child{display:none}
.services-section{padding:30px 0 90px}
.section-title{font-size:80px;margin-bottom:40px}
.service-row{display:flex;align-items:center;justify-content:space-between;gap:25px;border-top:1px solid var(--line);padding:35px 0}
.service-row h3{font-size:38px}
.service-row p{margin-top:14px}
.service-images{display:flex;flex-shrink:0}
.service-images img{width:85px;height:85px;object-fit:cover;border:4px solid var(--cream);border-radius:4px;transform:rotate(-10deg);margin-left:-15px;transition:transform .3s}
.service-images img:nth-child(2){transform:rotate(8deg)}
.service-row:hover img{transform:rotate(0);margin-left:0}
.service-other{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding-top:35px}
.contact-section{position:relative;text-align:center;padding:100px 20px 170px;overflow:hidden}
.contact-section h2{font-size:clamp(28px,4.8vw,70px);position:relative;z-index:1;overflow-wrap:anywhere}
.contact-section .contact-drawing{position:absolute;bottom:0;left:10%;width:80%;max-height:200px;object-fit:contain}
.site-footer{padding:50px 0 20px;border-top:1px solid var(--line)}
.footer-top{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.footer-title{font-size:64px;max-width:570px;margin-bottom:30px}
.footer-contact{padding-top:12px;display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.footer-contact>a{min-height:24px}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;border-top:1px solid var(--line);margin-top:50px;padding-top:20px;font-size:14px}
.page-header{padding:60px 0 45px;text-align:center}
.page-header h1{max-width:900px;margin:auto}
.project-meta{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;max-width:710px;margin:45px auto 0}
.project-meta div{border:1px dashed var(--line);border-radius:5px;padding:12px 15px;min-width:0}
.project-meta dt{font-weight:500;margin-bottom:12px}
.project-meta dd{margin:0;color:var(--muted);overflow-wrap:anywhere}
.project-cover{width:100%;border-radius:5px;aspect-ratio:4/3;object-fit:cover}
.project-body{padding:45px 0 70px;font-size:18px;line-height:1.55}
.project-body h2{font-size:28px;margin:48px 0 24px}
.project-body h2:first-child{margin-top:0}
.project-body p{margin:0 0 22px;color:#666557}
.project-body p:empty{display:none}
.project-body ul,.project-body ol{padding-left:24px;margin-bottom:25px}
.project-body li{margin-bottom:12px}
.project-body a{text-decoration:underline;text-underline-offset:4px}
.project-body img{border-radius:4px}
.project-body .wp-block-gallery{display:grid!important;grid-template-columns:1fr 1fr;gap:20px!important;margin-top:24px}
.project-body .wp-block-gallery figure{width:100%!important;margin:0!important;flex:none!important;align-self:start}
.project-body .wp-block-gallery img{width:100%!important;height:auto!important;object-fit:contain!important}
.project-body .wp-block-image{margin:25px 0}
.project-body .wp-block-gallery .wp-block-image{margin:0}
.project-body figure figcaption{font-size:14px;margin-top:8px}
.related{padding-bottom:70px}
.related h2{margin-bottom:30px}
.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 20px}
.project-card{display:block;min-width:0}
.project-card .image-wrap{overflow:hidden;border-radius:5px}
.project-card img{width:100%;aspect-ratio:1.6;object-fit:cover;transition:transform .45s}
.project-card:hover img,.project-card:focus-visible img{transform:scale(1.035)}
.card-meta{display:flex;justify-content:space-between;gap:12px;margin:18px 0 12px;color:#666557;font-size:14px}
.card-meta span:first-child{max-width:80%}
.project-card h2,.project-card h3{font-size:27px}
.archive-content{padding-bottom:90px}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:35px}
.filter{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:30px;padding:10px 16px;min-height:44px;background:transparent}
.filter[aria-current],.filter:hover{background:var(--yellow);border-color:var(--yellow)}
.tag-list{display:flex;gap:8px;flex-wrap:wrap;margin:25px 0}
.tag-list a{text-decoration:underline;text-underline-offset:4px}
.pagination{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:45px}
.pagination a,.pagination span{min-width:44px;padding:12px;text-align:center;border:1px solid var(--line);border-radius:4px}
.pagination .current{background:var(--yellow)}
.breadcrumb{font-size:14px;display:flex;gap:10px;flex-wrap:wrap;margin:24px 0}
.breadcrumb a{text-decoration:underline}
.empty-state{padding:60px 0;text-align:center}
.cookie-panel{position:fixed;bottom:20px;right:20px;max-width:430px;background:var(--cream);border:1px solid var(--ink);padding:24px;z-index:60;border-radius:6px;box-shadow:0 10px 40px #0002}
.cookie-panel h2{font-size:25px;margin-bottom:10px}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.cookie-actions button{padding:12px 18px;flex:1}
.cookie-panel[hidden]{display:none}
.cookie-settings{border:0;background:none;padding:0;text-decoration:underline;font-size:14px}
@media(max-width:1279px){:root{--side:240px;--gap:40px}
.site-shell{padding-right:20px}
.nav-top{font-size:20px}
.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
h1{font-size:48px}
.about-grid{grid-template-columns:220px 1fr;gap:30px}
.footer-title{font-size:48px}
.service-row h3{font-size:30px}
.service-images img{width:60px;height:60px}
.all-projects{font-size:48px}}
@media(max-width:809px){html{scroll-padding-top:85px}
:root{--side:0px;--gap:0px}
.site-shell{display:block;padding:75px 10px 0}
.sidebar{position:fixed;inset:10px 10px auto;height:auto;max-height:calc(100dvh - 20px);padding:10px;border-radius:5px;overflow:auto}
.sidebar-top{display:flex;justify-content:space-between;align-items:center;min-height:30px}
.brand{margin:0;width:46px}
.brand img{width:46px;height:30px}
.menu-toggle{display:grid;place-items:center;min-width:44px;min-height:34px;background:var(--cream);border:1px dashed var(--line);border-radius:4px;font-size:23px}
.menu-toggle span{display:block;width:22px;height:12px;border-top:2px solid currentColor;border-bottom:2px solid currentColor}
.menu-toggle[aria-expanded=true] span{border:0;height:auto}
.menu-toggle[aria-expanded=true] span:before{content:'×';font-size:30px;line-height:1}
.sidebar-content{display:none}
.sidebar.is-open .sidebar-content{display:block}
.nav-list{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.nav-list a{padding:8px 10px}
.nav-top{font-size:16px}
.nav-preview{display:none}
.sidebar-bottom{padding-top:12px}
.sidebar-info{padding:10px}
.menu-overlay.is-open{display:block;position:fixed;inset:0;background:#1c1b18a6;z-index:25}
.status-bar{font-size:13px;min-height:20px}
.since{gap:8px}
.availability{gap:7px}
.featured-project img{aspect-ratio:4/3}
.featured-label{left:10px;top:10px;font-size:14px}
.featured-meta{display:block;padding:18px 0 24px}
.featured-meta h2{font-size:28px;margin-top:12px}
.project-row{grid-template-columns:1fr auto;gap:10px;padding:18px 0}
.project-row h3{grid-column:1/-1;font-size:23px}
.project-row .row-scope{font-size:14px}
.row-preview{display:none}
.all-projects{font-size:40px;gap:12px;flex-wrap:wrap;padding-top:40px}
.all-projects .button{padding:16px;min-width:100px}
.home-projects{padding-bottom:40px}
.about-section{padding:30px 0 60px}
.about-statement{font-size:40px;margin-bottom:35px}
.about-grid{display:block}
.about-heading{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start;margin-bottom:30px}
.portrait{grid-column:2;grid-row:1/3;margin:0;max-width:230px}
.about-copy{font-size:16px}
.section-title{font-size:48px;margin-bottom:24px}
.service-row{padding:28px 0;gap:15px}
.service-row h3{font-size:27px}
.service-images{max-width:110px}
.service-images img{width:45px;height:55px;border-width:2px;margin-left:-12px}
.service-other{gap:20px}
.service-other h3{font-size:25px}
.service-other .button{padding:18px}
.services-section{padding-bottom:35px}
.contact-section{padding:75px 0 110px}
.contact-section h2{font-size:32px}
.contact-section .contact-drawing{height:100px}
.site-footer{padding-top:30px}
.footer-top{grid-template-columns:1fr;gap:30px}
.footer-title{font-size:48px}
.footer-bottom{margin-top:30px;gap:14px}
.page-header{padding:50px 0 35px}
h1{font-size:36px}
.project-meta{grid-template-columns:1fr 1fr;gap:10px;margin-top:35px}
.project-meta div{padding:12px}
.project-meta dd{font-size:16px}
.project-cover{aspect-ratio:4/3}
.project-body{font-size:16px;padding:32px 0 40px}
.project-body h2{font-size:25px;margin:35px 0 20px}
.project-body .wp-block-gallery{gap:10px!important}
.project-grid{grid-template-columns:1fr;gap:30px}
.project-card h2,.project-card h3{font-size:25px}
.project-card img{aspect-ratio:1.6}
.related h2{font-size:30px}
.cookie-panel{inset:auto 10px 10px;max-width:none;padding:18px}
.filter{font-size:14px;padding:10px 13px}
.breadcrumb{font-size:12px}}
@media(max-width:359px){.contact-section h2{font-size:28px}
.all-projects{font-size:32px}
.service-row{gap:10px}
.service-row h3{overflow-wrap:anywhere}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*:before,*:after{animation:none!important;transition:none!important}}
@media print{.sidebar,.status-bar,.cookie-panel,.filters{display:none}
.site-shell{display:block;padding:0}
.site-footer{break-inside:avoid}
a{color:#000}
body{background:#fff}}
[hidden]{display:none!important}
.load-more{text-align:center;margin-top:35px}
.tag-filters{margin:0 0 30px}
.tag-filters summary{cursor:pointer;min-height:44px;padding:10px 0}
.tag-filters .filters{margin-top:15px}
.row-scope,.about-copy,.project-body,.service-row p,.card-meta{font-weight:300}
.single-tk_project .project-body,.single-tk_project .project-body :where(p,li,blockquote,figcaption){color:var(--ink)}
.about-copy :where(strong,b),.project-body :where(strong,b){font-weight:700}



/* Only the new hero. The rest of the stylesheet preserves the existing design. */
.portfolio-hero{width:100%;min-width:0;padding:28px 0 0}
.portfolio-identity{display:flex;flex-direction:column;gap:3px;margin:0 0 22px;color:var(--ink);font-size:11px;font-weight:400;line-height:1.35;letter-spacing:.025em}
.paper-stage{position:relative;isolation:isolate;width:100%;aspect-ratio:2.5/1;overflow:hidden;perspective:1100px;perspective-origin:50% 50%;margin:0;line-height:0;font-size:inherit;background:var(--cream)}
.paper-source{position:absolute;left:0;top:50%;width:100%;max-width:100%;height:auto;transform:translateY(-50%);display:block}
.paper-segments{position:absolute;inset:0;pointer-events:none;transform-style:preserve-3d}
.paper-segments[hidden]{display:none}
.paper-strip{position:absolute;top:0;height:100%;display:block;overflow:hidden;background:var(--cream);transform-origin:50% 50%;backface-visibility:hidden}
.paper-strip img{position:absolute;top:50%;height:auto;max-width:none;display:block;transform:translateY(-50%);pointer-events:none;user-select:none}
.paper-strip:after{content:'';position:absolute;inset:0;pointer-events:none;opacity:var(--fold-light,0);background:linear-gradient(90deg,rgba(28,27,24,.12),transparent 42%,rgba(255,255,255,.10) 74%,rgba(28,27,24,.035))}
.paper-moving .paper-source{visibility:hidden}
.paper-moving .paper-strip{will-change:transform}
@media(max-width:809px){.portfolio-hero{padding:30px 0 0}.portfolio-identity{font-size:10px;margin-bottom:16px}.paper-stage{aspect-ratio:2.3/1;perspective:850px}}
@media(prefers-reduced-motion:reduce){.paper-segments{display:none!important}.paper-moving .paper-source{visibility:visible}.paper-strip{will-change:auto}}

.nav-top>span{min-width:0;overflow-wrap:anywhere}

.sidebar-socials{flex-wrap:wrap}
.sidebar-socials .sidebar-instagram{gap:9px;justify-content:flex-start;max-width:100%;min-height:44px}
.sidebar-instagram svg{flex:0 0 21px}
.sidebar-instagram span{min-width:0;overflow-wrap:anywhere;font-size:14px;font-weight:300}
