/*
Theme Name: Dimonte
Theme URI: https://dimonte.com.br
Author: Dimonte Filmes
Author URI: https://dimonte.com.br
Description: Tema do coletivo audiovisual periférico Dimonte Filmes (antes Várias Fita Filmes). Pôster e lambe-lambe afrofuturista da quebrada, com cor cheia e tipografia pesada. Home de página única com Filmes e Integrantes editáveis.
Version: 1.1.0
Requires at least: 7.0
Tested up to: 7.0.2
Requires PHP: 8.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: dimonte
Tags: one-page, custom-colors, custom-logo, translation-ready, full-width-template
*/

:root {
  --paper:   #F1E7D5;
  --paper-2: #E7D9BF;
  --ink:     #1B1016;
  --text:    #241820;
  --text-dim:#5A4A50;
  --muted:   #8B7970;

  --blue:   #1B4DE4;
  --orange: #E87322;
  --gold:   #C98914;
  --violet: #5A2A80;
  --teal:   #158A74;

  --bg:      var(--paper);
  --surface: var(--paper-2);
  --accent:  var(--blue);
  --border:  rgba(27,16,22,0.16);
  --hairline:rgba(27,16,22,0.28);

  --grain-blend: multiply;
  --grain-op: 0.06;

  --maxw: 1220px;
  --pad: clamp(1.15rem, 5vw, 4rem);
  --sect: clamp(4.5rem, 11vh, 9rem);

  --display: "Arial Black", "Helvetica Neue", system-ui, sans-serif;
  --sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "SF Mono", "Cascadia Code", "Roboto Mono", Menlo, Consolas, monospace;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg:      #150E19;
    --surface: #201628;
    --ink:     #F4EADB;
    --text:    #F1E6D6;
    --text-dim:#C7B6BC;
    --muted:   #93818A;

    --blue:   #4B7BFF;
    --orange: #FF9042;
    --gold:   #FFC24D;
    --violet: #B579EC;
    --teal:   #3ED3B0;

    --accent:  var(--blue);
    --border:  rgba(244,234,219,0.15);
    --hairline:rgba(244,234,219,0.30);
    --grain-blend: overlay;
    --grain-op: 0.08;
  }
}

:root[data-theme="light"] {
  --bg:#F1E7D5; --surface:#E7D9BF; --ink:#1B1016; --text:#241820;
  --text-dim:#5A4A50; --muted:#8B7970;
  --blue:#1B4DE4; --orange:#E87322; --gold:#C98914; --violet:#5A2A80; --teal:#158A74;
  --accent:var(--blue); --border:rgba(27,16,22,0.16); --hairline:rgba(27,16,22,0.28);
  --grain-blend:multiply; --grain-op:0.06;
}
:root[data-theme="dark"] {
  --bg:#150E19; --surface:#201628; --ink:#F4EADB; --text:#F1E6D6;
  --text-dim:#C7B6BC; --muted:#93818A;
  --blue:#4B7BFF; --orange:#FF9042; --gold:#FFC24D; --violet:#B579EC; --teal:#3ED3B0;
  --accent:var(--blue); --border:rgba(244,234,219,0.15); --hairline:rgba(244,234,219,0.30);
  --grain-blend:overlay; --grain-op:0.08;
}

* { box-sizing: border-box; }
body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, ul, ol, dd, dl { margin: 0; }
button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  font-size: 1.02rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

