@import url('https://fonts.googleapis.com/css2?family=Anton&family=Mrs+Saint+Delafield&family=Cormorant+Garamond:ital,wght@0,500;1,500&family=DM+Sans:wght@400;500;700&display=swap');
:root{--ivory:#F8F3EE;--warm:#FFFCF8;--brown:#2B1B17;--rose:#D6A8A0;--blush:#E8CCC5;--taupe:#B8A69C;--muted:#6f6462}
html{scroll-behavior:smooth}
body{background:var(--ivory);color:var(--brown);font-family:"DM Sans",sans-serif;-webkit-font-smoothing:antialiased}
.f-display{font-family:"Anton",sans-serif;text-transform:uppercase;letter-spacing:-.01em;line-height:1.02}
.f-script{font-family:"Mrs Saint Delafield",cursive;font-weight:400;text-transform:none}
.f-serif{font-family:"Cormorant Garamond",serif}
.eyebrow{font-size:.72rem;letter-spacing:.22em;text-transform:uppercase;font-weight:500}
:focus-visible{outline:2px solid var(--rose);outline-offset:3px}
/* nav */
.site-nav{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s,box-shadow .3s}
.site-nav.scrolled{background:rgba(248,243,238,.92);backdrop-filter:blur(8px);box-shadow:0 1px 0 rgba(43,27,23,.08)}
.nav-link{position:relative;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;padding:.4rem 0}
.nav-link::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:1.5px;background:var(--rose);transform:scaleX(0);transform-origin:left;transition:transform .35s}
.nav-link:hover::after,.nav-link.active::after{transform:scaleX(1)}
/* paper elements */
.tape{position:absolute;width:110px;height:30px;background:rgba(214,168,160,.72);box-shadow:0 1px 2px rgba(0,0,0,.06)}
.paper{background:var(--warm);box-shadow:0 18px 40px -18px rgba(43,27,23,.35),0 2px 6px rgba(43,27,23,.06)}
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.9rem 1.5rem;border:1px solid var(--brown);border-radius:999px;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;font-weight:500;transition:all .3s}
.btn:hover{background:var(--brown);color:var(--ivory)}
.btn-solid{background:var(--brown);color:var(--ivory)}
.btn-solid:hover{background:transparent;color:var(--brown)}
.btn[aria-disabled=true]{opacity:.45;pointer-events:none}
/* reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .9s ease,transform .9s ease}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}
/* cards */
.card{transition:transform .45s ease}
.card:hover{transform:translateY(-6px)}
.card .cover{transition:transform .7s ease}
.card:hover .cover{transform:scale(1.04)}
.placeholder{border:1px dashed var(--taupe);border-radius:12px;padding:1rem 1.2rem;color:var(--muted);font-style:italic;font-family:"Cormorant Garamond",serif;font-size:1.1rem}

.card-link::after{content:"";position:absolute;inset:0;z-index:10}
.card:focus-within{outline:2px solid var(--rose);outline-offset:6px;border-radius:12px}

/* --- Tipografia e espaçamentos (refinamento) --- */
h1.f-display,h2.f-display,h3.f-display,p.f-display{line-height:1.02!important;letter-spacing:.005em}
.hero-title{line-height:.9!important}
section[id]{scroll-margin-top:96px}
h2.f-display{margin-bottom:.15em}
h2.f-display + p,h2.f-display + div{margin-top:1.75rem!important}
.f-script{line-height:1.15;display:inline-block;margin-bottom:.35rem}
.card .cover .f-display{font-size:clamp(1.6rem,2.3vw,2rem)!important;line-height:1.16!important}
.card h3{margin-top:.6rem!important;line-height:1.2}
.card p{line-height:1.6}
.card .eyebrow{line-height:1.7}
#app h1.f-display{line-height:1.05!important;margin-top:1.25rem!important;margin-bottom:.5rem}
#app header .f-serif{margin-top:1.5rem!important;line-height:1.35}
#percurso h3{margin-bottom:.4rem}
#percurso .f-serif{line-height:1.3}
#skills .f-serif{line-height:1.25}
@media (max-width:767px){h2.f-display + p,h2.f-display + div{margin-top:1.25rem!important}section[id]{scroll-margin-top:72px}}

/* --- Galeria editorial de projetos --- */
.pj-card{display:flex;flex-direction:column;height:100%}
.pj-mat{position:relative;aspect-ratio:5/4;background:#EFE4DC;border-radius:14px;display:flex;align-items:center;justify-content:center;padding:15% 9% 12%;overflow:hidden}
.pj-card:nth-child(even) .pj-mat{background:#F3EAE3}
.pj-frame{position:relative;max-width:100%;max-height:100%;background:#FFFCF8;padding:8px;box-shadow:0 22px 40px -22px rgba(43,27,23,.45),0 2px 6px rgba(43,27,23,.08);transition:transform .6s ease;transform:rotate(-1.2deg)}
.pj-card:nth-child(even) .pj-frame{transform:rotate(1deg)}
.pj-card:hover .pj-frame{transform:rotate(0) translateY(-4px)}
.pj-frame img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.pj-frame .tape{width:72px;height:22px;top:-11px;left:50%;margin-left:-36px;transform:rotate(-3deg)}
.pj-empty{width:100%;height:100%;border:1px dashed var(--taupe);border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;text-align:center;color:var(--muted);background:rgba(255,252,248,.55)}
.pj-num{position:absolute;top:14px;left:18px;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:1.15rem;color:#ac786e;z-index:2}
.pj-uc{position:absolute;top:16px;right:18px;z-index:2}
.pj-title{font-family:"Cormorant Garamond",serif;font-weight:500;font-size:1.65rem;line-height:1.18;margin-top:.5rem}
.pj-btn-off{display:inline-flex;align-items:center;padding:.9rem 1.5rem;border:1px dashed var(--taupe);border-radius:999px;font-size:.75rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);cursor:not-allowed}