/*
Theme Name: Ghost Machine
Description: The approved Ghost Machine Recordings landing page, with native WordPress content and identity editing.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: ghost-machine
*/
:root { color-scheme: dark; --ground: #171818; --ink: #c6c6be; --quiet: #9b9e96; --secondary: "Helvetica Neue", Helvetica, Arial, sans-serif; }
* { box-sizing: border-box; }
html { background: var(--ground); }
body { margin: 0; color: var(--ink); font-family: var(--secondary); -webkit-font-smoothing: antialiased; }
::selection { background: #bfc1b8; color: #171818; }
.sleeve { min-height: 100svh; position: relative; overflow: hidden; padding: 32px 4.1vw 23px; display: flex; flex-direction: column; background: radial-gradient(ellipse at 40% 42%, #222423 0, #1b1d1c 42%, #171818 78%); }
/* The screen surface is static; no animation, flashing, or moving scanlines. */
.sleeve::after { content: ""; pointer-events: none; position: absolute; z-index: 5; inset: 0; opacity: .065; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' opacity='.5' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); }
.masthead, footer { position: relative; z-index: 2; display: flex; justify-content: space-between; align-items: center; font: 500 10px/1.4 var(--secondary); letter-spacing: .06em; }
.masthead { color: var(--quiet); }
.imprint { display: flex; align-items: center; gap: 12px; letter-spacing: .16em; color: var(--ink); }
.imprint img { display:block; width:26px; height:26px; }
.composition { flex:1; position:relative; display:flex; flex-direction:column; justify-content:center; min-height:640px; padding:75px 0 55px; }
h1 { position:relative; isolation:isolate; z-index:2; width:min(87vw, 1500px); margin:0; font-weight:400; text-transform:uppercase; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.wordmark { display:block; width:100%; height:auto; position:relative; z-index:1; mask-image:repeating-linear-gradient(to bottom, #000 0px, #000 2px, rgba(0,0,0,.88) 2px, rgba(0,0,0,.88) 3px); }
/* A residual impression of the exact wordmark, never an unrelated object. */
h1::before { content:""; position:absolute; z-index:0; inset:0; background:var(--ghost-wordmark, url("assets/wordmark.svg")) top left / 100% auto no-repeat; opacity:.085; transform:translateX(5px); filter:blur(.45px); mask-image:linear-gradient(to bottom, #000, transparent 72%); pointer-events:none; }
.recordings { position:absolute; right:1.3%; top:22%; transform:translateY(-50%); font:500 11px/1.5 var(--secondary); letter-spacing:.35em; color:#b7bab1; }
.phrase { position:relative; z-index:2; margin:44px 0 0 .9vw; color:#a0a29a; font:400 12px/1.6 var(--secondary); letter-spacing:.015em; }
footer { border-top:1px solid #393c37; padding-top:19px; color:var(--quiet); }
.footer-mark { color:#acafa7; font-size:11px; letter-spacing:.02em; }
.footer-mark span { padding:0 10px; color:#646962; }
@media (min-width:1800px) { .sleeve { padding-left:max(4.1vw, calc((100vw - 1640px) / 2)); padding-right:max(4.1vw, calc((100vw - 1640px) / 2)); } }
@media (max-width:760px) {
 .sleeve { padding:24px 6vw 20px; }
 .masthead, footer { font-size:9px; }
 .composition { min-height:540px; padding:75px 0 40px; justify-content:center; }
 h1 { width:88vw; }
 h1::before { transform:translateX(2px); }
 .recordings { right:.7%; top:22%; font-size:8px; letter-spacing:.12em; }
 .phrase { margin:55px 0 0 1vw; font-size:11px; }
}
@media (min-width:761px) and (max-height:780px) {
 .composition { min-height:540px; padding:45px 0 35px; }
 h1 { width:min(87vw, 1180px); }
 .phrase { margin-top:30px; }
}

.phrase p { margin:0; }
.phrase > * + * { margin-top:.6em; }
.admin-bar .sleeve { min-height:calc(100svh - 32px); }
.standard-content { flex:1; width:min(100%, 800px); padding:80px 0; font-size:18px; line-height:1.65; }
.standard-content h1 { width:auto; font:400 clamp(32px,5vw,64px)/1.1 var(--secondary); text-transform:none; }
.standard-content a { color:inherit; }
@media(max-width:782px) { .admin-bar .sleeve { min-height:calc(100svh - 46px); } }