::selection { background: var(--blue); color: #fff; }

a { color: inherit; text-decoration: none; }

.grain {
  position: fixed; inset: -50%; z-index: 60; pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  opacity: var(--grain-op);
  mix-blend-mode: var(--grain-blend);
}
:root.motion .grain { animation: grain 0.6s steps(3) infinite; }
@keyframes grain {
  0%{transform:translate(0,0)} 33%{transform:translate(-4%,3%)} 66%{transform:translate(3%,-2%)} 100%{transform:translate(0,0)}
}

.wrap { max-width: var(--maxw); margin: 0 auto; padding-inline: var(--pad); }

.skip {
  position: absolute; left: -999px; top: 0; z-index: 100;
  background: var(--ink); color: var(--bg); padding: .6rem 1rem; font-family: var(--mono);
}
.skip:focus { left: 0; }

:focus-visible { outline: 3px solid var(--blue); outline-offset: 3px; border-radius: 2px; }

.eyebrow {
  font-family: var(--mono); font-size: .72rem; letter-spacing: .22em;
  text-transform: uppercase; color: var(--muted); display: inline-block;
}
.tag {
  font-family: var(--mono); font-size: .66rem; letter-spacing: .14em;
  text-transform: uppercase; padding: .28em .6em; border: 1.5px solid currentColor;
  display: inline-block; line-height: 1;
}
.sticker {
  font-family: var(--mono); font-size: .64rem; letter-spacing: .12em; text-transform: uppercase;
  background: var(--ink); color: var(--bg); padding: .4em .7em; display: inline-block;
  transform: rotate(-3deg);
}

.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 50;
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; padding: .85rem var(--pad);
  transition: background .3s ease, border-color .3s ease, backdrop-filter .3s;
  border-bottom: 1.5px solid transparent;
}
.site-header.stuck {
  background: color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter: blur(10px);
  border-bottom-color: var(--border);
}
.brand { display: flex; align-items: baseline; gap: .55rem; }
.brand .mark {
  width: 0; height: 0; border-left: .5em solid transparent; border-right: .5em solid transparent;
  border-bottom: .86em solid var(--blue); display: inline-block; transform: translateY(.06em);
  font-size: 1.3rem;
}
.brand .name {
  font-family: var(--display); font-weight: 900; font-size: 1.32rem; letter-spacing: -.02em;
  text-transform: uppercase; color: var(--text);
}
.brand .sub { font-family: var(--mono); font-size: .58rem; letter-spacing: .12em; color: var(--muted); text-transform: uppercase; }
nav.links { display: flex; gap: 1.6rem; align-items: center; }
nav.links a {
  font-family: var(--mono); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-dim); transition: color .2s; position: relative; padding: .2em 0;
}
nav.links a::after {
  content:''; position:absolute; left:0; bottom:-2px; height:2px; width:0; background: var(--blue); transition: width .25s;
}
nav.links a:hover { color: var(--text); }
nav.links a:hover::after { width: 100%; }
.nav-cta {
  font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
  background: var(--blue); color: #fff; padding: .55em 1em; transition: transform .15s, filter .2s;
}
.nav-cta:hover { transform: translateY(-1px); filter: brightness(1.06); }
.nav-cta::after { display: none; }
.theme-toggle {
  display: inline-flex; align-items: center; gap: .45em;
  font-family: var(--mono); font-size: .72rem; letter-spacing: .1em; text-transform: uppercase;
  color: var(--text-dim); border: 1.5px solid var(--hairline); padding: .5em .8em;
  transition: color .2s, border-color .2s;
}
.theme-toggle:hover { color: var(--text); border-color: var(--text); }
.theme-toggle .ico { font-size: .95em; color: var(--blue); }

.nav-toggle { display: none; }

@media (max-width: 860px) {
  .nav-toggle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 2.7rem; height: 2.7rem; margin-left: auto;
    border: 1.5px solid var(--hairline); color: var(--text);
    position: relative; z-index: 60; transition: border-color .2s;
  }
  .nav-toggle:hover { border-color: var(--text); }
  .nav-toggle .bars,
  .nav-toggle .bars::before,
  .nav-toggle .bars::after {
    content: ''; display: block; width: 1.15rem; height: 2px; background: currentColor;
    transition: transform .28s cubic-bezier(.2,.7,.2,1), opacity .2s ease, background .2s;
  }
  .nav-toggle .bars { position: relative; }
  .nav-toggle .bars::before { position: absolute; left: 0; top: -6px; }
  .nav-toggle .bars::after  { position: absolute; left: 0; top: 6px; }

  .site-header.nav-open .nav-toggle .bars { background: transparent; }
  .site-header.nav-open .nav-toggle .bars::before { transform: translateY(6px) rotate(45deg); }
  .site-header.nav-open .nav-toggle .bars::after  { transform: translateY(-6px) rotate(-45deg); }

  .site-header.nav-open {
    background: color-mix(in srgb, var(--bg) 92%, transparent);
    backdrop-filter: blur(10px);
    border-bottom-color: var(--border);
  }

  nav.links {
    position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column; align-items: stretch; gap: 0;
    padding: 1.1rem var(--pad) 1.8rem;
    background: color-mix(in srgb, var(--bg) 97%, transparent);
    backdrop-filter: blur(12px);
    border-bottom: 2.5px solid var(--ink);
    max-height: 82dvh; overflow-y: auto;
    transform: translateY(-10px); opacity: 0; pointer-events: none;
    transition: transform .3s cubic-bezier(.2,.7,.2,1), opacity .24s ease;
  }
  .site-header.nav-open nav.links {
    transform: translateY(0); opacity: 1; pointer-events: auto;
  }
  nav.links a:not(.nav-cta) {
    font-family: var(--display); font-weight: 900; text-transform: uppercase;
    font-size: clamp(1.6rem, 8vw, 2.1rem); letter-spacing: -.02em; color: var(--ink);
    padding: .5rem 0; border-bottom: 1.5px solid var(--border);
  }
  nav.links a:not(.nav-cta)::after { display: none; }
  nav.links .nav-cta {
    margin-top: 1.4rem; text-align: center; justify-content: center;
    font-size: .82rem; padding: 1.05em 1em;
  }
  nav.links .theme-toggle {
    margin-top: 1rem; justify-content: center; padding: .95em 1em;
  }
}

