@font-face { font-family:"Visby CF"; src:url("../fonts/VisbyCF-Light.woff") format("woff"); font-weight:300; font-display:swap; }
@font-face { font-family:"Visby CF"; src:url("../fonts/VisbyCF-Regular.woff") format("woff"); font-weight:400; font-display:swap; }
@font-face { font-family:"Visby CF"; src:url("../fonts/VisbyCF-Medium.woff") format("woff"); font-weight:500; font-display:swap; }
@font-face { font-family:"Visby CF"; src:url("../fonts/VisbyCF-DemiBold.woff") format("woff"); font-weight:600; font-display:swap; }
@font-face { font-family:"Visby CF"; src:url("../fonts/VisbyCF-Bold.woff") format("woff"); font-weight:700; font-display:swap; }
@font-face { font-family:"Visby CF"; src:url("../fonts/VisbyCF-ExtraBold.woff") format("woff"); font-weight:800 900; font-display:swap; }

:root {
  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-in-out: cubic-bezier(.76,0,.24,1);
  --ease-back: cubic-bezier(.34,1.56,.64,1);
  --ease-spring: cubic-bezier(.22,1.36,.36,1);
  --ease-expo: cubic-bezier(.16,1,.3,1);
  --ease-expo-in-out: cubic-bezier(.87,0,.13,1);
  color-scheme:dark; --ink:#141414; --paper:#f4f4f4; --blue:#013fc9; --cyan:#01f9de; --line:rgba(244,244,244,.2); --muted:rgba(244,244,244,.8); --sans:"Visby CF","Helvetica Neue",Arial,sans-serif; --page-progress:0; --pointer-x:50vw; --pointer-y:50vh; --hero-x:0px; --hero-y:0px; --hero-scroll:0px;
  --space-1:8px; --space-2:16px; --space-3:24px; --space-4:32px; --space-5:40px; --space-6:48px; --space-7:56px; --space-8:64px; --space-10:80px; --space-12:96px; --space-16:128px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }

/* ── Preloader ── */
.preloader { position:fixed; inset:0; z-index:1000; display:flex; align-items:center; justify-content:center; background:var(--ink); }
.preloader-logo { width:clamp(120px,20vw,220px); height:auto; animation:preloader-spin 2s cubic-bezier(.16,1,.3,1) infinite; }
.preloader.is-done { animation:preloader-exit .8s var(--ease-expo-in-out) forwards; }
@keyframes preloader-spin { from { transform:rotate(0deg) scale(.9); opacity:.7; } to { transform:rotate(360deg) scale(1); opacity:1; } }
@keyframes preloader-exit { 0% { opacity:1; } 100% { opacity:0; pointer-events:none; visibility:hidden; } }

/* ── Custom Cursor ── */
.cursor { position:fixed; z-index:999; top:0; left:0; width:8px; height:8px; border-radius:50%; background:var(--cyan); pointer-events:none; transform:translate(-50%,-50%); transition:width .3s var(--ease-back),height .3s var(--ease-back),background .3s; mix-blend-mode:difference; }
.cursor-follower { position:fixed; z-index:998; top:0; left:0; width:40px; height:40px; border-radius:50%; border:1px solid rgba(1,249,222,.5); pointer-events:none; transform:translate(-50%,-50%); transition:width .4s var(--ease-back),height .4s var(--ease-back),border-color .3s,opacity .3s; }
.cursor.is-hover { width:48px; height:48px; background:var(--paper); }
.cursor-follower.is-hover { width:64px; height:64px; border-color:var(--paper); opacity:.4; }
.cursor.has-label { width:94px; height:94px; display:flex; align-items:center; justify-content:center; background:var(--cyan); color:var(--ink); mix-blend-mode:normal; }
.cursor-label { opacity:0; max-width:76px; font-family:var(--sans); font-size:.58rem; font-weight:800; line-height:1.1; letter-spacing:.12em; text-align:center; text-transform:uppercase; transition:opacity .2s; }
.cursor.has-label .cursor-label { opacity:1; }
@media (pointer:coarse),(hover:none) { .cursor,.cursor-follower { display:none!important; } }

