@font-face { font-family:"Cronic Sans"; src:local("Helvetica Neue"),local("Arial"); font-display:swap; }
:root { --work-blue:#72dcff; --work-white:#f4f3ef; --work-ink:#050607; --work-pad:clamp(1rem,2.5vw,2.8rem); color-scheme:dark; }
* { box-sizing:border-box; }
html { overflow-x:hidden; scroll-behavior:smooth; background:var(--work-ink); }
body { margin:0; overflow-x:hidden; background:radial-gradient(circle at 84% 3%,rgba(49,130,255,.12),transparent 25rem),var(--work-ink); color:var(--work-white); font-family:"Cronic Sans","Helvetica Neue",Arial,sans-serif; font-size:16px; line-height:1.25; -webkit-font-smoothing:antialiased; }
.internal-menu { overflow:hidden; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
img { display:block; max-width:100%; }
.work-header__logo { width:clamp(6.5rem,8vw,8.5rem); }
.work-header__logo img { width:100%; }
.work-header.internal-header { background:linear-gradient(180deg,#050607 0 76%,rgba(5,6,7,.82) 88%,transparent); mix-blend-mode:normal; }
.work-header>p span { color:var(--work-blue); }
.work-progress { position:fixed; z-index:130; top:0; left:0; width:100%; height:2px; background:rgba(255,255,255,.08); }
.work-progress span { display:block; width:100%; height:100%; background:var(--work-blue); box-shadow:0 0 1.1rem rgba(114,220,255,.7); transform:scaleX(0); transform-origin:left; }
.work-eyebrow { margin:0; color:rgba(244,243,239,.56); font-size:.5rem; font-weight:500; letter-spacing:.2em; }

.work-hero { position:relative; display:grid; min-height:100svh; grid-template-columns:minmax(22rem,1.12fr) minmax(24rem,.88fr); gap:clamp(.8rem,1.35vw,1.4rem); overflow:hidden; padding:clamp(6.8rem,9vw,8.5rem) var(--work-pad) var(--work-pad); isolation:isolate; }
.work-hero::before { position:absolute; z-index:-1; top:-20rem; right:-10rem; width:48rem; height:48rem; border-radius:50%; background:radial-gradient(circle,rgba(29,83,255,.2),rgba(23,103,255,.04) 35%,transparent 68%); content:""; filter:blur(1rem); pointer-events:none; }
.work-hero__intro,.work-hero__feature { position:relative; min-height:min(77svh,52rem); overflow:hidden; border:0; box-shadow:inset 0 0 0 1px rgba(255,255,255,.16); }
.work-hero__intro { display:flex; flex-direction:column; padding:clamp(1.5rem,3vw,3.5rem); border-radius:2.5rem 2.5rem 11rem 2.5rem; background:linear-gradient(145deg,#f4f3ef,#d7d5d2); color:#0b0d0f; }
.work-hero__intro::after { position:absolute; right:-1px; bottom:-1px; width:34%; aspect-ratio:1; border-top:1px solid rgba(11,13,15,.16); border-left:1px solid rgba(11,13,15,.16); border-radius:100% 0 0; content:""; }
.work-hero__brandline { display:flex; justify-content:space-between; align-items:center; font-size:.76rem; letter-spacing:.12em; }
.work-hero__brandline i { color:#174fff; font-size:.55rem; font-style:normal; }
.work-hero__intro>.work-eyebrow { margin-top:auto; color:rgba(11,13,15,.54); }
.work-hero h1 { margin:1.1rem 0 1.5rem; font-size:clamp(4.2rem,8.1vw,9rem); font-weight:420; letter-spacing:-.075em; line-height:.77; }
.work-hero h1 span,.work-hero h1 em { display:block; }
.work-hero h1 em { color:#174fff; font-style:normal; }
.work-hero__copy { width:min(27rem,72%); margin:0 0 clamp(2rem,5vw,4.7rem); color:rgba(11,13,15,.6); font-size:clamp(.98rem,1.3vw,1.22rem); line-height:1.48; }
.work-hero__meta { display:flex; justify-content:space-between; gap:2rem; border-top:1px solid rgba(11,13,15,.2); padding-top:1rem; font-size:.48rem; letter-spacing:.15em; }
.work-hero__feature { display:block; border-radius:2.5rem 2.5rem 2.5rem 10rem; background:#090b10; transform:translateZ(0); }
.work-hero__feature::after { position:absolute; inset:0; background:linear-gradient(180deg,rgba(4,6,10,.06) 35%,rgba(4,6,10,.88)),linear-gradient(120deg,rgba(31,80,255,.12),transparent 55%); content:""; }
.work-hero__feature img { width:100%; height:100%; object-fit:cover; filter:saturate(.76) contrast(1.08) brightness(.75); transition:filter .7s,transform 1.1s cubic-bezier(.16,1,.3,1); }
.work-hero__feature-glow { position:absolute; z-index:1; top:6%; right:-18%; width:82%; height:64%; border-radius:50%; background:radial-gradient(ellipse,rgba(194,236,255,.78),rgba(38,102,255,.45) 20%,rgba(25,47,255,.08) 54%,transparent 70%); mix-blend-mode:screen; filter:blur(1.8rem); transform:rotate(-33deg); opacity:.68; transition:opacity .7s,transform 1s; }
.work-hero__feature p { position:absolute; z-index:2; right:clamp(1.3rem,2.5vw,2.7rem); bottom:clamp(1.3rem,2.5vw,2.7rem); left:clamp(1.3rem,2.5vw,2.7rem); display:grid; grid-template-columns:1fr auto; align-items:end; margin:0; }
.work-hero__feature p span { grid-column:1/-1; margin-bottom:.65rem; color:var(--work-blue); font-size:.48rem; letter-spacing:.17em; }
.work-hero__feature p strong { font-size:clamp(2.2rem,4vw,4.8rem); font-weight:420; letter-spacing:-.06em; }
.work-hero__feature p i { color:var(--work-blue); font-size:1.5rem; font-style:normal; transition:transform .35s; }
.work-hero__feature:hover img,.work-hero__feature:focus-visible img { filter:saturate(1) contrast(1.08) brightness(.88); transform:scale(1.045); }
.work-hero__feature:hover .work-hero__feature-glow,.work-hero__feature:focus-visible .work-hero__feature-glow { opacity:.92; transform:rotate(-27deg) scale(1.08); }
.work-hero__feature:hover p i,.work-hero__feature:focus-visible p i { transform:translate(.25rem,-.25rem); }

.work-index { padding:clamp(6rem,10vw,11rem) var(--work-pad) clamp(7rem,11vw,12rem); }
.work-index__header { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(18rem,.75fr); gap:6vw; align-items:end; margin-bottom:clamp(4rem,8vw,7.5rem); }
.work-index__header h2 { margin:1.2rem 0 0; font-size:clamp(4rem,9vw,10rem); font-weight:420; letter-spacing:-.08em; line-height:.78; }
.work-index__header h2 em { color:var(--work-blue); font-style:normal; }
.work-index__header>p { margin:0; color:rgba(244,243,239,.58); font-size:clamp(1rem,1.38vw,1.3rem); line-height:1.6; }
.work-filters { display:flex; flex-wrap:wrap; gap:.45rem; margin-bottom:clamp(1rem,1.7vw,1.6rem); }
.work-filters button { border:1px solid rgba(244,243,239,.18); border-radius:999px; padding:.68rem 1rem; background:transparent; color:rgba(244,243,239,.58); font-size:.48rem; letter-spacing:.14em; cursor:pointer; transition:border-color .3s,background-color .3s,color .3s,transform .3s; }
.work-filters button span { margin-left:.5rem; color:var(--work-blue); }
.work-filters button:hover,.work-filters button:focus-visible,.work-filters button.is-active { border-color:var(--work-blue); outline:0; background:var(--work-blue); color:#061014; transform:translateY(-.1rem); }
.work-filters button.is-active span { color:#061014; }

.work-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,15.5rem),1fr)); grid-auto-flow:dense; grid-auto-rows:clamp(10rem,14vw,13.5rem); gap:clamp(.72rem,1.15vw,1.2rem); }
.work-card { position:relative; grid-row:span 2; min-width:0; overflow:hidden; border:0; border-radius:2.2rem; background:#090b0f; box-shadow:inset 0 0 0 1px rgba(244,243,239,.14); isolation:isolate; opacity:0; transform:translateY(2.5rem); -webkit-mask-image:-webkit-radial-gradient(white,black); transition:opacity .7s var(--reveal-delay,0s),transform .8s var(--reveal-delay,0s) cubic-bezier(.16,1,.3,1),box-shadow .4s,filter .4s; }
.work-card::before { position:absolute; z-index:4; inset:0; border:1px solid rgba(114,220,255,.16); border-radius:inherit; box-shadow:inset 0 0 .45rem rgba(114,220,255,.08); content:""; opacity:.55; pointer-events:none; transition:border-color .42s,box-shadow .5s,opacity .42s; }
.work-card::after { position:absolute; z-index:1; inset:0; border-radius:inherit; background:radial-gradient(circle at 50% 64%,rgba(178,233,255,.62),rgba(66,136,255,.48) 17%,rgba(25,61,255,.24) 37%,transparent 70%); content:""; opacity:0; pointer-events:none; transform:scale(.82); transition:opacity .5s,transform .7s cubic-bezier(.16,1,.3,1); }
.work-card.is-visible { opacity:1; transform:none; }
.work-card[hidden] { display:none; }
.work-card--wide { grid-column:span 2; }
.work-card--tall { grid-row:span 3; }
.work-card--shape-a { border-radius:2.2rem 2.2rem 7.5rem 2.2rem; }
.work-card--shape-b { --top-left-safe:clamp(4.7rem,6.3vw,7.2rem); border-radius:7.5rem 2.2rem 2.2rem 2.2rem; }
.work-card--shape-c { --top-right-safe:clamp(4.7rem,6.3vw,7.2rem); border-radius:2.2rem 8rem 2.2rem 2.2rem; }
.work-card--shape-d { border-radius:2.2rem 2.2rem 2.2rem 8rem; }
.work-card--shape-e { border-radius:2.2rem 2.2rem 8.5rem 3.8rem / 2.2rem 2.2rem 6.2rem 3.8rem; }
.work-card--shape-f { --top-left-safe:clamp(4.2rem,5.8vw,6.7rem); border-radius:6.8rem 2.2rem 4.6rem 2.2rem / 5rem 2.2rem 3.6rem 2.2rem; }
.work-card__media { position:absolute; inset:0; overflow:hidden; background:radial-gradient(circle at 72% 22%,rgba(64,119,255,.1),transparent 42%),#05070a; }
.work-card__media::after { position:absolute; inset:0; background:linear-gradient(180deg,rgba(2,4,7,.02) 36%,rgba(2,4,7,.88) 100%),linear-gradient(120deg,rgba(11,33,68,.12),transparent 54%); content:""; transition:background .45s; }
.work-card img { width:100%; height:100%; padding:clamp(.9rem,1.4vw,1.6rem); object-fit:contain; object-position:center 42%; opacity:.82; mix-blend-mode:screen; filter:saturate(.72) contrast(1.02) brightness(.86); transform:scale(var(--logo-scale,.94)) translate3d(calc(var(--card-x,0) * -.45),calc(var(--card-y,0) * -.45),0); transition:opacity .5s,filter .55s,transform .9s cubic-bezier(.16,1,.3,1); }
.work-card[data-project="tedesco-marina"],.work-card[data-project="imbranet"] { --logo-scale:1.14; }
.work-card[data-project="ilhas-fiji"] { --logo-scale:1.06; }
.work-card__grain { position:absolute; z-index:1; inset:0; background:repeating-linear-gradient(0deg,rgba(255,255,255,.018) 0 1px,transparent 1px 4px); mix-blend-mode:soft-light; pointer-events:none; }
.work-card__content { position:absolute; z-index:2; inset:0; display:flex; flex-direction:column; justify-content:flex-end; padding:clamp(1.25rem,1.9vw,1.9rem); }
.work-card__content::before { position:absolute; z-index:-1; right:0; bottom:0; left:0; height:42%; background:linear-gradient(180deg,transparent,rgba(3,7,12,.9) 62%,rgba(3,6,10,.98)); content:""; opacity:.78; transition:opacity .45s; }
.work-card__top { position:absolute; top:clamp(1.25rem,1.9vw,1.9rem); right:var(--top-right-safe,clamp(1.25rem,1.9vw,1.9rem)); left:var(--top-left-safe,clamp(1.25rem,1.9vw,1.9rem)); display:flex; justify-content:space-between; gap:1rem; color:rgba(255,255,255,.68); font-size:.44rem; letter-spacing:.15em; transition:opacity .4s; }
.work-card__top span:first-child { color:var(--work-blue); }
.work-card h3 { max-width:92%; margin:0; font-size:clamp(1.65rem,2.6vw,3.25rem); font-weight:420; letter-spacing:-.055em; line-height:.92; text-wrap:balance; }
.work-card__bottom { display:flex; justify-content:space-between; gap:1rem; align-items:flex-end; margin-top:.95rem; padding-top:.8rem; border-top:1px solid rgba(255,255,255,.25); }
.work-card__bottom span { max-width:82%; color:rgba(255,255,255,.6); font-size:.44rem; letter-spacing:.12em; line-height:1.45; text-transform:uppercase; }
.work-card__bottom i { color:var(--work-blue); font-size:1rem; font-style:normal; transition:transform .35s; }
.work-card--shape-a .work-card__content,.work-card--shape-e .work-card__content { padding-right:clamp(1.65rem,2.6vw,2.8rem); padding-bottom:clamp(1.55rem,2.3vw,2.5rem); }
.work-card--shape-d .work-card__content { padding-left:clamp(1.9rem,3.2vw,3.7rem); padding-bottom:clamp(1.55rem,2.3vw,2.5rem); }
.work-card:hover,.work-card:focus-visible { outline:0; box-shadow:inset 0 0 1.6rem rgba(65,154,255,.16),0 0 2.8rem rgba(55,136,255,.24); filter:drop-shadow(0 0 .45rem rgba(114,220,255,.34)) drop-shadow(0 0 1.65rem rgba(35,105,255,.22)); }
.work-card:hover::before,.work-card:focus-visible::before { border-color:rgba(156,234,255,.96); box-shadow:inset 0 0 .7rem rgba(114,220,255,.46),0 0 .55rem rgba(92,191,255,.62); opacity:1; }
.work-card:hover::after,.work-card:focus-visible::after { opacity:1; transform:scale(1.08); }
.work-card:hover img,.work-card:focus-visible img { opacity:.62; filter:saturate(.62) contrast(1.03) brightness(.76); transform:scale(calc(var(--logo-scale,.94) - .08)) translate3d(calc(var(--card-x,0) * .35),calc(var(--card-y,0) * .35),0); }
.work-card:hover .work-card__media::after,.work-card:focus-visible .work-card__media::after { background:linear-gradient(180deg,rgba(2,4,7,.12) 20%,rgba(2,4,7,.72) 100%); }
.work-card:hover .work-card__content::before,.work-card:focus-visible .work-card__content::before { opacity:.92; }
.work-card:hover .work-card__top,.work-card:focus-visible .work-card__top { opacity:.22; }
.work-card:hover h3,.work-card:focus-visible h3 { color:#fff; text-shadow:0 0 1.5rem rgba(114,220,255,.7); }
.work-card:hover .work-card__bottom,.work-card:focus-visible .work-card__bottom { border-color:rgba(160,230,255,.7); }
.work-card:hover .work-card__bottom span,.work-card:focus-visible .work-card__bottom span { color:rgba(255,255,255,.86); }
.work-card:hover .work-card__bottom i,.work-card:focus-visible .work-card__bottom i { transform:translate(.22rem,-.22rem); }

.work-footer { display:grid; grid-template-columns:1fr auto; gap:3rem; align-items:end; margin:0 var(--work-pad); border-top:1px solid rgba(244,243,239,.2); padding:clamp(3rem,5vw,5rem) 0; }
.work-footer p { display:flex; gap:clamp(1rem,4vw,5rem); margin:0; color:rgba(244,243,239,.48); font-size:.48rem; letter-spacing:.14em; }
.work-footer a { font-size:clamp(1.65rem,3.2vw,3.6rem); font-weight:420; letter-spacing:-.05em; transition:color .3s; }
.work-footer a i { color:var(--work-blue); font-style:normal; }
.work-hero h1 em,
.work-index__header h2 em { font-family:Georgia,"Times New Roman",serif; font-size:.88em; font-style:italic; font-weight:400; letter-spacing:-.055em; }
.work-footer a:hover,.work-footer a:focus-visible { color:var(--work-blue); outline:0; }

@media(max-width:980px){
  .work-hero{grid-template-columns:1fr;min-height:auto}.work-hero__intro,.work-hero__feature{min-height:min(72svh,44rem)}
  .work-hero__intro{border-radius:2rem 2rem 8rem 2rem}.work-hero__feature{border-radius:2rem 2rem 2rem 8rem}
  .work-index__header{grid-template-columns:1fr}.work-index__header>p{width:min(36rem,100%);margin-left:auto}
  .work-footer{grid-template-columns:1fr}.work-footer a{justify-self:start}
}
@media(max-width:620px){
  .work-hero{padding-top:6rem}.work-hero__intro,.work-hero__feature{min-height:66svh}.work-hero__intro{border-radius:1.65rem 1.65rem 5.5rem 1.65rem;padding:1.4rem}.work-hero__feature{border-radius:1.65rem 1.65rem 1.65rem 5.5rem}
  .work-hero h1{font-size:clamp(3.15rem,16.2vw,5.2rem)}.work-hero__copy{width:88%;font-size:.96rem}.work-hero__meta{font-size:.41rem}
  .work-hero__feature-glow{display:none}
  .work-index__header h2{font-size:clamp(3.5rem,18vw,6rem)}.work-index__header>p{margin-left:0}
  .work-grid{grid-template-columns:1fr;grid-auto-rows:10rem}.work-card--wide{grid-column:span 1}.work-card--tall{grid-row:span 3}
  .work-card{border-radius:1.65rem}.work-card--shape-a{border-radius:1.65rem 1.65rem 5.5rem 1.65rem}.work-card--shape-b{--top-left-safe:4.4rem;border-radius:5.5rem 1.65rem 1.65rem 1.65rem}.work-card--shape-c{--top-right-safe:4.4rem;border-radius:1.65rem 5.5rem 1.65rem 1.65rem}.work-card--shape-d{border-radius:1.65rem 1.65rem 1.65rem 5.5rem}.work-card--shape-e{border-radius:1.65rem 1.65rem 5.8rem 2.7rem / 1.65rem 1.65rem 4.4rem 2.7rem}.work-card--shape-f{--top-left-safe:4.1rem;border-radius:5rem 1.65rem 3.4rem 1.65rem / 3.8rem 1.65rem 2.8rem 1.65rem}
  .work-card img{padding:1.15rem;transform:scale(.92)}
  .work-footer p{flex-direction:column;gap:.65rem}.work-footer a{font-size:1.8rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.work-card,.work-card img,.work-hero__feature img,.work-hero__feature-glow{transition-duration:.01ms}.work-card{opacity:1;transform:none}}