.hero { position: relative; padding-top: clamp(7rem, 16vh, 11rem); padding-bottom: var(--sect); overflow: hidden; }
.hero::before {
  content:''; position: absolute; z-index:0; top:-10%; right:-15%;
  width: 60vw; height: 60vw; max-width: 820px; max-height: 820px;
  background: radial-gradient(circle, var(--violet), transparent 62%);
  opacity: .28; filter: blur(10px);
}
.hero-grid { position: relative; z-index: 1; display: grid; gap: clamp(1.5rem,4vw,3rem); }
.hero h1 {
  font-family: var(--display); font-weight: 900; text-transform: uppercase;
  font-size: clamp(2.7rem, 8.4vw, 7.2rem); line-height: .92; letter-spacing: -.025em;
  margin: 1.1rem 0 0; text-wrap: balance; color: var(--ink);
}
.hero h1 .hl { color: var(--blue); }
.hero h1 .out { color: transparent; -webkit-text-stroke: 2px var(--text); }
.hero .lead {
  max-width: 46ch; font-size: clamp(1.02rem, 2vw, 1.22rem); color: var(--text-dim);
  margin-top: 1.6rem;
}
.hero .lead b { color: var(--text); font-weight: 700; }
.hero-cta { display: flex; flex-wrap: wrap; gap: .8rem; margin-top: 2rem; }
.btn {
  font-family: var(--mono); font-size: .8rem; letter-spacing: .08em; text-transform: uppercase;
  padding: .95em 1.5em; display: inline-flex; align-items: center; gap: .6em;
  transition: transform .15s ease, filter .2s, background .2s, color .2s;
}
.btn-solid { background: var(--blue); color: #fff; }
.btn-solid:hover { transform: translateY(-2px); filter: brightness(1.07); }
.btn-ghost { border: 1.5px solid var(--hairline); color: var(--text); }
.btn-ghost:hover { background: var(--ink); color: var(--bg); border-color: var(--ink); }

.hero-stats { display: flex; flex-wrap: wrap; gap: clamp(1.2rem,3vw,2.6rem); margin-top: 2.6rem; }
.hstat { display: flex; flex-direction: column; gap: .1rem; }
.hstat .n {
  font-family: var(--display); font-weight: 900; font-size: clamp(1.6rem,3.4vw,2.3rem);
  color: var(--text); font-variant-numeric: tabular-nums; line-height: 1;
}
.hstat .l { font-family: var(--mono); font-size: .64rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.hstat + .hstat { padding-left: clamp(1.2rem,3vw,2.6rem); border-left: 1.5px solid var(--border); }

.band {
  background: var(--blue); color: #fff; overflow: hidden; white-space: nowrap;
  padding: .7rem 0; border-block: 2.5px solid var(--ink); transform: rotate(-1.2deg) scale(1.03);
  margin: clamp(3rem,7vh,5rem) 0;
}
.band .track { display: inline-flex; gap: 2.5rem; align-items: center; }
:root.motion .band .track { animation: marq 26s linear infinite; }
.band span {
  font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: clamp(1rem,2.4vw,1.6rem);
  letter-spacing: .02em; display: inline-flex; gap: 2.5rem; align-items: center;
}
.band .dot { color: var(--gold); }
@keyframes marq { to { transform: translateX(-50%); } }

.section { padding-block: var(--sect); position: relative; }
.sect-head { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; margin-bottom: 2.6rem; }
.sect-head h2 {
  font-family: var(--display); font-weight: 900; text-transform: uppercase;
  font-size: clamp(1.9rem, 5vw, 3.4rem); line-height: .95; letter-spacing: -.02em;
  margin: .3rem 0 0; color: var(--ink); text-wrap: balance;
}

.about-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(2rem,5vw,4.5rem); align-items: start; }
@media (max-width: 820px) { .about-grid { grid-template-columns: 1fr; } }
.about-grid p { color: var(--text-dim); margin: 0 0 1.1rem; max-width: 60ch; }
.about-grid p b { color: var(--text); font-weight: 700; }
.about-grid .lede { font-size: clamp(1.15rem,2.2vw,1.4rem); color: var(--text); line-height: 1.45; }
.heritage {
  border: 1.5px solid var(--border); background: var(--surface); padding: 1.6rem;
  position: relative;
}
.heritage h3 { font-family: var(--mono); font-size: .74rem; letter-spacing: .14em; text-transform: uppercase; color: var(--blue); margin: 0 0 .8rem; }
.heritage p { font-size: .95rem; margin-bottom: .8rem; }
.heritage .old { text-decoration: line-through; text-decoration-color: var(--blue); text-decoration-thickness: 2px; color: var(--muted); }

.quote {
  margin-top: clamp(3rem,6vh,4.5rem); border-top: 2.5px solid var(--ink); border-bottom: 2.5px solid var(--ink);
  padding: clamp(2rem,5vw,3.5rem) 0;
}
.quote blockquote {
  margin: 0; font-family: var(--display); font-weight: 900; text-transform: uppercase;
  font-size: clamp(1.6rem, 4.6vw, 3.4rem); line-height: 1.02; letter-spacing: -.02em;
  color: var(--ink); text-wrap: balance; max-width: 20ch;
}
.quote blockquote em { font-style: normal; color: var(--blue); }
.quote cite { display: block; margin-top: 1.2rem; font-family: var(--mono); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); font-style: normal; }