/* ── Skip Link ── */
.skip-link { position:fixed; z-index:200; top:-100%; left:16px; padding:14px 24px; background:var(--cyan); color:var(--ink); font-weight:800; font-size:.85rem; letter-spacing:.04em; text-decoration:none; border-radius:0 0 12px 12px; box-shadow:0 4px 20px rgba(1,249,222,.4); transition:top .2s ease; }
.skip-link:focus { top:0; outline:3px solid var(--paper); outline-offset:2px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media (forced-colors:active) { .skip-link { border:2px solid; } a:focus-visible { outline:3px solid Highlight; } .top-cta { border:2px solid; } .contact-cta { border:2px solid; } }

body { margin:0; min-width:320px; overflow-x:hidden; background:var(--ink); color:var(--paper); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
a { color:inherit; }
a:focus-visible { outline:3px solid var(--cyan); outline-offset:5px; border-radius:4px; }
button:focus-visible,[tabindex]:focus-visible { outline:3px solid var(--cyan); outline-offset:5px; border-radius:4px; }
main { position:relative; width:100%; overflow:visible; }

/* ── Scroll Progress ── */
@property --glow-intensity { syntax:'<number>'; initial-value:0; inherits:false; }
.scroll-progress { position:fixed; z-index:100; left:0; top:0; width:100%; height:3px; background:var(--cyan); transform:scaleX(var(--page-progress)); transform-origin:left; pointer-events:none; box-shadow:0 0 calc(18px * var(--glow-intensity)) rgba(1,249,222,.8); animation:glow-pulse 2s ease-in-out infinite alternate; }
@keyframes glow-pulse { from { --glow-intensity:.4; } to { --glow-intensity:1; } }
.cursor-light { position:fixed; z-index:90; left:var(--pointer-x); top:var(--pointer-y); width:420px; height:420px; border-radius:50%; background:radial-gradient(circle,rgba(1,249,222,.065),transparent 68%); transform:translate(-50%,-50%); pointer-events:none; mix-blend-mode:screen; }

/* ── Hero ── */
.hero-sidecopy,.hero-foot,.hero-ticker { opacity:0; transform:translateY(28px); transition:opacity .8s var(--ease-out),transform .9s var(--ease-out); }
.motion-ready .hero-sidecopy { transition-delay:.55s; }
.motion-ready .hero-foot { transition-delay:.75s; }
.motion-ready .hero-ticker { transition-delay:.95s; }
.motion-ready .hero-sidecopy,.motion-ready .hero-foot,.motion-ready .hero-ticker { opacity:1; transform:none; }
.hero h1 > span:not(.char-wrap) { opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease-out),transform .8s var(--ease-back); }
.motion-ready .hero h1 > span:not(.char-wrap) { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce) {
  .hero h1 span, .hero-sidecopy, .hero-foot, .hero-ticker { opacity: 1 !important; transform: none !important; transition: none !important; }
}

/* ── Entrada das seções ── */
.entry-reveal { opacity:0; transform:translateY(38px); transition:opacity .75s var(--ease-out),transform .85s var(--ease-out); }
.entry-reveal.entry-reveal-left { transform:translateX(-38px); }
.entry-reveal.entry-reveal-right { transform:translateX(38px); }
.entry-reveal.entry-reveal-scale { transform:scale(.94); }
.entry-reveal.is-visible { opacity:1; transform:none; }
.service-list .service:nth-child(2) { transition-delay:.1s; }
.service-list .service:nth-child(3) { transition-delay:.2s; }
.service-list .service:nth-child(4) { transition-delay:.3s; }
/* Os cards entram depois que a seção chega à leitura, não assim que seu topo toca a viewport. */
@media (prefers-reduced-motion: reduce) {
  .entry-reveal { opacity:1 !important; transform:none !important; transition:none !important; }
}


/* Char-by-char decode */
.char-wrap {
  display:inline-block;
  opacity:0;
  transform:translateY(100%) rotate(6deg);
  transition:opacity .5s var(--ease-out),transform .6s var(--ease-back);
  will-change:transform,opacity;
}
.char-wrap.is-in {
  opacity:1;
  transform:translateY(0) rotate(0deg);
}
.char-wrap.decode-char {
  color:var(--cyan);
  font-weight:400;
}

/* GSAP escreve transformações inline; esta camada evita que a transição CSS concorra com as timelines. */
.gsap-ready .entry-reveal { transition:none; }

/* ── Revealed state ── */
.revealed { opacity:1!important; transform:none!important; filter:none!important; letter-spacing:inherit!important; }

/* ── Container ── */
.container { width:min(calc(100% - 48px),1280px); margin-inline:auto; }
.kicker,.index { margin:0; font-size:.72rem; line-height:1.2; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }

/* ── Topbar ── */
.topbar { position:absolute; width:100%; z-index:50; top:0; min-height:104px; border-bottom:1px solid rgba(244,244,244,.14); background:transparent; backdrop-filter:none; }
.topbar-inner { min-height:104px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:28px; }
.brand,.footer-logo { line-height:0; }
.brand img,.footer-logo img { display:block; width:188px; height:auto; }
.topbar nav { display:flex; gap:clamp(16px,2.1vw,32px); }
.topbar nav a,.top-cta { font-size:1.125rem; font-weight:800; letter-spacing:.015em; text-decoration:none; text-transform:none; }
.top-cta { font-size:.85rem; }
.topbar nav a { position:relative; color:rgba(244,244,244,.82); font-weight:600; transition:color .25s; }
.topbar nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-7px; height:2px; background:var(--cyan); transition:right .35s var(--ease-out); }
.topbar nav a:hover { color:var(--paper); }.topbar nav a:hover::after { right:0; }
.top-cta { justify-self:end; display:flex; gap:12px; align-items:center; padding:10px 18px; border:1px solid rgba(75,227,239,.35); border-radius:999px; background:linear-gradient(105deg,#4aa3df 0%,#47c6e7 55%,#4be3ef 100%); color:#fff; box-shadow:0 0 0 5px rgba(71,198,231,.05),0 12px 34px rgba(74,163,223,.28); }
.top-cta:hover { color:#fff; transform:translateY(-2px); box-shadow:0 0 0 7px rgba(71,198,231,.09),0 16px 42px rgba(74,163,223,.36); }

/* ── Hero ── */
.hero { position:relative; isolation:isolate; min-height:100svh; overflow:hidden; background:#050608; padding-top:104px; background-image:none; }
.hero-video { position:absolute; z-index:-4; top:0; left:0; width:100%; height:100%; object-fit:cover; }
.hero::before { content:""; position:absolute; z-index:-3; inset:0; background:rgba(0,0,0,.6); }
.hero::after { content:""; position:absolute; z-index:-2; inset:0; background:linear-gradient(90deg,rgba(2,3,5,.96),rgba(2,3,5,.82) 35%,rgba(2,3,5,.3) 70%),linear-gradient(0deg,rgba(2,3,5,.92),transparent 44%); }
.hero-grid { position:absolute; z-index:-1; inset:-80px; opacity:.22; background-image:radial-gradient(circle at center,rgba(1,249,222,.8) 0 1px,transparent 1.5px),linear-gradient(rgba(244,244,244,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(244,244,244,.11) 1px,transparent 1px); background-size:80px 80px; mask-image:linear-gradient(90deg,#000,transparent 78%); animation:grid-drift 16s linear infinite; }
.hero-orbit { position:absolute; z-index:-1; width:min(44vw,640px); aspect-ratio:1; right:-7vw; top:8%; border:1px solid rgba(1,249,222,.15); border-radius:50%; animation:orbit-turn 24s linear infinite; }
.hero-orbit::before,.hero-orbit::after { content:""; position:absolute; border:1px solid rgba(244,244,244,.1); border-radius:50%; }.hero-orbit::before { inset:16%; }.hero-orbit::after { inset:34%; }
.hero-orbit i { position:absolute; width:9px; height:9px; border-radius:50%; background:var(--cyan); box-shadow:0 0 22px var(--cyan); }.hero-orbit i:nth-child(1) { left:12%; top:20%; }.hero-orbit i:nth-child(2) { right:8%; top:55%; }.hero-orbit i:nth-child(3) { left:45%; bottom:-5px; }
.hero-inner { min-height:calc(100svh - 148px); padding-top:30px; display:grid; grid-template-rows:auto 1fr auto; }
.index { color:var(--cyan); }
.hero-copyblock { display:grid; grid-template-columns:minmax(0,1fr) minmax(230px,310px); align-items:end; gap:clamp(30px,5vw,90px); padding:clamp(52px,8vh,110px) 0 42px; }
h1 { margin:0; max-width:980px; font-size:clamp(3.8rem,6.8vw,7.2rem); line-height:.89; font-weight:800; letter-spacing:-.062em; text-transform:uppercase; overflow:visible; padding:.1em 0 .08em; }
h1 span { display:block; white-space:nowrap; overflow:visible; clip-path:none; }
h1 em { position:relative; color:var(--cyan); font-style:normal; }
h1 em::after { display:none; }
.hero-sidecopy { margin:0 .45em .45em 0; padding:22px 0; font-size:clamp(.95rem,1.2vw,1.15rem); line-height:1.5; }
.hero-foot { position:relative; padding:24px 0; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:clamp(24px,4vw,64px); align-items:center; border-top:1px solid rgba(244,244,244,.32); }
.hero-foot p { margin:0; max-width:530px; color:var(--muted); font-size:clamp(.9rem,1.05vw,1.05rem); line-height:1.5; }
.hero-ticker { height:44px; display:flex; align-items:center; overflow:hidden; background:linear-gradient(90deg,#0149ca,#01f9de); position:relative; z-index:2; color:#fff; }
.hero-ticker-track { display:flex; width:max-content; will-change:transform; animation:ticker-loop 24s linear infinite; }
.hero-ticker-track span { flex:none; min-width:max-content; padding:0; font-size:.72rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.hero-ticker-group { display:flex; flex:none; align-items:center; gap:0; padding:0; }
.hero-scroll-cue { position:absolute; z-index:5; right:clamp(24px,4vw,64px); bottom:66px; display:flex; align-items:center; gap:12px; color:rgba(244,244,244,.7); font-size:.62rem; font-weight:800; letter-spacing:.18em; text-transform:uppercase; }
.hero-scroll-cue i { position:relative; display:block; width:52px; height:1px; overflow:hidden; background:rgba(244,244,244,.24); }
.hero-scroll-cue i::after { content:""; position:absolute; inset:0; background:var(--cyan); transform:translateX(-100%); animation:scroll-cue 1.8s var(--ease-out) infinite; }
@keyframes hero-breathe { to { filter:brightness(1.15) saturate(1.12); } }
@keyframes grid-drift { to { transform:translate3d(80px,80px,0); } }
@keyframes orbit-turn { to { transform:rotate(360deg); } }
@keyframes ticker-loop { to { transform:translateX(-50%); } }
@keyframes scroll-cue { 45%,100% { transform:translateX(110%); } }

/* ── Signal ── */
.signal { background:var(--blue); border-block:1px solid var(--line); display:none; }
.signal-inner { min-height:112px; display:grid; grid-template-columns:1fr 1fr; }
.signal-words { display:flex; align-items:center; gap:22px; overflow:hidden; white-space:nowrap; }
.signal-words span { display:flex; align-items:center; gap:22px; font-size:clamp(.95rem,1.2vw,1.25rem); font-weight:800; text-transform:uppercase; transition:transform .3s,color .3s; }.signal:hover .signal-words span { transform:translateX(8px); color:var(--cyan); }
.signal-words span::after { content:"+"; color:var(--cyan); font-weight:400; }
.proof { display:grid; grid-template-columns:repeat(3,1fr); border-left:1px solid rgba(244,244,244,.3); }
.proof span { display:grid; place-items:center; padding:18px; text-align:center; font-size:.68rem; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.proof span + span { border-left:1px solid rgba(244,244,244,.3); }

/* ── Services ── */
.services { border-bottom:1px solid var(--line); background:linear-gradient(90deg,var(--cyan) 0 calc(50% - 140px),var(--ink) calc(50% - 140px)); }
.services-inner { display:grid; grid-template-columns:500px minmax(0,780px); }
.services-intro { align-self:start; position:sticky; top:104px; min-height:calc(100svh - 104px); padding:var(--space-6) var(--space-6) var(--space-7) 0; color:var(--ink); overflow:hidden; }
.services-intro::after { content:"+"; position:absolute; right:-.12em; bottom:-.33em; color:rgba(1,63,201,.14); font-size:26rem; font-weight:300; line-height:1; animation:soft-pulse 4s ease-in-out infinite alternate; }
.services-intro h2 { margin:104px 0 var(--space-4); font-size:clamp(3.4rem,4.5vw,5rem); line-height:.88; letter-spacing:-.07em; text-transform:uppercase; }
.services-intro h2 span { display:block; white-space:nowrap; }
.services-intro > p:last-child { margin:0; max-width:360px; font-size:1.05rem; line-height:1.55; }
.services-inner { align-items:stretch; }
.service-list { padding:14px 0 14px 26px; display:grid; grid-template-rows:repeat(4,minmax(0,1fr)); gap:14px; }
.service { min-height:0; height:100%; margin:0; padding:40px 26px; border:1px solid rgba(244,244,244,.14); border-radius:24px; background:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.03)); position:relative; display:grid; grid-template-columns:54px minmax(0,1fr) 42px; align-items:center; gap:18px; overflow:hidden; transition:color .35s,transform .35s; }
.service::before { content:""; position:absolute; z-index:-1; inset:0; background:var(--paper); transform:scaleX(0); transform-origin:right; transition:transform .5s var(--ease-out); border-radius:23px; }
.service:last-child { border-bottom:1px solid rgba(244,244,244,.14); }
.service:hover { color:var(--ink); transform:translateX(10px); }.service:hover::before { transform:scaleX(1); transform-origin:left; }
.service > span { align-self:start; padding-top:8px; color:var(--cyan); font-size:.7rem; font-weight:800; }
.service h3 { margin:0 0 10px; font-size:clamp(2rem,3vw,3rem); line-height:1; letter-spacing:-.05em; }
.service p { margin:0; max-width:570px; color:var(--muted); line-height:1.5; }
.service:hover p { color:rgba(20,20,20,.68); }
.service b { font-size:1.7rem; font-weight:400; transition:transform .35s; }.service:hover b { transform:translateX(8px); }

/* ── Projects ── */
.projects { padding:var(--space-16) 0; }
.section-head { margin-bottom:var(--space-7); display:grid; grid-template-columns:minmax(0,1fr) minmax(260px,340px); gap:var(--space-6); align-items:end; }
.section-head h2 { margin-top:var(--space-3); font-size:clamp(3.2rem,4.35vw,5.35rem); line-height:.92; letter-spacing:-.07em; text-transform:uppercase; }
.section-head h2 span { display:block; white-space:nowrap; }
.section-head h2 span:last-child { color:var(--cyan); }
.section-head > p { margin:0; max-width:420px; color:var(--muted); line-height:1.5; }
.project-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:var(--space-3); }
.project { grid-column:span 6; transition:transform .65s var(--ease-out); }
.project:first-child { grid-column:1/-1; }
.project:nth-child(2) { transform:none; }
.project-window { overflow:hidden; border:none; border-radius:22px; background:#090a0d; box-shadow:0 28px 70px rgba(0,0,0,.22); transition:transform .65s var(--ease-out),box-shadow .65s var(--ease-out); }
.project-browserbar { height:42px; padding:0 14px; display:flex; align-items:center; gap:7px; border-bottom:none; background:#090a0d; }
.project-browserbar i { width:7px; height:7px; border-radius:50%; background:rgba(244,244,244,.3); }
.project-browserbar i:first-child { background:var(--cyan); }
.project-browserbar span { margin-left:auto; max-width:52%; overflow:hidden; color:rgba(244,244,244,.5); font-size:.62rem; letter-spacing:.08em; text-overflow:ellipsis; white-space:nowrap; }
.project-art { position:relative; aspect-ratio:16/12; padding:var(--space-4); overflow:hidden; display:flex; align-items:flex-start; justify-content:space-between; color:var(--ink); transition:transform .7s var(--ease-out); }
.project:first-child .project-art { aspect-ratio:2/1; }
.project:hover { transform:translateY(-18px); }.project:nth-child(2):hover { transform:none; }.project:hover .project-art { transform:scale(1.02); }
.project:hover .project-window { transform:perspective(900px) rotateX(1.2deg) rotateY(-1.2deg); box-shadow:0 34px 90px rgba(0,0,0,.34); }
.atlas { background:url("../images/onecomex.webp") center/cover no-repeat; }
.tiogirafa { background:url("../images/tiogirafa.webp") center/cover no-repeat; }
.dalbosco { background:url("../images/dalbosco.webp") center/cover no-repeat; }
.project-meta { padding:var(--space-3) 0; display:grid; grid-template-columns:38px 1fr; gap:5px 12px; border-top:none; }
.project-meta > span { grid-row:1/3; color:var(--cyan); font-size:.7rem; font-weight:800; }.project-meta h3 { margin:0; font-size:1.5rem; }.project-meta p { margin:0; color:var(--muted); font-size:.74rem; letter-spacing:.08em; text-transform:uppercase; }

/* ── About ── */
.about { position:relative; isolation:isolate; border:0; background:linear-gradient(135deg,#0b37b5 0%,var(--blue) 52%,#0877dc 120%); }
.about::before { content:""; position:absolute; z-index:-1; inset:0; opacity:.17; background-image:linear-gradient(rgba(244,244,244,.42) 1px,transparent 1px),linear-gradient(90deg,rgba(244,244,244,.42) 1px,transparent 1px); background-size:80px 80px; }
.about::after { content:""; position:absolute; z-index:-1; width:58vw; height:58vw; right:-25vw; top:-25vw; border-radius:50%; background:radial-gradient(circle,rgba(1,249,222,.16),transparent 66%); }
.about-inner { display:block; padding-block:clamp(90px,9vw,138px); }
.about-kicker { color:var(--cyan); }
.about-hero { margin-top:clamp(42px,5vw,72px); display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,390px); gap:50px; align-items:center; }
.about-hero h2 { margin:0; max-width:790px; color:#fff; font-size:clamp(4rem,6.25vw,6.7rem); font-weight:300; line-height:.84; letter-spacing:-.075em; text-transform:uppercase; padding-top:.12em; overflow:visible; }
.about-hero h2 span { display:block; white-space:nowrap; }
.about-mark { justify-self:center; width:min(100%,360px); line-height:0; letter-spacing:0; color:var(--cyan); animation:mark-float 4.5s ease-in-out infinite alternate; }
.about-mark img { display:block; width:100%; height:auto; }
/* O logo acompanha o tempo de leitura do título, sem interferir na flutuação contínua. */
.about-mark.entry-reveal { transition:opacity 1.25s var(--ease-out),transform 1.8s var(--ease-spring); transition-delay:.35s; }
.about-mark.entry-reveal img { opacity:0; transform:translate3d(0,44px,0) scale(.78) rotate(-8deg); transition:opacity .75s var(--ease-out),transform 1.15s var(--ease-spring); transition-delay:.2s; }
.about-mark.entry-reveal.is-visible img { opacity:1; transform:none; }
.about-copy { margin-top:clamp(58px,7vw,90px); padding:clamp(34px,4vw,48px) 0 0; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(34px,5vw,72px); border-top:1px solid rgba(244,244,244,.55); }
.about-copy p { margin:0; max-width:none; color:rgba(255,255,255,.9); font-size:clamp(.98rem,1.14vw,1.12rem); line-height:1.55; }

/* ── Difference ── */
.difference { background:var(--paper); color:var(--ink); }
.difference-inner { display:block; padding-block:clamp(90px,9vw,138px); }
.difference-head { min-height:0; padding:0; display:block; background:none; color:var(--ink); text-align:center; }
.difference-head .kicker { color:var(--blue); }
.difference h2 { margin:28px auto 0; max-width:980px; color:var(--ink); font-size:clamp(3.5rem,5.3vw,5.8rem); font-weight:300; line-height:.95; letter-spacing:-.065em; text-transform:none; }
.difference h2 span { display:block; color:var(--blue); }
.difference ol { margin-top:clamp(54px,6vw,80px); display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.difference li { isolation:isolate; min-height:300px; padding:28px; display:flex; flex-direction:column; justify-content:flex-end; gap:0; border:1px solid #c7c7c7; border-radius:24px; background:#fff; color:var(--ink); position:relative; transition:transform .45s var(--ease-out),border-color .35s,box-shadow .45s,color .35s; }
.difference li::before { content:""; position:absolute; z-index:0; inset:-1px; border-radius:24px; background:linear-gradient(135deg,#6513d2 0%,#3d28d8 32%,#075fdf 66%,#00d9e8 100%); opacity:0; transition:opacity .4s var(--ease-out); }
.difference li > *,.difference li::after { z-index:1; }
.difference li:hover { color:#fff; border-color:transparent; background:#fff; transform:translateY(-10px); box-shadow:0 24px 56px rgba(1,63,201,.12); }
.difference li:hover::before { opacity:1; }
.difference li::after { content:"↗"; position:absolute; right:25px; top:23px; color:var(--blue); opacity:1; transform:none; font-size:1.45rem; transition:.35s; }
.difference li:hover::after { opacity:1; transform:translate(3px,-3px); color:#fff; }
.difference li > span { position:absolute; left:28px; top:28px; color:var(--blue); }
.difference strong { max-width:210px; font-size:clamp(1.55rem,2vw,2rem); font-weight:400; line-height:.95; display:block; }
.difference li p { margin:16px 0 0; color:#707070; font-size:1rem; line-height:1.42; }
.difference li:hover p { color:rgba(255,255,255,.8); }
.difference li:hover > span { color:#fff; }
/* A entrada é sincronizada com o título; hover permanece independente. */
.difference li.entry-reveal { transition:opacity .75s var(--ease-out),transform .85s var(--ease-out),border-color .35s,box-shadow .45s var(--ease-out),color .35s; }
.difference li.entry-reveal:hover { transition-delay:0s; }

/* ── Instagram ── */
.instagram { padding:var(--space-16) 0; border-bottom:1px solid var(--line); }
.instagram-head { display:grid; grid-template-columns:1fr auto; gap:var(--space-4); align-items:end; margin-bottom:var(--space-8); }
.instagram-head .kicker { color:var(--cyan); }
.instagram-head h2 { margin:12px 0 0; font-size:clamp(2.8rem,4.5vw,4.5rem); line-height:.9; font-weight:800; letter-spacing:-.05em; text-transform:uppercase; }
.instagram-follow { display:inline-flex; align-items:center; gap:10px; padding:12px 24px; border:1px solid rgba(1,249,222,.42); border-radius:999px; background:transparent; color:var(--paper); font-size:.85rem; font-weight:700; text-decoration:none; transition:background .3s,color .3s,transform .3s; }
.instagram-follow:hover { background:var(--cyan); color:var(--ink); }
.instagram-follow i { transition:transform .3s; }
.instagram-follow:hover i { transform:translate(3px,-3px); }
.instagram-feed { width:100%; overflow:hidden; }
.instagram-feed .elfsight-app-328c3cc7-41cf-41b0-82b5-4244e0c7c1ef button,
.instagram-feed .eapps-instagram-feed-load-more,
.instagram-feed .eapps-instagram-feed-footer { display:none!important; }

/* ── Contact ── */
.contact { padding-top:var(--space-16); background:var(--cyan); color:var(--ink); }
.contact h2 { margin:var(--space-6) 0 var(--space-10); max-width:1180px; font-size:clamp(3.5rem,7.2vw,8rem); line-height:.86; letter-spacing:-.075em; text-transform:uppercase; }
.contact h2 span { display:block; }
.contact-cta { position:relative; min-height:var(--space-16); display:block; overflow:hidden; background:var(--ink); color:var(--paper); text-decoration:none; }
.contact-cta::before { content:""; position:absolute; z-index:0; inset:0; background:linear-gradient(90deg,#0149ca,#01f9de); transform:translateX(-100%); transition:transform .65s var(--ease-out); }
.contact-cta-inner { position:relative; z-index:1; }
.contact-cta:hover::before { transform:none; }
.contact-cta-inner { min-height:var(--space-16); display:flex; align-items:center; justify-content:space-between; gap:30px; }
.contact-cta small { display:none; }
.contact-cta b { font-size:clamp(2rem,4.5vw,4.5rem); letter-spacing:-.05em; text-transform:uppercase; }
.contact-cta i { color:var(--cyan); font-size:clamp(2.2rem,4vw,4rem); font-style:normal; transition:.2s; }
.contact-cta:hover i { transform:translate(8px,-8px); }

/* ── Project Links ── */
.project-link { display:block; text-decoration:none; color:inherit; }

/* ── Internal Pages ── */
.page-hero {
  position:relative;
  isolation:isolate;
  padding:clamp(140px,18vh,220px) 0 clamp(60px,8vh,100px);
  overflow:hidden;
  background:#050608;
}
.page-hero::before {
  content:"";
  position:absolute;
  z-index:-3;
  inset:-4%;
  background:url("../images/img-hero.webp") center/cover no-repeat;
  animation:hero-breathe 12s ease-in-out infinite alternate;
}
.page-hero::after {
  content:"";
  position:absolute;
  z-index:-2;
  inset:0;
  background:linear-gradient(90deg,rgba(2,3,5,.94),rgba(2,3,5,.8) 40%,rgba(2,3,5,.5) 70%),
             linear-gradient(0deg,rgba(2,3,5,.9),transparent 50%);
}
.page-hero .hero-grid-deco {
  position:absolute;
  z-index:-1;
  inset:-80px;
  opacity:.22;
  background-image:radial-gradient(circle at center,rgba(1,249,222,.8) 0 1px,transparent 1.5px),linear-gradient(rgba(244,244,244,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(244,244,244,.11) 1px,transparent 1px);
  background-size:80px 80px;
  mask-image:linear-gradient(90deg,#000,transparent 78%);
  animation:grid-drift 16s linear infinite;
}
.page-hero .hero-orbit-deco {
  position:absolute;
  z-index:-1;
  width:min(36vw,500px);
  aspect-ratio:1;
  right:-6vw;
  top:10%;
  border:1px solid rgba(1,249,222,.15);
  border-radius:50%;
  animation:orbit-turn 24s linear infinite;
}
.page-hero .hero-orbit-deco::before,
.page-hero .hero-orbit-deco::after {
  content:"";
  position:absolute;
  border:1px solid rgba(244,244,244,.1);
  border-radius:50%;
}
.page-hero .hero-orbit-deco::before { inset:16%; }
.page-hero .hero-orbit-deco::after { inset:34%; }
.page-hero .hero-orbit-deco i {
  position:absolute;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--cyan);
  box-shadow:0 0 18px var(--cyan);
}
.page-hero .hero-orbit-deco i:nth-child(1) { left:12%; top:20%; }
.page-hero .hero-orbit-deco i:nth-child(2) { right:8%; top:55%; }
.page-hero .hero-orbit-deco i:nth-child(3) { left:45%; bottom:-5px; }
.page-hero .kicker {
  color:var(--cyan);
  margin-bottom:28px;
  font-size:.72rem;
  letter-spacing:.16em;
}
.page-title {
  margin:0;
  font-size:clamp(3.2rem,6.5vw,6.5rem);
  line-height:.86;
  font-weight:800;
  letter-spacing:-.06em;
  text-transform:uppercase;
}
.page-title span { display:block; white-space:nowrap; }
.page-title span:last-child { color:var(--cyan); }
.page-hero .entry-hero-kicker { transition-delay:.12s; }
.page-hero .entry-hero-title { transform:translateY(54px); transition:opacity .8s var(--ease-out),transform 1s var(--ease-out); }
.page-hero .entry-hero-title:nth-child(1) { transition-delay:.06s; }
.page-hero .entry-hero-title:nth-child(2) { transition-delay:.14s; }

/* Page Content */
.page-content { padding:var(--space-16) 0; }
.page-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-10); align-items:center; }
.page-text p { margin:0 0 28px; color:var(--muted); font-size:clamp(1rem,1.2vw,1.15rem); line-height:1.65; }
.page-lead { font-size:clamp(1.25rem,1.6vw,1.45rem) !important; color:var(--paper) !important; line-height:1.5 !important; }
.page-visual { display:flex; justify-content:center; }
.page-img { max-width:100%; height:auto; filter:drop-shadow(0 20px 60px rgba(1,249,222,.15)); }
.about-float {
  width:clamp(160px,56vw,360px);
  animation:about-float-fast 4s ease-in-out infinite alternate;
  filter:drop-shadow(0 20px 60px rgba(1,249,222,.15));
  opacity:1;
}
@keyframes about-float-fast {
  from { transform:translate3d(0,0,0) rotate(0deg); }
  to { transform:translate3d(6px,-10px,0) rotate(2deg); }
}

/* Difference page */
.page-difference {
  padding:var(--space-16) 0;
  background:var(--paper);
  color:var(--ink);
}
.page-difference h2 {
  margin:20px 0 var(--space-8);
  font-size:clamp(2.8rem,4.5vw,4.5rem);
  line-height:.88;
  font-weight:300;
  letter-spacing:-.05em;
}
.page-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.page-step {
  padding:32px;
  border:1px solid #c7c7c7;
  border-radius:20px;
  background:#fff;
  position:relative;
  overflow:hidden;
  transition:transform .45s var(--ease-out),border-color .35s,box-shadow .45s;
}
.page-step::before {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg,#6513d2,#3d28d8 32%,#075fdf 66%,#00d9e8);
  opacity:0;
  transition:opacity .4s var(--ease-out);
  border-radius:19px;
}
.page-step > * { position:relative; z-index:1; }
.page-step:hover { transform:translateY(-8px); border-color:transparent; box-shadow:0 24px 56px rgba(1,63,201,.15); }
.page-step:hover::before { opacity:1; }
.page-step:hover span,.page-step:hover strong,.page-step:hover p { color:#fff; }
.page-step span { display:block; color:var(--blue); font-size:.7rem; font-weight:800; margin-bottom:20px; letter-spacing:.1em; }
.page-step strong { display:block; font-size:clamp(1.3rem,1.8vw,1.6rem); line-height:1.05; letter-spacing:-.03em; margin-bottom:12px; }
.page-step p { margin:0; color:#707070; font-size:.95rem; line-height:1.45; }

/* Contact CTA section */
.page-contact {
  padding:var(--space-16) 0;
  background:var(--cyan);
  color:var(--ink);
  text-align:center;
}
.page-contact h2 {
  margin:0 0 var(--space-6);
  font-size:clamp(2.8rem,5.5vw,5rem);
  line-height:.88;
  font-weight:800;
  letter-spacing:-.06em;
  text-transform:uppercase;
}

/* Buttons */
.btn-primary {
  display:inline-block;
  padding:20px 40px;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--sans);
  font-weight:800;
  font-size:.85rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-decoration:none;
  border-radius:4px;
  transition:transform .3s var(--ease-out),box-shadow .3s,background .3s;
}
.btn-primary:hover {
  transform:translateY(-4px);
  box-shadow:0 16px 40px rgba(0,0,0,.35);
  background:var(--blue);
}
.btn-large { padding:26px 52px; font-size:1rem; }

/* ── Services Page ── */
.page-services-list { padding:var(--space-10) 0 var(--space-16); }
.page-service {
  display:grid;
  grid-template-columns:60px 1fr 40px;
  gap:28px;
  padding:44px 0;
  border-bottom:1px solid var(--line);
  align-items:center;
}
.page-service:hover { transform:translateX(8px); }
.page-service:last-child { border-bottom:none; }
.page-service-num { color:var(--cyan); font-size:.75rem; font-weight:800; padding-top:10px; letter-spacing:.1em; }
.page-service h2 {
  margin:0 0 18px;
  font-size:clamp(2.2rem,3.2vw,3rem);
  letter-spacing:-.05em;
  line-height:1;
}
.page-service p { margin:0; color:var(--muted); font-size:1.05rem; line-height:1.6; max-width:600px; }

/* ── Contact Page ── */
.page-contact-content {
  padding:clamp(56px,8vw,96px) 0 var(--space-16);
  overflow:visible;
}
.contact-grid {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(380px,520px);
  gap:clamp(32px,5vw,88px);
  align-items:start;
  overflow:visible;
}
.contact-info {
  max-width:620px;
  padding-top:18px;
}
@media (min-width: 981px) {
  .contact-info {
    position:sticky;
    top:clamp(96px,12vh,140px);
    align-self:start;
  }
}
.contact-eyebrow {
  margin:0 0 18px;
  color:var(--cyan) !important;
  font-size:.78rem !important;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.contact-info h2 {
  margin:0 0 26px;
  max-width:10ch;
  font-size:clamp(2.6rem,4.8vw,4.6rem);
  line-height:.92;
  font-weight:300;
  letter-spacing:-.055em;
}
.contact-info p {
  margin:0 0 40px;
  max-width:54ch;
  color:var(--muted);
  font-size:1.02rem;
  line-height:1.8;
}
.contact-details {
  display:flex;
  flex-direction:column;
  gap:0;
  padding-top:26px;
  border-top:1px solid rgba(244,244,244,.1);
}
.contact-block + .contact-block {
  margin-top:26px;
}
.contact-primary {
  display:flex;
  flex-direction:column;
}
.contact-primary > .contact-link + .contact-link {
  margin-top:8px;
}
.contact-link {
  display:inline-flex;
  align-items:center;
  gap:14px;
  color:var(--muted);
  width:fit-content;
  font-size:.95rem;
  font-weight:400;
  line-height:1.2;
  text-decoration:none;
  transition:color .2s,transform .25s var(--ease-out);
}
.contact-link:hover {
  color:var(--paper);
  transform:translateX(4px);
}
.contact-link i,
.contact-location i {
  width:18px;
  text-align:center;
  color:var(--cyan);
  font-size:1rem;
}
.contact-link span {
  display:block;
  line-height:1.2;
}
.contact-location {
  margin:8px 0 8px;
  display:flex;
  align-items:flex-start;
  gap:14px;
  color:var(--muted);
  font-size:.95rem;
  line-height:1;
}
.contact-location-text {
  display:flex;
  flex-direction:column;
  gap:0;
}
.contact-location-text span {
  display:block;
  line-height:1.2;
}
.contact-social {
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  align-items:center;
  padding-top:0;
  margin-top:0;
  margin-bottom:0;
}
.contact-social a {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border:1px solid rgba(244,244,244,.12);
  border-radius:999px;
  background:rgba(255,255,255,.03);
  color:var(--paper);
  text-decoration:none;
  transition:transform .2s var(--ease-out),border-color .2s,color .2s;
}
.contact-social a:hover {
  transform:translateY(-2px);
  border-color:transparent;
  background:linear-gradient(105deg,#4aa3df 0%,#47c6e7 55%,#4be3ef 100%);
  color:var(--ink);
  box-shadow:0 10px 24px rgba(71,198,231,.2);
}
.contact-form {
  position:relative;
  padding:34px;
  border:1px solid rgba(244,244,244,.12);
  border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018));
  overflow:hidden;
}
.contact-form::before {
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg,var(--blue),#075de0 45%,var(--cyan));
}
.contact-form-head {
  margin-bottom:24px;
  padding-bottom:18px;
  border-bottom:1px solid rgba(244,244,244,.08);
}
.contact-card-kicker {
  margin:0 0 14px;
  color:var(--cyan);
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
}
.contact-form h3 {
  margin:0;
  max-width:12ch;
  font-size:clamp(1.6rem,2.4vw,2.2rem);
  line-height:1;
  letter-spacing:-.04em;
}
.contact-form-grid {
  display:flex;
  gap:18px;
}
.contact-form-grid > label {
  flex:1;
}
.contact-form label {
  display:block;
  margin-bottom:22px;
}
.contact-form label span {
  display:block;
  margin-bottom:12px;
  color:var(--paper);
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.contact-form input,
.contact-form textarea {
  width:100%;
  padding:18px 20px;
  border-color:rgba(244,244,244,.1);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}
.contact-form input:hover,
.contact-form textarea:hover {
  border-color:rgba(71,198,231,.32);
}
.contact-form textarea {
  min-height:150px;
}
.contact-form-honeypot {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
}
.contact-form-status {
  min-height:1.5em;
  margin:16px 0 0;
  font-size:.9rem;
  line-height:1.45;
}
.contact-form-status.is-loading { color:var(--muted); }
.contact-form-status.is-success { color:#7ee8bd; }
.contact-form-status.is-error { color:#ff9c9c; }
.contact-form .btn-submit:disabled {
  cursor:wait;
  opacity:.7;
  transform:none;
}
.contact-mini-points {
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:0;
}
.contact-mini-points span {
  display:inline-flex;
  align-items:center;
  min-height:40px;
  padding:8px 14px;
  border:1px solid rgba(244,244,244,.12);
  border-radius:999px;
  background:rgba(255,255,255,.04);
  color:var(--paper);
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.03em;
  transition:transform .25s var(--ease-out),border-color .25s,color .25s,background .25s,box-shadow .25s;
}
.contact-mini-points span:hover {
  transform:translateY(-2px);
  border-color:transparent;
  background:linear-gradient(105deg,#4aa3df 0%,#47c6e7 55%,#4be3ef 100%);
  color:var(--ink);
  box-shadow:0 10px 24px rgba(71,198,231,.2);
}
.contact-form .btn-submit {
  margin-top:6px;
  border-radius:999px;
  background:linear-gradient(105deg,#4aa3df 0%,#47c6e7 55%,#4be3ef 100%);
  color:var(--ink);
  box-shadow:0 12px 34px rgba(71,198,231,.22);
}
.contact-form .btn-submit:hover {
  background:linear-gradient(105deg,#5aade3 0%,#51cde9 55%,#5ae7f2 100%);
  box-shadow:0 16px 40px rgba(71,198,231,.28);
}
.contact-form-actions {
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  margin-top:6px;
}
.contact-form-actions .btn-submit {
  margin-top:0;
}
.contact-form-actions .btn-submit,
.contact-form-actions .btn-whatsapp {
  flex:1 1 220px;
  text-align:center;
  justify-content:center;
}
.contact-form .btn-whatsapp {
  display:inline-flex;
  align-items:center;
  min-height:58px;
  padding:18px 24px;
  border:1px solid rgba(37,211,102,.28);
  border-radius:999px;
  background:rgba(37,211,102,.12);
  color:#dfffea;
  text-decoration:none;
  box-shadow:none;
  transition:transform .3s var(--ease-out),background .3s,border-color .3s,color .3s,box-shadow .3s;
}
.contact-form .btn-whatsapp:hover {
  background:#25d366;
  border-color:#25d366;
  color:#04110a;
  box-shadow:0 16px 40px rgba(37,211,102,.22);
}

@media (max-width:980px) {
  .contact-grid {
    grid-template-columns:minmax(0,1fr);
  }
  .contact-info {
    position:static;
    max-width:none;
    padding-top:0;
  }
}

/* ── Project Pages ── */
.project-hero {
  position:relative;
  isolation:isolate;
  padding:clamp(140px,18vh,220px) 0 clamp(40px,5vh,60px);
  overflow:hidden;
  background:#050608;
}
.project-hero::before {
  content:"";
  position:absolute;
  z-index:-3;
  inset:-4%;
  background:url("../images/img-hero.webp") center/cover no-repeat;
  animation:hero-breathe 12s ease-in-out infinite alternate;
}
.project-hero.onecomex-hero::before { background-image:url("../images/onecomeximg/cover-hero.png"); }
.project-hero.dalbosco-hero::before { background-image:url("../images/dalboscoimg/cover-hero-dalbosco.png"); background-size:cover; background-position:center; }
.project-hero.project-hero--image::before { background-image:var(--project-hero-image); background-size:cover; background-position:center; }
.project-hero::after {
  content:"";
  position:absolute;
  z-index:-2;
  inset:0;
  background:linear-gradient(90deg,rgba(2,3,5,.94),rgba(2,3,5,.8) 40%,rgba(2,3,5,.5) 70%),
             linear-gradient(0deg,rgba(2,3,5,.9),transparent 50%);
}
.project-hero .hero-grid-deco { position:absolute; z-index:-1; inset:-80px; opacity:.22; background-image:radial-gradient(circle at center,rgba(1,249,222,.8) 0 1px,transparent 1.5px),linear-gradient(rgba(244,244,244,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(244,244,244,.11) 1px,transparent 1px); background-size:80px 80px; mask-image:linear-gradient(90deg,#000,transparent 78%); animation:grid-drift 16s linear infinite; }
.project-hero .hero-orbit-deco { position:absolute; z-index:-1; width:min(36vw,500px); aspect-ratio:1; right:-6vw; top:10%; border:1px solid rgba(1,249,222,.15); border-radius:50%; animation:orbit-turn 24s linear infinite; }
.project-hero .hero-orbit-deco::before,.project-hero .hero-orbit-deco::after { content:""; position:absolute; border:1px solid rgba(244,244,244,.1); border-radius:50%; }
.project-hero .hero-orbit-deco::before { inset:16%; }.project-hero .hero-orbit-deco::after { inset:34%; }
.project-hero .hero-orbit-deco i { position:absolute; width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 18px var(--cyan); }
.project-hero .hero-orbit-deco i:nth-child(1) { left:12%; top:20%; }.project-hero .hero-orbit-deco i:nth-child(2) { right:8%; top:55%; }.project-hero .hero-orbit-deco i:nth-child(3) { left:45%; bottom:-5px; }

.project-hero-title {
  margin:0;
  font-size:clamp(3.5rem,7vw,7rem);
  line-height:.86;
  font-weight:800;
  letter-spacing:-.06em;
  text-transform:uppercase;
}
.project-hero-title span { display:block; white-space:nowrap; }
.project-hero-title span:last-child { color:var(--cyan); }
.project-hero .entry-project-hero-title { transform:translateY(58px); transition:opacity .8s var(--ease-out),transform 1.05s var(--ease-out); }
.project-hero .entry-project-hero-title:nth-child(1) { transition-delay:.18s; }
.project-hero .entry-project-hero-title:nth-child(2) { transition-delay:.36s; }

/* Project Info Section */
.project-info-section { padding:var(--space-10) 0; }
.project-info-grid { display:grid; grid-template-columns:1.4fr 1fr; gap:60px; align-items:start; }
.project-label { margin:0 0 10px; color:var(--muted); font-size:.9rem; }
.project-name {
  margin:0 0 28px;
  font-size:clamp(2.2rem,3.2vw,3rem);
  font-weight:800;
  letter-spacing:-.04em;
  line-height:1;
}
.project-desc { margin:0; color:var(--muted); font-size:1rem; line-height:1.75; max-width:540px; }
.project-info-left .entry-project-label { transition-delay:.05s; }
.project-info-left .entry-project-name { transition-delay:.17s; }
.project-info-left .entry-project-desc { transition-delay:.31s; }
.project-info-card.entry-reveal { transition-delay:.22s; }

.project-info-card {
  position:relative;
  padding:36px;
  border:1px solid rgba(244,244,244,.12);
  border-radius:16px;
  background:rgba(255,255,255,.03);
  display:flex;
  flex-direction:column;
  gap:0;
  overflow:hidden;
}
.project-info-card::before {
  content:"";
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:60%;
  height:3px;
  background:linear-gradient(90deg,var(--blue),#075de0,var(--cyan));
  border-radius:0 0 4px 4px;
}
.meta-row {
  padding:22px 0;
  border-bottom:1px solid rgba(244,244,244,.1);
  color:var(--paper);
  font-size:1rem;
  font-weight:400;
  line-height:1.6;
}
.meta-row:first-child { padding-top:4px; }
.meta-row:last-of-type { border-bottom:none; padding-bottom:0; }
.meta-row strong { color:var(--paper); font-weight:400; }

.btn-card-cta {
  display:block;
  margin:32px auto 0;
  padding:16px 40px;
  width:fit-content;
  border:none;
  border-radius:999px;
  background:linear-gradient(105deg,var(--blue),#075de0 56%,#01bfae);
  color:#fff;
  font-family:var(--sans);
  font-size:.9rem;
  font-weight:800;
  letter-spacing:.04em;
  text-align:center;
  text-decoration:none;
  text-transform:uppercase;
  transition:transform .3s var(--ease-out),box-shadow .3s;
  box-shadow:0 8px 24px rgba(1,63,201,.25);
}
.btn-card-cta:hover {
  transform:translateY(-3px);
  box-shadow:0 14px 36px rgba(1,63,201,.4);
}

/* Project Gallery */
.project-gallery { padding:var(--space-8) 0 var(--space-10); }
.gallery-stack { display:flex; flex-direction:column; gap:var(--space-6); }
.gallery-grid-4 { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.gallery-grid-4 .gallery-item { border-radius:12px; }
.gallery-item {
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.3);
  transition:transform .6s var(--ease-out);
}
.gallery-item { cursor:pointer; }
.gallery-item:hover { transform:scale(1.01); }
.gallery-item img { display:block; width:100%; height:auto; }

/* Lightbox */
.lightbox-overlay {
  position:fixed; inset:0; z-index:9999;
  background:rgba(0,0,0,.96);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden;
  transition:opacity .35s,visibility .35s;
}
.lightbox-overlay.active { opacity:1; visibility:visible; }
.lightbox-overlay img {
  max-width:90vw; max-height:85vh;
  object-fit:contain; border-radius:8px;
  box-shadow:0 20px 60px rgba(0,0,0,.5);
  transition:transform .4s var(--ease-out);
}
.lightbox-close {
  position:absolute; top:24px; right:28px;
  background:none; border:none; color:#f4f4f4;
  font-size:2rem; cursor:pointer; line-height:1;
  transition:color .2s;
}
.lightbox-close:hover { color:var(--cyan); }
.lightbox-nav {
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15);
  color:#f4f4f4; width:48px; height:48px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:1.3rem; cursor:pointer;
  transition:background .2s, border-color .2s;
}
.lightbox-nav:hover { background:rgba(255,255,255,.15); border-color:var(--cyan); }
.lightbox-prev { left:24px; }
.lightbox-next { right:24px; }
.lightbox-counter {
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%);
  color:rgba(244,244,244,.6); font-size:.85rem; letter-spacing:.08em;
}

/* Related Projects */
.related-section { padding:var(--space-10) 0 var(--space-16); }
.related-section .kicker { margin-bottom:8px; }
.related-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.related-card {
  display:block; text-decoration:none; color:inherit;
  border-radius:16px; overflow:hidden;
  border:1px solid rgba(244,244,244,.1);
  transition:border-color .3s, transform .4s var(--ease-out);
}
.related-card:hover { border-color:var(--cyan); transform:translateY(-6px); }
.related-card.entry-reveal,
.gallery-item.entry-reveal {
  opacity:0;
  transform:translateY(38px) scale(.94);
  transition:opacity .75s var(--ease-out),transform .85s var(--ease-out);
}
.related-card.entry-reveal.is-visible,
.gallery-item.entry-reveal.is-visible { opacity:1; transform:none; }
.related-card-image {
  aspect-ratio:4/3; overflow:hidden;
  background:rgba(255,255,255,.04);
}
.related-card-image img { width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease-out); }
.related-card:hover .related-card-image img { transform:scale(1.06); }
.related-card-body { padding:20px; }
.related-card-tag {
  display:inline-block;
  padding:5px 14px;
  border-radius:100px;
  background:linear-gradient(105deg,var(--blue),#075de0 56%,#01f9de);
  color:#fff;
  font-family:var(--sans);
  font-size:.6rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  margin-bottom:14px;
}
.related-card-body h3 { margin:0 0 2px; font-size:1.45rem; font-weight:500; letter-spacing:-.02em; }
.related-card-body p { margin:0; color:var(--muted); font-size:.85rem; }

/* Project Contact */
.project-cta-section {
  padding:clamp(80px,10vw,150px) 0;
  background:var(--cyan);
  color:var(--ink);
}
.project-cta-section .kicker {
  color:var(--ink);
  margin-bottom:28px;
}
.project-cta-title {
  margin:0 0 var(--space-8);
  max-width:16ch;
  font-size:clamp(3rem,6.5vw,6.5rem);
  font-weight:800;
  line-height:.88;
  letter-spacing:-.06em;
  text-transform:uppercase;
  text-wrap:balance;
}
.project-cta-section .btn-card-cta {
  margin:0;
}

.project-form {
  max-width:700px;
  margin:0 auto;
  display:flex;
  flex-direction:column;
  gap:16px;
  text-align:left;
}
.project-form input,
.project-form textarea {
  width:100%;
  padding:16px 20px;
  border:1px solid rgba(244,244,244,.15);
  border-radius:8px;
  background:rgba(255,255,255,.05);
  color:var(--paper);
  font-family:var(--sans);
  font-size:.95rem;
  transition:border-color .3s;
  outline:none;
}
.project-form input:focus,
.project-form textarea:focus {
  border-color:var(--cyan);
}
.project-form input::placeholder,
.project-form textarea::placeholder {
  color:var(--muted);
}
.project-form textarea { resize:vertical; min-height:120px; }
.btn-submit {
  width:100%;
  padding:18px;
  border:none;
  border-radius:8px;
  background:var(--cyan);
  color:var(--ink);
  font-family:var(--sans);
  font-size:1rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .3s,transform .3s,box-shadow .3s;
}
.btn-submit:hover {
  background:var(--paper);
  transform:translateY(-2px);
  box-shadow:0 12px 30px rgba(1,249,222,.3);
}

/* ── Portfolio Page ── */
.portfolio-section { padding:var(--space-10) 0 var(--space-16); }

.portfolio-filters {
  display:flex;
  gap:12px;
  margin-bottom:var(--space-8);
  flex-wrap:wrap;
}
.filter-btn {
  padding:12px 28px;
  border:1px solid rgba(244,244,244,.15);
  border-radius:999px;
  background:transparent;
  color:var(--muted);
  font-family:var(--sans);
  font-size:.85rem;
  font-weight:700;
  letter-spacing:.04em;
  cursor:pointer;
  transition:transform .25s var(--ease-out),border-color .25s,color .25s,background .25s,box-shadow .25s;
}
.filter-btn:hover {
  color:var(--paper);
  border-color:rgba(75,227,239,.35);
  transform:translateY(-2px);
}
.filter-btn.active {
  background:linear-gradient(105deg,#4aa3df 0%,#47c6e7 55%,#4be3ef 100%);
  color:var(--ink);
  border-color:transparent;
  box-shadow:0 10px 24px rgba(71,198,231,.18);
}

.portfolio-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px;
}

.portfolio-item {
  border-radius:16px;
  overflow:hidden;
  transition:transform .5s var(--ease-out);
}
.portfolio-item:hover { transform:translateY(-8px); }
.portfolio-item.is-hidden { display:none !important; }
.portfolio-item.entry-reveal {
  opacity:0;
  transform:translateY(38px) scale(.94);
  transition:opacity .75s var(--ease-out),transform .85s var(--ease-out);
}
.portfolio-item.entry-reveal.is-visible { opacity:1; transform:none; }

.portfolio-link {
  display:block;
  text-decoration:none;
  color:inherit;
  position:relative;
}

.portfolio-image {
  aspect-ratio:4/3;
  overflow:hidden;
  border-radius:16px;
}
.portfolio-image img {
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .6s var(--ease-out);
}
.portfolio-link:hover .portfolio-image img { transform:scale(1.06); }

.portfolio-overlay {
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  padding:28px;
  background:linear-gradient(0deg,rgba(0,0,0,.9) 0%,rgba(0,0,0,.4) 50%,transparent 100%);
  opacity:0;
  transition:opacity .4s var(--ease-out);
  border-radius:16px;
}
.portfolio-item:hover .portfolio-overlay,
.portfolio-item:focus-within .portfolio-overlay,
.portfolio-link:focus-visible .portfolio-overlay { opacity:1; }

.portfolio-tag {
  display:inline-block;
  width:fit-content;
  padding:8px 18px;
  margin-bottom:12px;
  background:linear-gradient(105deg,var(--blue),#075de0 56%,#01bfae);
  color:#fff;
  font-family:var(--sans);
  font-size:.85rem;
  font-weight:300;
  letter-spacing:.02em;
  text-transform:none;
  border-radius:999px;
}
.portfolio-overlay h3 {
  margin:0 0 10px;
  font-size:clamp(1.6rem,2.5vw,2.2rem);
  font-weight:800;
  letter-spacing:-.03em;
  line-height:1;
}
.portfolio-overlay p {
  margin:0;
  color:rgba(255,255,255,.7);
  font-size:.85rem;
}

@media (max-width:980px) {
  .portfolio-grid { grid-template-columns:repeat(2,1fr); }
  .contact-grid { grid-template-columns:1fr; }
  .contact-info { position:static; max-width:none; padding-top:0; }
  .contact-form { max-width:none; }
}
@media (max-width:620px) {
  .portfolio-grid { grid-template-columns:1fr; }
  .portfolio-filters { gap:8px; }
  .filter-btn { padding:10px 20px; font-size:.78rem; }
  .contact-form { padding:26px 22px; border-radius:18px; }
  .contact-form-grid { flex-direction:column; gap:0; }
  .contact-info h2 { max-width:none; font-size:clamp(2.2rem,10vw,3.2rem); }
}

/* ── Service Links ── */
.page-service-link { display:block; text-decoration:none; color:inherit; }
.page-service { transition:transform .3s var(--ease-out); }
.page-service:hover { transform:translateX(8px); }
.page-service-arrow { color:var(--cyan); font-size:1.5rem; font-weight:400; transition:transform .3s; }
.page-service-link:hover .page-service-arrow { transform:translateX(6px); }

/* ── Service Detail Pages ── */
.service-detail { padding:var(--space-10) 0; }
.service-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-8); align-items:start; }
.service-detail-lead { font-size:clamp(1.2rem,1.5vw,1.4rem); color:var(--paper); line-height:1.5; margin:0 0 20px; }
.service-detail-text p { color:var(--muted); font-size:1rem; line-height:1.7; max-width:520px; }
.service-detail-features { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.feature-item { padding:28px; border:1px solid rgba(244,244,244,.12); border-radius:16px; background:rgba(255,255,255,.03); transition:border-color .3s,transform .3s var(--ease-out); }
.feature-item:hover { border-color:var(--cyan); transform:translateY(-4px); }
.feature-item h3 { margin:0 0 10px; font-size:1.2rem; font-weight:700; letter-spacing:-.02em; }
.feature-item p { margin:0; color:var(--muted); font-size:.9rem; line-height:1.5; }

.service-process { padding:var(--space-10) 0; }
.service-process h2 { margin:20px 0 var(--space-8); font-size:clamp(2rem,3.5vw,3rem); font-weight:300; letter-spacing:-.04em; }
.process-steps { display:grid; grid-template-columns:repeat(5,1fr); gap:16px; }
.process-step { padding:28px 20px; border:1px solid rgba(244,244,244,.12); border-radius:16px; background:rgba(255,255,255,.03); transition:border-color .3s,transform .3s var(--ease-out); }
.process-step:hover { border-color:var(--cyan); transform:translateY(-4px); }
.process-step span { display:block; color:var(--cyan); font-size:.7rem; font-weight:800; letter-spacing:.1em; margin-bottom:14px; }
.process-step strong { display:block; font-size:1.1rem; margin-bottom:8px; letter-spacing:-.01em; }
.process-step p { margin:0; color:var(--muted); font-size:.85rem; line-height:1.45; }

@media (max-width:980px) {
  .service-detail-grid { grid-template-columns:1fr; }
  .service-detail-features { grid-template-columns:1fr 1fr; }
  .process-steps { grid-template-columns:repeat(3,1fr); }
}
@media (max-width:620px) {
  .service-detail-features { grid-template-columns:1fr; }
  .process-steps { grid-template-columns:1fr; }
}

/* ── Footer ── */
footer { min-height:192px; }
.footer-inner { min-height:192px; padding-block:var(--space-5); display:grid; grid-template-columns:1.2fr 1fr 1fr auto; gap:var(--space-4); align-items:end; color:var(--muted); font-size:.76rem; line-height:1.5; }
footer p { margin:0; } footer a { text-decoration:none; } footer a:not(.footer-logo):hover { color:var(--cyan); }
footer { }
.footer-social { display:flex; gap:20px; align-items:center; }
.footer-social a {
  display:inline-flex; align-items:center; justify-content:center;
  color:#f4f4f4; font-size:22px;
  transition:transform .2s;
}
.footer-social a i { font-size:22px; transition:color .2s; }
.footer-social a:hover i {
  color:transparent;
  background:linear-gradient(105deg,#4aa3df 0%,#47c6e7 55%,#4be3ef 100%);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}

@keyframes soft-pulse { to { transform:scale(1.08) rotate(6deg); opacity:.7; } }
@keyframes mark-float { to { transform:translate3d(10px,-16px,0); } }

/* ── Responsive ── */
@media (max-width:1100px) { .topbar nav { gap:16px; } .topbar nav a { font-size:.9rem; } .top-cta { padding-inline:16px; font-size:.72rem; } }
@media (max-width:980px) {
  .cursor-light { display:none; }
  .topbar,.topbar-inner { min-height:88px; }.topbar-inner { grid-template-columns:1fr auto; }.topbar nav { display:none; }
  .hero { min-height:820px; padding-top:88px; }.hero-inner { min-height:776px; }.hero-copyblock { grid-template-columns:1fr; gap:28px; }.hero-sidecopy { max-width:540px; }.hero-foot { grid-template-columns:1fr; gap:0; }
  .signal-inner { grid-template-columns:1fr; }.signal-words { min-height:88px; }.proof { min-height:78px; border-left:0; border-top:1px solid rgba(244,244,244,.3); }
  .services,.difference { background:var(--ink); }.services-inner,.about-inner,.difference-inner { grid-template-columns:1fr; }
  .services-inner { align-items:start; }
  .services-intro { position:static; top:auto; min-height:0; height:auto; overflow:visible; align-self:auto; padding:36px 18px; background:var(--cyan); }
  .services-intro::after { content:none; position:static; display:none; }
  .services-intro h2 { margin:36px 0 20px; }
  .service-list { padding:0; display:flex; flex-direction:column; gap:12px; }
  .service { min-height:0; height:auto; padding:24px 18px; border-radius:16px; grid-template-columns:1fr; gap:4px; overflow:visible; }
  .service.service-1 { margin-top:25px; }
  .service.service-4 { margin-bottom:25px; }
  .service > span { padding-top:0; position:static; }
  .service b { display:none; }
  .project { grid-column:span 6; }.project:last-child { grid-column:4/span 6; }.project:nth-child(2) { transform:none; }
  .about-copy { padding:72px 48px; }
  .difference-head { min-height:470px; padding:48px; background:var(--paper); }
  .difference ol { grid-template-columns:repeat(2,1fr); }
  .footer-inner { grid-template-columns:1fr 1fr; }
  .page-grid,.contact-grid,.project-info-grid { grid-template-columns:1fr; gap:48px; }
  .page-steps { grid-template-columns:repeat(2,1fr); }
  .instagram-head { grid-template-columns:1fr; gap:20px; }
  .page-title { font-size:clamp(2.8rem,5.5vw,5rem); }
}
@media (max-width:620px) {
  .preloader{display:none!important}
  .container { width:min(calc(100% - 36px),1280px); }
  .topbar,.topbar-inner { min-height:76px; }.brand img { width:138px; }.top-cta { font-size:.62rem; padding:11px 14px; }
  .hero { min-height:780px; padding-top:76px; }.hero-inner { min-height:742px; padding-top:20px; }.hero-copyblock { padding:54px 0 30px; }
  h1 { font-size:clamp(2.85rem,13.8vw,4.7rem); line-height:.91; padding-top:.14em; } h1 span { white-space:normal; }
  .hero-sidecopy { max-width:92%; padding:14px 0 14px 16px; font-size:.92rem; }.hero-foot { gap:var(--space-2); }.hero-ticker { height:38px; }
  .signal-words { gap:14px; }.signal-words span { gap:14px; font-size:.72rem; }.proof span { padding:12px 7px; font-size:.53rem; }
  .services-intro { position:static; top:auto; min-height:0; height:auto; overflow:visible; align-self:auto; padding:28px 18px; background:var(--cyan); margin-inline:-18px; }.services-intro h2 { margin:28px 0 16px; font-size:clamp(2.4rem,12vw,4rem); }.services-intro h2 span { white-space:normal; }
  .service-list { padding:0; display:flex; flex-direction:column; gap:10px; }
  .service { min-height:0; height:auto; padding:20px 14px; grid-template-columns:1fr; gap:4px; }.service > span { padding-top:0; position:static; top:auto; }.service b { display:none; }.service h3 { font-size:1.6rem; }
  .projects { padding-block:84px; }.section-head { align-items:flex-start; flex-direction:column; display:flex; }.section-head h2 { font-size:clamp(2.8rem,12vw,3.7rem); }.section-head h2 span { white-space:normal; }.project,.project:last-child { grid-column:1/-1; }.project-art { aspect-ratio:5/4; }
  .about-inner,.difference-inner { width:100%; }.about-hero { margin-top:38px; grid-template-columns:1fr; gap:48px; }.about-hero h2 { font-size:clamp(2.75rem,12vw,4rem); }.about-hero h2 span { white-space:normal; }.about-mark { justify-self:start; font-size:9rem; width:min(86vw,340px); }.about-copy { margin-top:48px; grid-template-columns:1fr; gap:28px; padding:68px 18px; }
  .difference-inner { width:100%; padding:0; }
  .difference-head { min-height:auto; padding:40px 18px 36px; text-align:center; background:var(--paper); margin-inline:-18px; }
  .difference h2 { font-size:clamp(2.8rem,12vw,4rem); font-weight:300; line-height:.95; letter-spacing:-.065em; text-align:center; }
  .difference h2 span { display:block; }
  .difference ol { margin:0; padding:40px 18px; grid-template-columns:1fr; gap:12px; }
  .difference li { min-height:auto; padding:24px 18px; grid-template-columns:30px 1fr; gap:10px; }
  .difference li > span { position:static; }
  .contact h2 { margin-bottom:60px; font-size:clamp(3rem,13vw,4.6rem); }.contact-cta,.contact-cta-inner { min-height:100px; }.contact-cta b { font-size:1.8rem; max-width:260px; line-height:1; }
  .footer-inner { grid-template-columns:1fr; align-items:start; }
  .page-steps { grid-template-columns:1fr; }
  .page-service { grid-template-columns:1fr; gap:12px; }
  .page-title { font-size:clamp(2.4rem,11vw,4rem); }
  .page-title span { white-space:normal; }
  .project-meta-list { gap:16px; }
  .project-next { font-size:1.4rem; }
  .project-info-grid { grid-template-columns:1fr; gap:40px; }
  .project-hero-title { font-size:clamp(2.8rem,12vw,5rem); }
  .project-hero-title span { white-space:normal; }
  .related-grid { grid-template-columns:1fr 1fr; }
  .gallery-grid-4 { grid-template-columns:repeat(3,1fr); }
  .lightbox-nav { width:40px; height:40px; font-size:1rem; }
  .lightbox-prev { left:12px; }
  .lightbox-next { right:12px; }
}
@media (max-width:620px) {
  .related-grid { grid-template-columns:1fr; }
  .gallery-grid-4 { grid-template-columns:repeat(2,1fr); }
  .lightbox-nav { width:36px; height:36px; font-size:.9rem; }
}
/* iPhone fixes */
@media (max-width:430px) {
  .hero { min-height:600px; padding-top:76px; }
  .hero-inner { min-height:auto; }
  .hero-copyblock { padding:20px 0 10px; }
  .difference h2 { font-size:clamp(2rem,8.5vw,3rem); }
  .difference li::after { font-family:system-ui,-apple-system,sans-serif; text-rendering:geometricPrecision; -webkit-font-smoothing:antialiased; }
  .contact { padding-top:var(--space-8); }
  .contact h2 { margin:var(--space-4) 0 var(--space-6); font-size:clamp(2.4rem,11vw,3.5rem); }
  .contact-cta b { font-size:1.4rem; }
  .contact-cta i { font-family:system-ui,-apple-system,sans-serif; text-rendering:geometricPrecision; -webkit-font-smoothing:antialiased; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
  .hero::before { animation:none!important; transform:none!important; }
  .hero-orbit { animation:none!important; }
  .about-mark { animation:none!important; }
  .about-mark.entry-reveal img { opacity:1!important; transform:none!important; transition:none!important; }
  .cursor,.cursor-follower { display:none!important; }
  .preloader { display:none!important; }
  .hero-copyblock h1 span,.hero-sidecopy,.hero-foot,.hero-ticker { opacity:1!important; transform:none!important; }
  .char-wrap { opacity:1!important; transform:none!important; }
}
html,body { max-width:100%; overflow-x:clip; }
@media (max-width:620px) {
  body,main,header,section,footer { max-width:100%; }
  .container { width:calc(100% - var(--space-4)); max-width:calc(100% - var(--space-4)); }
  .service:hover,.signal:hover .signal-words span,.top-cta:hover { transform:none; }
  h1,h2,h3,p,strong { max-width:100%; overflow-wrap:break-word; }
  img { max-width:100%; }.hero-ticker { width:100%; max-width:100%; }
}