/*
Theme Name: Pätze unterwegs
Theme URI: https://paetze-unterwegs.workspace-vo-4338.chatgpt.site
Author: Pätze unterwegs
Description: Dunkles, responsives WordPress-Theme für den YouTube-Kanal Pätze unterwegs – Lost Places, Urbex und Geschichten.
Version: 1.1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: paetze-unterwegs
*/

:root { --ink:#090a09; --paper:#e8e7e1; --muted:#989a93; --line:rgba(232,231,225,.16); --rust:#df572b; --rust-light:#ff6a3a; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--ink); color:var(--paper); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
.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:absolute; inset:0 0 auto; z-index:20; min-height:94px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:32px; padding:0 clamp(22px,5vw,78px); border-bottom:1px solid rgba(255,255,255,.16); }
.brand { display:inline-flex; align-items:center; gap:12px; width:fit-content; }
.brand-logo { display:grid; place-items:center; width:68px; height:68px; padding:4px; overflow:hidden; border-radius:50%; background:#fff; box-shadow:0 8px 25px rgba(0,0,0,.22); }
.brand-logo img { width:100%; height:100%; object-fit:contain; }
.brand .custom-logo-link { display:block; }
.brand .custom-logo { width:auto; max-height:58px; }
.brand-mark { display:grid; place-items:center; width:41px; height:41px; background:var(--rust); color:#fff; font-size:25px; font-weight:900; font-style:italic; transform:skew(-7deg); }
.brand-copy { display:grid; line-height:.86; letter-spacing:.05em; }
.brand-copy strong { font-size:18px; }
.brand-copy small { margin-top:5px; font-size:9px; letter-spacing:.32em; }
.site-header nav .menu { display:flex; gap:clamp(20px,3vw,44px); margin:0; padding:0; list-style:none; }
.site-header nav a { font-size:12px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; transition:color .2s; }
.site-header nav a:hover,.site-header nav a:focus-visible { color:var(--rust-light); }
.header-cta { justify-self:end; font-size:12px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.header-cta span { margin-left:8px; color:var(--rust-light); }
.menu-toggle { display:none; background:none; border:0; padding:8px; }
.menu-toggle > span:not(.screen-reader-text) { display:block; width:24px; height:2px; margin:5px 0; background:#fff; }

.hero { position:relative; min-height:800px; height:100svh; overflow:hidden; display:flex; align-items:center; }
.hero-image,.hero-shade,.hero-grid { position:absolute; inset:0; }
.hero-image img { width:100%; height:100%; object-fit:cover; filter:saturate(.52) contrast(1.18) brightness(.7); }
.hero-shade { background:linear-gradient(90deg,rgba(5,6,5,.98) 0%,rgba(5,6,5,.78) 41%,rgba(5,6,5,.2) 75%),linear-gradient(0deg,rgba(5,6,5,.85),transparent 43%); }
.hero-grid { opacity:.18; background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px); background-size:72px 72px; mask-image:linear-gradient(90deg,#000,transparent 75%); }
.hero-content { position:relative; z-index:2; width:min(760px,84vw); margin-left:clamp(22px,8vw,126px); padding-top:72px; }
.eyebrow { display:flex; align-items:center; gap:11px; margin:0 0 22px; color:#bfc0b9; font-size:11px; font-weight:800; letter-spacing:.24em; text-transform:uppercase; }
.eyebrow span { width:28px; height:2px; background:var(--rust); }
h1,h2 { margin:0; font-family:Impact,"Arial Narrow",sans-serif; font-weight:900; letter-spacing:-.015em; line-height:.87; text-transform:uppercase; }
h1 { font-size:clamp(58px,8.2vw,126px); }
h1 em,h2 em { color:var(--rust-light); font-style:normal; }
.hero-copy { max-width:590px; margin:28px 0 0; color:#c5c6c0; font-size:clamp(16px,1.4vw,20px); line-height:1.65; }
.hero-actions { display:flex; align-items:center; gap:32px; margin-top:36px; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:54px; padding:0 25px; font-size:12px; font-weight:900; letter-spacing:.12em; text-transform:uppercase; transition:transform .2s,background .2s; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--rust); color:#fff; }
.button-primary:hover { background:var(--rust-light); }
.play { margin-right:11px; font-size:11px; }
.text-link { display:inline-flex; gap:9px; align-items:center; font-size:11px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.text-link span { color:var(--rust-light); font-size:16px; }
.hero-index { position:absolute; z-index:2; right:clamp(22px,5vw,78px); bottom:52px; display:flex; align-items:center; gap:12px; font-family:monospace; font-size:12px; }
.hero-index span { color:var(--rust-light); }
.hero-index i { width:70px; height:1px; background:linear-gradient(90deg,var(--rust) 33%,rgba(255,255,255,.38) 33%); }
.hero-index small { color:#aaa; }

.section { padding:110px clamp(22px,7vw,112px); }
.expeditions { background:#101110; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:28px; margin-bottom:48px; }
.section-heading .eyebrow { margin-bottom:16px; }
h2 { font-size:clamp(43px,5.8vw,82px); }
.channel-player { position:relative; width:min(1120px,100%); aspect-ratio:16/9; margin:0 auto 58px; overflow:hidden; border:1px solid var(--line); background:#050505; box-shadow:0 28px 70px rgba(0,0,0,.28); }
.channel-player iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.tour-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:42px 28px; }
.tour-card { display:block; }
.tour-image { position:relative; aspect-ratio:16/10.2; overflow:hidden; background:#222; }
.tour-image:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.56),transparent 55%); }
.tour-image img { width:100%; height:100%; object-fit:cover; filter:saturate(.55) contrast(1.1); transition:transform .45s,filter .45s; }
.tour-card:hover .tour-image img { transform:scale(1.035); filter:saturate(.78) contrast(1.05); }
.tour-number { position:absolute; z-index:2; top:18px; left:18px; font-family:monospace; font-size:11px; letter-spacing:.1em; }
.tour-play { position:absolute; z-index:2; right:18px; bottom:18px; display:grid; place-items:center; width:44px; height:44px; background:var(--rust); font-size:12px; }
.card-kicker { margin:19px 0 8px!important; color:var(--rust-light)!important; font-size:10px!important; font-weight:900; letter-spacing:.18em; text-transform:uppercase; }
.tour-card h3 { margin:0; font-size:clamp(21px,2vw,29px); line-height:1.12; text-transform:uppercase; }
.tour-card>p { margin:12px 0 16px; color:#999b95; font-size:14px; line-height:1.6; }
.card-link { display:inline-flex; gap:8px; align-items:center; font-size:10px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.card-link span { color:var(--rust-light); }

.equipment { background:#e4e2da; color:#11120f; }
.equipment .eyebrow { color:#676961; }
.equipment h2 { color:#11120f; }
.equipment .gallery-intro { color:#66675f; }
.equipment-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(17,18,15,.2); border-bottom:1px solid rgba(17,18,15,.2); }
.equipment-grid article { min-height:250px; padding:35px clamp(20px,3vw,46px) 38px; border-right:1px solid rgba(17,18,15,.2); }
.equipment-grid article:last-child { border-right:0; }
.equipment-grid span { color:var(--rust); font-family:monospace; font-size:11px; }
.equipment-grid h3 { margin:62px 0 12px; font-size:20px; text-transform:uppercase; }
.equipment-grid p { margin:0; color:#66675f; font-size:14px; line-height:1.7; }
.equipment-link { margin-top:34px; }
.equipment-link>span { margin-left:10px; }

.links-section { background:#141513; }
.link-grid { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--line); }
.link-grid>a { position:relative; min-height:155px; padding:30px 70px 30px 0; border-bottom:1px solid var(--line); }
.link-grid>a:nth-child(odd) { border-right:1px solid var(--line); padding-right:40px; }
.link-grid>a:nth-child(even) { padding-left:40px; }
.link-grid>a>span:first-child { color:var(--rust-light); font-size:12px; font-weight:900; letter-spacing:.15em; text-transform:uppercase; }
.link-grid p { margin:18px 0 0; color:#a2a49d; font-size:15px; }
.link-grid>a>span:last-child { position:absolute; right:24px; top:28px; color:var(--rust-light); font-size:22px; }

.gallery { background:#171816; }
.gallery-intro { max-width:440px; margin:0 0 4px; color:#a2a49d; font-size:15px; line-height:1.7; }
.photo-grid { display:grid; grid-template-columns:1.08fr .92fr; grid-template-rows:280px 280px; gap:14px; }
.photo { position:relative; margin:0; overflow:hidden; background:#242522; }
.photo:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.72),transparent 48%); }
.photo img { width:100%; height:100%; object-fit:cover; filter:saturate(.65) contrast(1.08); transition:transform .5s,filter .5s; }
.photo:hover img { transform:scale(1.035); filter:saturate(.9) contrast(1.04); }
.photo figcaption { position:absolute; z-index:2; left:19px; bottom:17px; font-size:10px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.photo-1 { grid-row:1/3; }
.photo-2 { grid-column:2; }

.about { display:grid; grid-template-columns:minmax(0,1.03fr) minmax(360px,.97fr); gap:clamp(58px,8vw,126px); align-items:center; background:#e4e2da; color:#11120f; }
.about-visual { position:relative; min-height:610px; overflow:hidden; background:#232522; }
.about-visual:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.36),transparent 55%); }
.about-visual img { width:100%; height:100%; min-height:610px; object-fit:cover; filter:saturate(.55) contrast(1.08); }
.stamp { position:absolute; z-index:2; left:26px; bottom:25px; padding:13px 15px 11px; border:2px solid var(--rust); color:#fff; font-size:11px; font-weight:900; letter-spacing:.12em; line-height:1.25; transform:rotate(-3deg); }
.about-copy { max-width:580px; }
.about-copy .eyebrow { color:#676961; }
.about-copy h2 { color:#0f100e; }
.about-copy .lead { margin:30px 0 17px; color:#272821; font-size:clamp(19px,2vw,25px); font-weight:700; line-height:1.45; }
.about-copy>p:not(.eyebrow):not(.lead) { color:#66675f; font-size:15px; line-height:1.8; }
.about-copy blockquote { margin:29px 0; padding:17px 0 17px 21px; border-left:3px solid var(--rust); color:#272821; font-size:16px; font-weight:700; font-style:italic; line-height:1.55; }
.button-outline { border:1px solid #1d1e1a; color:#11120f; }
.button-outline:hover { background:#11120f; color:#fff; }
.button-outline span,.button-light span { margin-left:12px; font-size:16px; }

.code { background:#0b0c0b; }
.code-heading { display:grid; grid-template-columns:1.15fr .85fr; align-items:end; gap:52px; margin-bottom:62px; }
.code-heading .eyebrow { grid-column:1/-1; margin-bottom:-23px; }
.code-heading>p:last-child { margin:0 0 3px; max-width:520px; color:#a3a59d; font-size:16px; line-height:1.75; }
.code-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.code-grid article { min-height:250px; padding:35px clamp(20px,3vw,46px) 38px; border-right:1px solid var(--line); }
.code-grid article:last-child { border-right:0; }
.code-grid span { color:var(--rust-light); font-family:monospace; font-size:11px; }
.code-grid h3 { margin:62px 0 12px; font-size:20px; text-transform:uppercase; }
.code-grid p { margin:0; color:#92948d; font-size:14px; line-height:1.7; }

.contact { display:grid; grid-template-columns:1.2fr .8fr; gap:70px; align-items:end; min-height:500px; background:var(--rust); }
.contact .eyebrow { color:rgba(255,255,255,.75); }
.contact .eyebrow span { background:#fff; }
.contact h2 em { color:#151612; }
.contact-copy { max-width:520px; padding-bottom:7px; }
.contact-copy p { margin:0 0 30px; color:rgba(255,255,255,.86); font-size:17px; line-height:1.7; }
.button-light { background:#f0eee7; color:#11120f; }
.button-light:hover { background:#fff; }

.site-footer { min-height:120px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:24px; padding:25px clamp(22px,5vw,78px); border-top:1px solid rgba(255,255,255,.08); background:#080908; }
.site-footer p { color:#777971; font-size:10px; letter-spacing:.17em; text-transform:uppercase; }
.footer-links { justify-self:end; display:flex; align-items:center; gap:24px; }
.footer-links a { font-size:11px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.footer-links a:hover,.footer-links a:focus-visible { color:var(--rust-light); }
.footer-links span { margin-left:7px; color:var(--rust-light); }

.content-shell { min-height:80vh; width:min(940px,calc(100% - 44px)); margin:0 auto; padding:180px 0 90px; }
.content-header { margin-bottom:52px; }
.content-header h1 { font-size:clamp(48px,7vw,88px); }
.post-list { display:grid; gap:22px; }
.post-card { padding:30px; border:1px solid var(--line); background:#111210; }
.post-card h2 { font-family:Arial,Helvetica,sans-serif; font-size:28px; line-height:1.15; text-transform:none; }
.post-card div,.entry-content { color:#b6b7b1; font-size:17px; line-height:1.8; }
.entry-content a { color:var(--rust-light); text-decoration:underline; }
.entry-hero { margin-bottom:40px; }
.legal-page { min-height:80vh; background:#0b0c0b; }
.legal-content { padding-top:180px; }
.legal-content h1 { font-size:clamp(58px,8vw,112px); }
.legal-card { max-width:720px; margin-top:50px; padding:clamp(28px,5vw,54px); border:1px solid var(--line); background:#121311; }
.legal-card h2 { margin:0 0 22px; font-family:Arial,Helvetica,sans-serif; font-size:19px; line-height:1.3; text-transform:none; }
.legal-card h2:not(:first-child) { margin-top:42px; }
.legal-card address,.legal-card p { color:#c3c4bd; font-size:17px; font-style:normal; line-height:1.8; }
.legal-card a { color:var(--rust-light); text-decoration:underline; }
.legal-card .source-note { margin-top:38px; color:#85877f; font-size:13px; }

@media(max-width:820px){
	.site-header { grid-template-columns:1fr auto auto; min-height:78px; }
	.menu-toggle { display:block; }
	.site-header nav { position:absolute; top:78px; left:0; right:0; display:none; padding:22px; background:rgba(9,10,9,.98); border-bottom:1px solid var(--line); }
	.site-header nav.is-open { display:block; }
	.site-header nav .menu { flex-direction:column; gap:22px; }
	.hero { min-height:720px; }
	.hero-content { width:calc(100% - 44px); margin-left:22px; }
	.hero-shade { background:linear-gradient(90deg,rgba(5,6,5,.95),rgba(5,6,5,.42)),linear-gradient(0deg,rgba(5,6,5,.9),transparent 60%); }
	.hero-actions { align-items:flex-start; flex-direction:column; gap:22px; }
	.hero-index { display:none; }
	.section { padding-top:82px; padding-bottom:82px; }
	.section-heading { align-items:flex-start; flex-direction:column; }
	.tour-grid { grid-template-columns:1fr; gap:44px; }
	.photo-grid { grid-template-columns:1fr 1fr; grid-template-rows:repeat(2,230px); }
	.photo-1,.photo-2 { grid-column:auto; grid-row:auto; }
	.about { grid-template-columns:1fr; gap:52px; }
	.about-visual,.about-visual img { min-height:440px; }
	.code-heading,.contact { grid-template-columns:1fr; }
	.code-heading .eyebrow { margin-bottom:-12px; }
	.code-grid { grid-template-columns:1fr; }
	.code-grid article { min-height:auto; border-right:0; border-bottom:1px solid var(--line); }
	.code-grid article:last-child { border-bottom:0; }
	.code-grid h3 { margin-top:34px; }
	.equipment-grid { grid-template-columns:1fr; }
	.equipment-grid article { min-height:auto; border-right:0; border-bottom:1px solid rgba(17,18,15,.2); }
	.equipment-grid article:last-child { border-bottom:0; }
	.equipment-grid h3 { margin-top:34px; }
	.link-grid { grid-template-columns:1fr; }
	.link-grid>a:nth-child(odd),.link-grid>a:nth-child(even) { border-right:0; padding:28px 62px 28px 0; }
	.contact { gap:38px; }
	.site-footer { grid-template-columns:1fr auto; }
	.site-footer p { display:none; }
}
@media(max-width:480px){
	.brand-copy,.header-cta { display:none; }
	.brand-logo { width:58px; height:58px; }
	.site-header { grid-template-columns:1fr auto; }
	.hero { min-height:700px; }
	.hero-content { padding-top:50px; }
	h1 { font-size:55px; }
	.photo-grid { grid-template-columns:1fr; grid-template-rows:repeat(4,220px); }
	.site-footer { grid-template-columns:1fr; gap:18px; }
	.footer-links { justify-self:start; }
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition-duration:.01ms!important}}