.films { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(1rem,2vw,1.5rem); }
@media (max-width: 900px) { .films { grid-template-columns: repeat(2,1fr); } }
@media (max-width: 580px) { .films { grid-template-columns: 1fr; } }

.film {
  --c: var(--blue); --on: #fff;
  position: relative; aspect-ratio: 3/4; background: var(--c); color: var(--on);
  padding: 1.15rem; display: flex; flex-direction: column; justify-content: space-between;
  overflow: hidden; isolation: isolate; transition: transform .3s cubic-bezier(.2,.7,.2,1);
  border: 2px solid var(--ink);
}
.film::after {
  content:''; position: absolute; inset: 0; z-index: 0;
  background-image: radial-gradient(rgba(0,0,0,.28) 1px, transparent 1.5px);
  background-size: 7px 7px; mix-blend-mode: multiply; opacity: .5;
}
.film > * { position: relative; z-index: 1; }
.film:hover { transform: translateY(-6px) rotate(-.6deg); }
.film .ghost {
  position: absolute; z-index: 0; right: -.15em; bottom: -.32em; font-family: var(--display);
  font-weight: 900; font-size: 11rem; line-height: .7; color: rgba(255,255,255,.14);
  text-transform: uppercase; pointer-events: none; user-select: none;
}
.film .f-top { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; }
.film .f-cat { font-family: var(--mono); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; background: var(--on); color: var(--c); padding: .3em .6em; }
.film .f-year { font-family: var(--mono); font-size: .72rem; opacity: .85; font-variant-numeric: tabular-nums; }
.film h3 {
  font-family: var(--display); font-weight: 900; text-transform: uppercase; letter-spacing: -.02em;
  font-size: clamp(1.35rem, 2.4vw, 1.75rem); line-height: .95; margin: 0;
}
.film .syn {
  font-size: .82rem; line-height: 1.45; margin: .55rem 0 0; max-height: 0; opacity: 0; overflow: hidden;
  transition: max-height .35s ease, opacity .3s ease, margin .3s;
}
.film:hover .syn, .film:focus-within .syn { max-height: 12rem; opacity: .95; margin-top: .7rem; }
.film .f-foot { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; margin-top: .7rem; }
.film .badge { font-family: var(--mono); font-size: .58rem; letter-spacing: .06em; text-transform: uppercase; border: 1.2px solid currentColor; padding: .2em .45em; opacity: .9; }
.film .play { font-family: var(--mono); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; margin-left: auto; display: inline-flex; gap: .35em; align-items: center; }
.film.wip { --c: var(--surface); --on: var(--text); border-style: dashed; }
.film.wip::after { opacity: .25; }
.film.wip .f-cat { background: var(--violet); color:#fff; }

.film .film-bg { position: absolute; inset: 0; z-index: 0; background-size: cover; background-position: center; }
.film .film-bg::after { content:''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(12,8,14,.94), rgba(12,8,14,.30) 65%); }
.film.has-img { color: #fff; }

.films-note { font-family: var(--mono); font-size: .72rem; color: var(--muted); margin-top: 1.4rem; letter-spacing: .04em; }

.team { display: grid; grid-template-columns: repeat(3,1fr); gap: clamp(1rem,2.5vw,2rem); }
@media (max-width: 820px) { .team { grid-template-columns: 1fr; } }
.member { border: 1.5px solid var(--border); background: var(--surface); padding: 1.5rem; display: flex; flex-direction: column; gap: 1rem; }
.member .avatar {
  width: 100%; aspect-ratio: 4/3; display: grid; place-items: center; color: #fff;
  font-family: var(--display); font-weight: 900; font-size: 3.4rem; text-transform: uppercase;
  position: relative; overflow: hidden; border: 2px solid var(--ink);
}
.member .avatar::after { content:''; position:absolute; inset:0; background-image: radial-gradient(rgba(0,0,0,.25) 1px, transparent 1.4px); background-size:8px 8px; mix-blend-mode:multiply; opacity:.5; }
.member .avatar.has-img { background-size: cover; background-position: center; }
.member h3 { font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: 1.3rem; margin: 0; letter-spacing: -.01em; color: var(--ink); }
.member .role { font-family: var(--mono); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; color: var(--blue); margin-top: -.6rem; }
.member p { font-size: .86rem; color: var(--text-dim); margin: 0; }
.member .origin { font-family: var(--mono); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-top: auto; }

.impact {
  --band: #1B1016;
  --gold: #FFC24D;
  background: var(--band); color: var(--paper);
  border-block: 3px solid var(--blue);
}

@media (prefers-color-scheme: dark) { .impact { --band: #2C1A3B; } }
:root[data-theme="light"] .impact { --band: #1B1016; }
:root[data-theme="dark"]  .impact { --band: #2C1A3B; }
.impact .eyebrow { color: var(--gold); }
.impact .sect-head h2 { color: var(--paper); }
.bigstats { display: grid; grid-template-columns: repeat(4,1fr); gap: 1px; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.16); }
@media (max-width: 780px) { .bigstats { grid-template-columns: repeat(2,1fr); } }
.bigstat { background: var(--band); padding: 1.6rem 1.3rem; display: flex; flex-direction: column; gap: .4rem; }
.bigstat .n { font-family: var(--display); font-weight: 900; font-size: clamp(2rem,4.4vw,3rem); line-height: .9; color: var(--gold); font-variant-numeric: tabular-nums; }
.bigstat .l { font-family: var(--mono); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: rgba(244,234,219,.8); }
.impact-body { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem,5vw,4rem); margin-top: 2.8rem; }
@media (max-width: 820px) { .impact-body { grid-template-columns: 1fr; } }
.impact-body p { color: rgba(244,234,219,.82); margin: 0 0 1.1rem; max-width: 56ch; }
.impact-body p b { color: var(--paper); }
.territ { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: .6rem; }
.territ .tt { font-family: var(--mono); font-size: .7rem; letter-spacing: .06em; text-transform: uppercase; border: 1.5px solid var(--gold); color: var(--gold); padding: .4em .7em; }

.partners { margin-top: 3rem; border-top: 1px solid rgba(255,255,255,.16); padding-top: 1.6rem; }
.partners .lab { font-family: var(--mono); font-size: .66rem; letter-spacing: .14em; text-transform: uppercase; color: rgba(244,234,219,.6); }
.partners .row { display: flex; flex-wrap: wrap; gap: 1.4rem 2.2rem; margin-top: 1rem; align-items: center; }
.partners .row span { font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: clamp(.9rem,1.8vw,1.15rem); color: rgba(244,234,219,.55); letter-spacing: -.01em; transition: color .2s; }
.partners .row span:hover { color: var(--paper); }

.contact { text-align: left; }
.contact h2 {
  font-family: var(--display); font-weight: 900; text-transform: uppercase;
  font-size: clamp(2.2rem, 7vw, 5.2rem); line-height: .92; letter-spacing: -.025em;
  margin: .6rem 0 0; color: var(--ink); text-wrap: balance; max-width: 16ch;
}
.contact h2 em { font-style: normal; color: var(--blue); }
.contact .cts { display: flex; flex-wrap: wrap; gap: 1rem 2.5rem; margin-top: 2.2rem; }
.cbox .lab { font-family: var(--mono); font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); display: block; margin-bottom: .3rem; }
.cbox a, .cbox span { font-size: 1.05rem; color: var(--text); border-bottom: 2px solid var(--blue); padding-bottom: 2px; }
.contact-note { color: var(--text-dim); max-width: 52ch; margin-top: 1.6rem; }
.social { display: flex; gap: 1rem; margin-top: 2rem; flex-wrap: wrap; }
.social a { font-family: var(--mono); font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; border: 1.5px solid var(--hairline); padding: .6em 1em; transition: background .2s, color .2s; }
.social a:hover { background: var(--blue); color: #fff; border-color: var(--blue); }

.site-footer { border-top: 2.5px solid var(--ink); padding-block: clamp(2.5rem,6vh,4rem); }
.foot-top { display: flex; justify-content: space-between; gap: 2rem; flex-wrap: wrap; align-items: flex-start; }
.foot-brand { display: flex; align-items: baseline; gap: .55rem; }
.foot-brand .mark { width:0;height:0;border-left:.5em solid transparent;border-right:.5em solid transparent;border-bottom:.86em solid var(--blue); display:inline-block; transform:translateY(.06em); font-size:1.2rem; }
.foot-brand .name { font-family: var(--display); font-weight: 900; text-transform: uppercase; font-size: 1.2rem; letter-spacing: -.02em; }
.foot-note { font-family: var(--mono); font-size: .7rem; line-height: 1.7; color: var(--muted); letter-spacing: .03em; max-width: 42ch; }
.foot-note b { color: var(--text-dim); font-weight: 400; }
.foot-meta { display: flex; flex-wrap: wrap; gap: 1rem 1.6rem; margin-top: 2rem; font-family: var(--mono); font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }

:root.motion .reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1); }
:root.motion .reveal.in { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  :root.motion .reveal { opacity: 1; transform: none; }
  .band { transform: rotate(-1.2deg); }
}

.admin-bar .site-header { top: 32px; }
@media screen and (max-width: 782px) { .admin-bar .site-header { top: 46px; } }

.page-content { padding-top: clamp(7rem, 16vh, 10rem); padding-bottom: var(--sect); }
.page-content .entry-title { font-family: var(--display); font-weight: 900; text-transform: uppercase; color: var(--ink); font-size: clamp(2rem,5vw,3.2rem); line-height: .98; letter-spacing: -.02em; margin-bottom: 1.4rem; }
.entry-content { max-width: 68ch; }
.entry-content p { margin: 0 0 1.1rem; color: var(--text-dim); }
.entry-content a { color: var(--blue); text-decoration: underline; text-underline-offset: 2px; }
.entry-content h2, .entry-content h3 { font-family: var(--display); text-transform: uppercase; color: var(--ink); margin: 2rem 0 .8rem; }

.brand .custom-logo-link { display: inline-flex; align-items: center; }
.brand .custom-logo { height: 42px; width: auto; display: block; }