:root { --ink:#111; --paper:#f8f8f6; --mist:#d9d9d4; --accent:#2d4b72; font-family:Outfit,system-ui,sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; overflow-x:hidden; } a { color:inherit; text-decoration:none; }
.topbar { position:fixed; z-index:10; top:0; left:0; width:100%; display:flex; align-items:center; justify-content:space-between; padding:1.35rem 2rem; mix-blend-mode:multiply; }
.monogram,.eyebrow,.project-code,footer { font:500 .68rem/1 "DM Mono",monospace; letter-spacing:.06em; }.nav-links { display:flex; gap:1.1rem; margin-left:auto; margin-right:1.5rem; font-size:.8rem; }.nav-links a { opacity:.62; transition:opacity .2s; }.nav-links a:hover { opacity:1; }
.language-switch { width:76px; height:32px; position:relative; display:flex; border:1px solid rgba(17,17,17,.13); border-radius:999px; background:rgba(255,255,255,.34); backdrop-filter:blur(16px) saturate(170%); -webkit-backdrop-filter:blur(16px) saturate(170%); box-shadow:inset 0 1px rgba(255,255,255,.8),0 7px 20px rgba(0,0,0,.08); padding:3px; }
.switch-pill { position:absolute; top:3px; left:3px; width:34px; height:24px; border-radius:99px; background:rgba(255,255,255,.78); box-shadow:0 2px 7px rgba(0,0,0,.14),inset 0 1px #fff; transition:transform .35s cubic-bezier(.2,.8,.2,1); }.language-switch.en .switch-pill { transform:translateX(34px); }.lang { z-index:1; flex:1; border:0; background:transparent; color:#444; padding:0; font:500 .6rem "DM Mono",monospace; cursor:pointer; }
.hero { min-height:100svh; padding:7rem 2rem 2rem; position:relative; display:flex; align-items:center; justify-content:center; background:#fff; }.hero-index { position:absolute; top:7rem; left:2rem; color:#8d8d88; }.hero-word { display:flex; justify-content:center; width:100%; font-size:clamp(3.1rem,12.8vw,14rem); font-weight:600; letter-spacing:-.105em; line-height:.8; }.hero-word span { display:inline-block; animation:rise .8s both; animation-delay:calc(var(--i, 1) * 60ms); }.hero-word span:nth-child(2){--i:2}.hero-word span:nth-child(3){--i:3}.hero-word span:nth-child(4){--i:4}.hero-word span:nth-child(5){--i:5}.hero-word span:nth-child(6){--i:6}.hero-word span:nth-child(7){--i:7}.hero-word span:nth-child(8){--i:8}@keyframes rise{from{opacity:0;transform:translateY(32px);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.message-hero { height:260svh; width:100%; position:relative; display:block; background-color:#fbfbfa; background-image:radial-gradient(circle,rgba(33,33,33,.16) 1px,transparent 1.4px); background-size:40px 40px; }.message-sticky { position:sticky; top:0; width:100%; height:100svh; overflow:hidden; display:grid; place-items:center; }.message-quote { position:absolute; top:11.5%; width:100%; text-align:center; color:#747477; transition:opacity .1s linear; }.message-quote em { display:block; font-family:"Playfair Display",serif; font-size:clamp(1.1rem,1.8vw,1.9rem); }.message-quote span,.message-scroll { display:block; margin-top:.7rem; font:500 clamp(.62rem,.8vw,.78rem) "DM Mono",monospace; letter-spacing:.25em; text-transform:uppercase; }.message-word { position:relative; z-index:1; font-size:clamp(4.5rem,14vw,15rem); font-weight:600; letter-spacing:-.11em; line-height:.78; transform:scale(1); transform-origin:50% 50%; will-change:transform,opacity; }.message-scroll { position:absolute; bottom:7%; width:100%; text-align:center; color:#77777b; transition:opacity .1s linear; }.message-active .monogram,.message-active .nav-links { opacity:0; pointer-events:none; }.monogram,.nav-links { transition:opacity .25s ease; }
.hero-foot { position:absolute; display:flex; justify-content:space-between; align-items:end; bottom:2rem; left:2rem; right:2rem; color:#777; font-size:.85rem; }.scroll-cue { display:flex; gap:.6rem; align-items:center; font-size:.75rem; }.scroll-cue i { font-style:normal; font-size:1rem; }
.manifesto { min-height:100svh; background:#fbfbfa; color:var(--ink); padding:2rem; display:flex; flex-direction:column; justify-content:space-between; }.manifesto .eyebrow { color:#777; }.manifesto-copy { margin:auto; width:min(100%,1050px); }.muted { color:#8e8e8e; font-size:clamp(1rem,2vw,1.35rem); margin:0 0 1rem; }.manifesto h1,.projects-heading h2 { margin:0; font-size:clamp(3rem,8.6vw,9rem); font-weight:500; letter-spacing:-.08em; line-height:.9; }.manifesto em,.projects-heading em { font-family:"Playfair Display",serif; font-weight:500; }.pessoa-note { max-width:310px; margin:0; color:#777; font:400 .76rem/1.5 "DM Mono",monospace; }
.about { min-height:92svh; padding:7rem 2rem 2rem; background:#efefec; }.about-grid { max-width:1200px; margin:5rem auto 0; display:grid; grid-template-columns:1.1fr .9fr; gap:6rem; }.about h2 { margin:0; font-size:clamp(3.5rem,8vw,8.5rem); font-weight:500; letter-spacing:-.09em; line-height:.82; }.about-copy { max-width:465px; font-size:clamp(1.15rem,1.8vw,1.65rem); line-height:1.2; }.about-copy p:first-child { margin-top:0; }.about-copy p+ p { color:#777; }.skills { display:flex; flex-wrap:wrap; gap:.5rem; margin:2rem 0; }.skills span,.project-status { border:1px solid #bbb; border-radius:99px; padding:.35rem .6rem; font:500 .65rem "DM Mono",monospace; }.glass-link { display:inline-flex; align-items:center; gap:2.5rem; border:1px solid rgba(0,0,0,.12); border-radius:99px; background:rgba(255,255,255,.44); box-shadow:inset 0 1px #fff,0 10px 22px rgba(0,0,0,.08); backdrop-filter:blur(14px); padding:.75rem 1rem .75rem 1.2rem; font-size:.85rem; transition:transform .25s; }.glass-link:hover{transform:translateY(-3px)}.glass-link b{font-size:1.2rem;font-weight:400}
.projects { padding:2rem; background:#fff; }.projects-heading { max-width:1200px; margin:6rem auto 4rem; display:flex; align-items:end; justify-content:space-between; }.projects-heading h2 { font-size:clamp(3.6rem,7.2vw,7.5rem); }.projects-intro,.projects-heading p { color:#777; max-width:180px; font-size:.85rem; }.project { min-height:680px; max-width:1200px; margin:1.2rem auto; padding:1.5rem; border-radius:25px; position:relative; overflow:hidden; display:grid; grid-template-columns:1fr 1fr; align-items:end; }.project-dark { background:#121212; color:#fff; }.project-light { background:#e5e6e0; color:#171717; }.project-code { position:absolute; top:1.5rem; left:1.5rem; opacity:.65; }.project-content { z-index:2; max-width:390px; padding:1.2rem; }.project-type { font:500 .67rem "DM Mono",monospace; text-transform:uppercase; letter-spacing:.06em; opacity:.6; }.project h3 { font-size:clamp(3rem,5vw,5.5rem); font-weight:500; letter-spacing:-.08em; line-height:.84; margin:.7rem 0 1.2rem; }.project-content>p:not(.project-type) { line-height:1.35; font-size:.98rem; }.project-content a { display:inline-block; border-bottom:1px solid currentColor; padding-bottom:.2rem; margin-top:.5rem; font-size:.8rem; }.project-visual { position:absolute; inset:0 0 0 45%; }.visual-grid { background:radial-gradient(circle at 70% 35%,#5b6f8e 0,transparent 20%),linear-gradient(135deg,#1a1a1a,#111); }.dot { position:absolute; border-radius:50%; width:18px;height:18px;background:#fff;box-shadow:0 0 0 10px rgba(255,255,255,.08)}.d1{top:23%;left:28%}.d2{top:54%;left:58%;background:#9cb5e0}.d3{top:72%;left:24%}.line{position:absolute;height:1px;background:rgba(255,255,255,.5);transform-origin:left}.l1{top:27%;left:31%;width:31%;transform:rotate(31deg)}.l2{top:59%;left:27%;width:35%;transform:rotate(-24deg)}.visual-chart { display:flex; align-items:end; justify-content:center; gap:1.3rem; padding:0 10% 15%; }.chart-bar{width:15%;background:#1c1c1b;border-radius:20px 20px 0 0}.b1{height:24%}.b2{height:58%}.b3{height:42%}.b4{height:80%;background:var(--accent)}.chart-axis{position:absolute;left:12%;right:12%;bottom:15%;height:1px;background:#777}
.project-actions { display:flex; flex-wrap:wrap; gap:.7rem 1.15rem; margin-top:1.2rem; }.project-content .project-actions a { margin:0; font-size:.76rem; }.project-status { display:inline-block; margin-top:1.25rem; }
footer { padding:1.5rem 2rem; display:flex; justify-content:space-between; background:#111; color:#aaa; }footer a{color:#fff}
.hero { display:block; min-height:230svh; padding:0; background:#fff; }.hero-sticky { width:100%; min-height:100svh; position:sticky; top:0; overflow:hidden; display:grid; place-items:center; }.hero-index { top:7rem; }.hero-message { position:absolute; width:100%; text-align:center; opacity:1; transform:scale(1); transform-origin:50% 50%; will-change:transform,opacity; }.hero-message strong { display:block; font-size:clamp(3.5rem,13vw,15rem); font-weight:600; letter-spacing:-.115em; line-height:.78; }.floating { position:absolute; color:#a7a7a3; font:500 clamp(.6rem,1vw,.78rem) "DM Mono",monospace; letter-spacing:.08em; opacity:.28; animation:drift 7s ease-in-out infinite alternate; }.f-one { left:18%; top:-2.5rem; }.f-two { right:17%; bottom:-3.5rem; animation-delay:-2s; }.f-three { right:23%; top:10%; animation-delay:-4s; }@keyframes drift { to { transform:translate(10px,-13px); } }.hero-foot { z-index:2; }.project-visual { background:none !important; }.project-numbers { inset:0; overflow:hidden; pointer-events:none; }.project-numbers span { position:absolute; color:currentColor; font-weight:500; font-size:clamp(3rem,10vw,10rem); letter-spacing:-.09em; opacity:.055; animation:number-breathe 11s ease-in-out infinite alternate; }.project-numbers span:nth-child(1){top:12%;right:12%}.project-numbers span:nth-child(2){top:32%;right:34%;animation-delay:-3s}.project-numbers span:nth-child(3){right:9%;bottom:14%;animation-delay:-6s}.project-numbers span:nth-child(4){bottom:9%;right:42%;animation-delay:-9s}@keyframes number-breathe { to { opacity:.2; transform:translateY(-25px); } }.language-switch { width:86px; height:38px; padding:4px; isolation:isolate; overflow:hidden; border-color:rgba(255,255,255,.68); background:linear-gradient(135deg,rgba(255,255,255,.66),rgba(204,218,233,.25)); box-shadow:inset 0 1px 1px rgba(255,255,255,.95),inset 0 -1px 1px rgba(100,120,140,.08),0 12px 30px rgba(36,54,73,.14); cursor:pointer; }.language-switch::before { content:""; position:absolute; inset:-60% 22% 35% -36%; z-index:-1; border-radius:50%; background:rgba(255,255,255,.72); filter:blur(10px); transform:rotate(-25deg); }.switch-pill { top:4px; left:4px; width:37px; height:28px; background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(221,232,241,.55)); box-shadow:inset 0 1px rgba(255,255,255,1),0 4px 10px rgba(45,65,85,.15); }.language-switch.en .switch-pill { transform:translateX(40px); }.lang { color:rgba(27,40,52,.72); font-size:.62rem; }.lang.active { color:#14283b; text-shadow:0 1px rgba(255,255,255,.8); }
/* Controlos persistentes: vidro líquido com contraste suficiente sobre qualquer secção. */
.topbar{position:fixed;z-index:50;top:1.1rem;left:1.1rem;right:1.1rem;width:auto;padding:0;mix-blend-mode:normal;pointer-events:none}
.topbar .monogram,.topbar .nav-links,.topbar .language-switch{pointer-events:auto;border:1px solid rgba(255,255,255,.62);background:linear-gradient(135deg,rgba(13,38,58,.62),rgba(72,136,180,.33));box-shadow:inset 0 1px 1px rgba(255,255,255,.7),inset 0 -1px 1px rgba(4,20,34,.34),0 12px 30px rgba(13,28,42,.22);backdrop-filter:blur(25px) saturate(175%);-webkit-backdrop-filter:blur(25px) saturate(175%)}
.topbar .monogram{display:grid;place-items:center;width:48px;height:38px;border-radius:999px;color:#fff;font:600 .68rem/1 "DM Mono",monospace;letter-spacing:.08em;text-shadow:0 1px 8px rgba(0,0,0,.42)}
.topbar .nav-links{display:flex;align-items:center;gap:0;margin-left:auto;margin-right:.7rem;padding:3px;border-radius:999px}
.topbar .nav-links a{padding:.55rem .74rem;border-radius:999px;color:#fff;opacity:.92;font:500 .68rem/1 "DM Mono",monospace;letter-spacing:.04em;text-shadow:0 1px 8px rgba(0,0,0,.48);transition:background .2s ease,opacity .2s ease}
.topbar .nav-links a:hover{opacity:1;background:rgba(255,255,255,.18)}
.topbar .language-switch{width:88px;height:38px;padding:4px;overflow:hidden;border-radius:999px;cursor:pointer;isolation:isolate}
.topbar .language-switch::before{content:"";position:absolute;inset:-75% 20% 30% -40%;z-index:-1;border-radius:50%;background:rgba(255,255,255,.48);filter:blur(12px);transform:rotate(-25deg)}
.topbar .switch-pill{top:4px;left:4px;width:38px;height:28px;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(207,231,246,.62));box-shadow:inset 0 1px rgba(255,255,255,1),0 4px 11px rgba(5,25,42,.31)}
.topbar .language-switch.en .switch-pill{transform:translateX(42px)}
.topbar .lang{color:rgba(255,255,255,.82);font:600 .62rem "DM Mono",monospace;text-shadow:0 1px 7px rgba(0,0,0,.42)}
.topbar .lang.active{color:#173247;text-shadow:none}
.message-active .monogram,.message-active .nav-links{opacity:1;pointer-events:auto}
/* Refinamento visual: um vidro mais neutro e tipografia com espaço para respirar. */
.topbar .monogram,.topbar .nav-links,.topbar .language-switch{background:linear-gradient(135deg,rgba(28,33,38,.48),rgba(92,102,111,.24));border-color:rgba(255,255,255,.54);box-shadow:inset 0 1px 1px rgba(255,255,255,.65),inset 0 -1px 1px rgba(0,0,0,.24),0 12px 30px rgba(12,17,22,.18);backdrop-filter:blur(27px) saturate(125%);-webkit-backdrop-filter:blur(27px) saturate(125%)}
.topbar .language-switch::before{background:rgba(255,255,255,.32)}
.topbar .switch-pill{background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(222,225,228,.55))}
.topbar .lang.active{color:#28333b}
.message-word{color:#4e5052;font-size:clamp(3.8rem,12.5vw,13rem);font-weight:800;letter-spacing:.025em;line-height:.82}
.message-quote span,.message-scroll{letter-spacing:.16em}
.manifesto h1,.projects-heading h2,.about h2,.project h3,.hero-message strong{letter-spacing:-.045em}
.about-copy,.project-content>p:not(.project-type),.projects-intro,.projects-heading p,.pessoa-note{letter-spacing:normal;word-spacing:.02em}
.manifesto .muted{margin-bottom:2.15rem;line-height:1.25;letter-spacing:-.02em}
.manifesto h1{letter-spacing:-.035em;line-height:1.03}
.manifesto{height:340svh;min-height:0;padding:0;display:block;position:relative;overflow:clip}
.manifesto-sticky{position:sticky;top:0;height:100svh;overflow:hidden}
.manifesto-content{position:absolute;inset:0;padding:2rem;display:flex;flex-direction:column;justify-content:space-between;will-change:transform,opacity}
.manifesto-copy{margin:auto;width:min(100%,1050px)}
.manifesto h1 em{display:inline-block;will-change:transform,opacity}
.manifesto h1 em{color:#111;text-shadow:0 0 14px rgba(0,0,0,.16)}
.poem-stage{position:absolute;inset:0;display:grid;grid-template-columns:minmax(240px,.98fr) minmax(270px,1.02fr);grid-template-rows:1fr auto;align-items:center;column-gap:clamp(2rem,8vw,10rem);width:min(100%,1260px);margin:auto;padding:3.5rem 2rem;color:#242424;opacity:0;pointer-events:none;will-change:transform,opacity}
.poem-stage h2{grid-column:1;grid-row:1;margin:0;text-align:left;text-transform:uppercase;font:800 clamp(2.4rem,6vw,6.5rem)/.82 Outfit,sans-serif;letter-spacing:-.07em}
.poem-stage h2 span{display:block}
.poem-body{grid-column:2;grid-row:1;text-align:left;font:500 clamp(.84rem,1.12vw,1.04rem)/1.3 "Playfair Display",serif;letter-spacing:.005em}
.poem-body p{margin:0 0 .86rem}
.poem-credit{grid-column:2;grid-row:2;margin:0 0 .75rem;text-align:right;color:#777;font:500 .66rem "DM Mono",monospace;letter-spacing:.12em;text-transform:uppercase}
@media (max-width:700px){.poem-stage{display:flex;flex-direction:column;align-items:stretch;justify-content:center;gap:1.5rem;padding:2rem 1.4rem}.poem-stage h2{text-align:center;font-size:clamp(2.6rem,15vw,4.2rem)}.poem-body{text-align:center;font-size:clamp(.92rem,3.8vw,1.08rem)}.poem-credit{text-align:center;margin:0}}
@media (max-width:700px){.topbar{top:.75rem;left:.75rem;right:.75rem;padding:0}.topbar .monogram{width:43px;height:36px}.topbar .nav-links{display:flex;margin-right:.35rem}.topbar .nav-links a{padding:.55rem .52rem;font-size:.62rem}.topbar .language-switch{width:82px}.topbar .language-switch.en .switch-pill{transform:translateX(36px)}}
@media (prefers-reduced-motion:reduce){.floating,.project-numbers span{animation:none}.hero-intro,.hero-message{transform:none}}
@media (max-width:700px){.topbar{padding:1.15rem}.nav-links{display:none}.hero,.manifesto,.about,.projects{padding-left:1.15rem;padding-right:1.15rem}.hero{padding:0}.hero-index{left:1.15rem}.hero-foot{left:1.15rem;right:1.15rem}.hero-foot p{max-width:150px}.hero-intro h1{font-size:clamp(3.4rem,16vw,5.5rem)}.hero-message strong{font-size:18vw}.f-one{left:10%}.f-two{right:10%}.about-grid{grid-template-columns:1fr;gap:3rem;margin-top:3.5rem}.projects-heading{display:block;margin:4rem 0 2rem}.projects-heading p{margin-top:1rem}.project{min-height:570px;display:block;padding:1.2rem}.project-content{position:absolute;bottom:1.2rem;left:0}.project-visual{inset:4rem 0 36% 0}.visual-chart{padding-bottom:10%}footer{padding:1.2rem;font-size:.58rem}}
