/* =========================================================
   PresenceUp · styles.css
   ========================================================= */

/* ---------- Fontes hospedadas no próprio site (não dependem do Google Fonts) ---------- */
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 300 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("assets/fonts/archivo-300-900-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Archivo";
  font-style: normal;
  font-weight: 300 900;
  font-stretch: 62% 125%;
  font-display: swap;
  src: url("assets/fonts/archivo-300-900-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Archivo Narrow";
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url("assets/fonts/archivo-narrow-500-700-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Archivo Narrow";
  font-style: normal;
  font-weight: 500 700;
  font-display: swap;
  src: url("assets/fonts/archivo-narrow-500-700-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url("assets/fonts/geist-300-600-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url("assets/fonts/geist-300-600-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Geist Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/geist-mono-400-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Geist Mono";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/geist-mono-400-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Geist Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/fonts/geist-mono-500-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Geist Mono";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("assets/fonts/geist-mono-500-latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Blog e páginas internas ---------- */
:root {
  --ink: #050505; --ink-3: #111317; --paper: #f2f2ee; --paper-2: #c9cac5; --mute: #92979f;
  --line: rgba(242, 242, 238, .12); --line-2: rgba(242, 242, 238, .22); --blue: #0896e4; --green: #5ab22a;
  --m: clamp(20px, 4.4vw, 72px);
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; overflow-x: clip; }
body.pu { margin: 0; background: var(--ink); color: var(--paper); font: 17px/1.65 "Geist", "Segoe UI", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
.pu img { max-width: 100%; height: auto; }
.pu a { color: inherit; }
.pu :focus-visible { outline: 2px solid var(--blue); outline-offset: 3px; }
.skip { position: fixed; left: 16px; top: 12px; z-index: 99; padding: 10px 14px; background: var(--paper); color: var(--ink); transform: translateY(-160%); }
.skip:focus { transform: none; }
.bmono { margin: 0; font: 12px/1.5 "Geist Mono", ui-monospace, Consolas, monospace; letter-spacing: .06em; text-transform: uppercase; color: var(--mute); }
.bgreen { color: var(--green) !important; }
.bdisplay { margin: 0; font-family: "Archivo", "Archivo Narrow", "Arial Narrow", Arial, sans-serif; font-weight: 800; font-stretch: 70%; text-transform: uppercase; line-height: .92; letter-spacing: -.004em; overflow-wrap: anywhere; }
.boutline { color: transparent; -webkit-text-stroke: 1.2px var(--paper); }
.bbtn { display: inline-flex; align-items: center; min-height: 52px; padding: 0 24px; border-radius: 2px; background: var(--paper); color: var(--ink) !important; font-weight: 500; font-size: 15px; text-decoration: none; transition: background-color .4s; }
.bbtn:hover { background: var(--green); }
.bbtn--line { min-height: 40px; padding: 0 16px; background: none; color: var(--paper) !important; box-shadow: inset 0 0 0 1px var(--line-2); font-size: 14px; }
.bbtn--line:hover { background: var(--paper); color: var(--ink) !important; }

.bhdr { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; gap: 28px; height: 72px; padding-inline: var(--m); background: rgba(5, 5, 5, .9); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: inset 0 -1px 0 var(--line); }
.admin-bar .bhdr { top: 32px; }
.bhdr__brand { display: inline-flex; align-items: center; gap: 12px; margin-right: auto; font-weight: 600; font-size: 17px; text-decoration: none; }
.bhdr__brand img { width: 30px; height: 30px; }
.bhdr__nav { display: flex; gap: 28px; }
.bhdr__nav a { font-size: 14px; color: var(--paper-2); text-decoration: none; }
.bhdr__nav a:hover { color: var(--paper); }

.bmain { padding: clamp(56px, 10vh, 120px) var(--m) clamp(64px, 10vh, 120px); max-width: 1440px; margin: 0 auto; }
.bhead { max-width: 1100px; margin-bottom: clamp(40px, 7vh, 80px); }
.bhead .bdisplay { margin-top: 16px; font-size: clamp(38px, 6vw, 96px); }
.blead { max-width: 34em; margin: 24px 0 0; color: var(--paper-2); font-size: clamp(17px, 1.4vw, 21px); }
.bactions { margin-top: 32px; }

.blist { list-style: none; margin: 0; padding: 0; box-shadow: inset 0 1px 0 var(--line); }
.bitem a { display: grid; grid-template-columns: 200px minmax(0, 1fr) auto; gap: 8px 32px; align-items: baseline; padding: 32px 0; box-shadow: inset 0 -1px 0 var(--line); text-decoration: none; }
.bitem__t { grid-column: 2; margin: 0; font-family: "Archivo", "Arial Narrow", Arial, sans-serif; font-weight: 700; font-stretch: 80%; text-transform: uppercase; font-size: clamp(22px, 2.4vw, 38px); line-height: 1; transition: color .3s; }
.bitem__x { grid-column: 2; margin: 6px 0 0; max-width: 46em; color: var(--mute); font-size: 15.5px; }
.bitem__more { grid-column: 3; grid-row: 1 / 3; align-self: center; font-size: 14px; color: var(--paper-2); background: linear-gradient(var(--green), var(--green)) 0 100% / 0 1px no-repeat; transition: background-size .5s; }
.bitem a:hover .bitem__t { color: var(--green); }
.bitem a:hover .bitem__more { background-size: 100% 1px; }
.bpager { margin-top: 40px; }
.bpager .nav-links { display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 15px; }
.bpager .current { color: var(--green); }

.barticle { max-width: 780px; margin: 0 auto; }
.barticle .bhead .bdisplay { font-size: clamp(34px, 4.6vw, 68px); }
.bthumb { margin: 0 0 48px; }
.bthumb img { width: 100%; border-radius: 4px; }
.bentry { color: var(--paper-2); }
.bentry > * { margin-block: 0 1.2em; }
.bentry h2, .bentry h3, .bentry h4 { margin: 2em 0 .6em; color: var(--paper); font-family: "Archivo", "Arial Narrow", Arial, sans-serif; font-weight: 700; font-stretch: 80%; text-transform: uppercase; line-height: 1.05; }
.bentry h2 { font-size: clamp(26px, 2.6vw, 38px); }
.bentry h3 { font-size: clamp(21px, 2vw, 28px); }
.bentry strong { color: var(--paper); }
.bentry a { color: var(--paper); text-decoration: underline; text-decoration-color: var(--green); text-underline-offset: 3px; }
.bentry ul, .bentry ol { padding-left: 1.2em; }
.bentry li { margin-bottom: .4em; }
.bentry li::marker { color: var(--green); }
.bentry blockquote { margin-inline: 0; padding-left: 20px; box-shadow: inset 2px 0 0 var(--green); color: var(--paper); font-size: 1.15em; }
.bentry img, .bentry figure { border-radius: 4px; }
.bentry table { width: 100%; border-collapse: collapse; font-size: 15px; }
.bentry th, .bentry td { padding: 10px 8px; text-align: left; box-shadow: inset 0 -1px 0 var(--line); }
.bentry hr { border: 0; height: 1px; background: var(--line); }

.bcta { display: grid; gap: 24px; justify-items: start; padding: clamp(72px, 12vh, 140px) var(--m); box-shadow: inset 0 1px 0 var(--line); }
.bcta .bdisplay { max-width: 14em; font-size: clamp(34px, 5vw, 80px); }
.bfoot { display: grid; gap: 8px; padding: 48px var(--m) 56px; box-shadow: inset 0 1px 0 var(--line); color: var(--paper-2); font-size: 14px; }
.bfoot p { margin: 0; }
.bfoot a { text-decoration: none; }
.bfoot .bhdr__brand { margin-bottom: 12px; }

@media (max-width: 767.98px) {
  .bhdr__nav { display: none; }
  .bhdr { height: 64px; gap: 12px; }
  .bitem a { grid-template-columns: 1fr; }
  .bitem__t, .bitem__x, .bitem__more { grid-column: 1; grid-row: auto; }
  .bitem__more { justify-self: start; margin-top: 8px; }
}

/* ---------- Seções das páginas internas ---------- */
.bsec { margin-top: clamp(56px, 9vh, 104px); }
.bsub { font-size: clamp(24px, 3vw, 40px); margin-bottom: clamp(28px, 4vh, 44px); }
.bcards { display: grid; gap: 1px; background: var(--line); }
.bcard { display: grid; align-content: start; gap: 10px; padding: clamp(24px, 3vw, 36px); background: var(--ink); }
.bcard__t { margin: 0; font-family: "Archivo", "Archivo Narrow", "Arial Narrow", Arial, sans-serif; font-weight: 700; font-stretch: 80%; text-transform: uppercase; font-size: clamp(20px, 2vw, 26px); line-height: 1.05; }
.bcard__x { margin: 0; color: var(--mute); font-size: 15.5px; }
.bsteps { list-style: none; margin: 0; padding: 0; display: grid; box-shadow: inset 0 1px 0 var(--line); }
.bstep { display: grid; gap: 8px; padding: clamp(22px, 3vh, 32px) 0; box-shadow: inset 0 -1px 0 var(--line); }
.bstep__t { margin: 0; font-family: "Archivo", "Archivo Narrow", "Arial Narrow", Arial, sans-serif; font-weight: 700; font-stretch: 80%; text-transform: uppercase; font-size: clamp(19px, 2vw, 26px); line-height: 1.05; }
.bstep__x { margin: 0; max-width: 46em; color: var(--mute); font-size: 15.5px; }
.bsteps + .bmono { margin-top: 24px; }

@media (min-width: 768px) {
  .bcards { grid-template-columns: repeat(3, 1fr); }
  .bstep { grid-template-columns: 90px minmax(0, 1fr); align-items: baseline; column-gap: 32px; }
  .bstep .bmono { grid-row: 1 / 3; }
  .bstep__t, .bstep__x { grid-column: 2; }
}
