﻿/* â”€â”€ E-commerce service page â”€â”€ */
/* Hero e-commerce â€” uma vitrine construÃ­da, nÃ£o uma fotografia de banco. */
.commerce-hero{position:relative;isolation:isolate;padding-block:clamp(8rem,14vh,11rem) clamp(5rem,8vw,8.5rem);background:radial-gradient(circle at 78% 40%,rgba(36,87,255,.27),transparent 24rem),linear-gradient(120deg,#080d1b 0%,#0c1429 58%,#131f43 100%)}
.commerce-hero:after{position:absolute;z-index:-1;right:-10vw;bottom:-17vw;width:45vw;height:45vw;border:1px solid rgba(140,255,209,.16);border-radius:50%;content:""}
.commerce-hero__layout{grid-template-columns:minmax(0,.92fr) minmax(27rem,.88fr);gap:clamp(3rem,7vw,8rem)}
.commerce-hero h1{max-width:10.6ch;font-size:clamp(3.45rem,5.5vw,6.1rem);line-height:.91;letter-spacing:-.078em}
.commerce-hero__intro{max-width:31rem;margin-top:2rem}
.commerce-hero__visual{position:relative;width:min(100%,38rem);min-height:32rem;margin:0 0 0 auto}
.commerce-storefront{position:absolute;inset:0 3.35rem 2.9rem 0;overflow:hidden;border:1px solid rgba(234,240,255,.28);background:#eaf0ff;box-shadow:0 2.1rem 5.5rem rgba(0,0,0,.27)}
.commerce-storefront:after{position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.36),transparent 35%,rgba(8,13,27,.09));content:"";pointer-events:none}
.commerce-storefront__top{position:relative;z-index:1;display:flex;align-items:center;height:3.35rem;padding:0 1.1rem;border-bottom:1px solid rgba(11,16,32,.15);color:#0b1020;font-size:.5rem;font-style:normal;font-weight:800;letter-spacing:.1em}
.commerce-storefront__top i{width:.38rem;height:.38rem;margin-right:.28rem;border-radius:50%;background:#0b1020}.commerce-storefront__top span{flex:1}.commerce-storefront__top b{font-size:.6rem;letter-spacing:.13em}.commerce-storefront__top em{margin-left:auto;font-style:normal}
.commerce-storefront__canvas{position:absolute;inset:3.35rem 0 3.2rem;overflow:hidden;background:linear-gradient(153deg,#cad7f7 0 38%,#9cb2f5 38% 66%,#eff4ff 66%)}
.commerce-storefront__sun{position:absolute;top:7%;right:9%;width:21%;aspect-ratio:1;border:1px solid rgba(11,16,32,.34);border-radius:50%}
.commerce-storefront__orb{position:absolute;display:block;border-radius:47% 53% 51% 49% / 38% 47% 53% 62%;background:linear-gradient(135deg,#72ffd2 2%,#2354ff 56%,#101942 100%);box-shadow:inset -.8rem -.8rem 1.8rem rgba(4,9,44,.28),inset .7rem .7rem 1.5rem rgba(255,255,255,.38),1rem 1.4rem 1.4rem rgba(8,15,41,.16)}
.commerce-storefront__orb--one{z-index:2;top:21%;left:21%;width:43%;aspect-ratio:1;transform:rotate(-24deg)}.commerce-storefront__orb--two{z-index:1;right:9%;bottom:14%;width:27%;aspect-ratio:1;transform:rotate(54deg);filter:saturate(.8)}.commerce-storefront__orb--three{bottom:17%;left:8%;width:17%;aspect-ratio:1;transform:rotate(12deg);background:#0b1020}
.commerce-storefront__base{position:absolute;z-index:3;bottom:21%;left:16%;width:54%;height:10%;border-radius:50%;background:rgba(8,14,37,.28);filter:blur(8px)}.commerce-storefront__floor{position:absolute;right:-10%;bottom:-24%;width:93%;height:52%;border:1px solid rgba(11,16,32,.22);border-radius:50%;transform:rotate(-25deg)}
.commerce-storefront__bottom{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:center;height:3.2rem;padding:0 1.1rem;color:#0b1020;font-size:.55rem;font-weight:800;letter-spacing:.08em}.commerce-storefront__bottom span{flex:1;border-top:1px solid rgba(11,16,32,.25);margin:0 1rem}.commerce-storefront__bottom em{font-style:normal}
.commerce-cart-card{position:absolute;right:0;bottom:0;width:min(16.8rem,47%);padding:1rem;border:1px solid rgba(140,255,209,.7);background:#111b38;color:#eaf0ff;box-shadow:1.2rem 1.2rem 0 #2457ff,0 1.8rem 3.2rem rgba(0,0,0,.26)}
.commerce-cart-card__head,.commerce-cart-card__total{display:flex;justify-content:space-between;font-size:.58rem;font-weight:800;letter-spacing:.11em}.commerce-cart-card__head{padding-bottom:.85rem;border-bottom:1px solid rgba(234,240,255,.18);color:#8cffd1}.commerce-cart-card__item{display:grid;grid-template-columns:2.35rem 1fr auto;align-items:center;gap:.65rem;padding:1rem 0;border-bottom:1px solid rgba(234,240,255,.18)}.commerce-cart-card__item i{display:block;width:2.35rem;aspect-ratio:1;border-radius:39% 61% 48% 52% / 43% 45% 55% 57%;background:linear-gradient(135deg,#8cffd1,#2457ff 60%,#131a3d);transform:rotate(-22deg)}.commerce-cart-card__item b,.commerce-cart-card__item em{font-size:.62rem;font-style:normal}.commerce-cart-card__item small{display:block;margin-top:.2rem;color:#9aa6c4;font-size:.5rem}.commerce-cart-card__total{padding:1rem 0;color:#fff}.commerce-cart-card__button{display:flex;justify-content:space-between;padding:.72rem .78rem;background:#8cffd1;color:#0b1020;font-size:.5rem;font-weight:800;letter-spacing:.08em}.commerce-cart-card__button b{font-size:.85rem;line-height:.5rem}.commerce-hero__visual figcaption{position:absolute;bottom:-3.55rem;left:0;color:rgba(234,240,255,.56);font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
@media (max-width:800px){.commerce-hero{padding-block:7.5rem 7rem}.commerce-hero__layout{grid-template-columns:1fr;gap:3.5rem}.commerce-hero__visual{width:min(100%,34rem);min-height:27rem;margin:0 auto}.commerce-hero__visual figcaption{bottom:-2.5rem}.commerce-storefront{inset:0 2.4rem 2.2rem 0}.commerce-cart-card{width:min(16rem,49%);box-shadow:.85rem .85rem 0 #2457ff}.commerce-hero h1{font-size:clamp(3.3rem,10vw,5rem)}}
@media (max-width:460px){.commerce-hero__visual{min-height:22rem}.commerce-storefront__top{height:2.7rem;padding:0 .7rem}.commerce-storefront__canvas{inset:2.7rem 0 2.7rem}.commerce-storefront__bottom{height:2.7rem;padding:0 .7rem}.commerce-cart-card{padding:.7rem}.commerce-cart-card__item{grid-template-columns:1.8rem 1fr;padding:.7rem 0}.commerce-cart-card__item i{width:1.8rem}.commerce-cart-card__item em{display:none}.commerce-cart-card__button{padding:.62rem;font-size:.43rem}.commerce-hero__visual figcaption{font-size:.48rem}}

/* Hero e-commerce: uma cena de compra, sem painel de texto concorrendo com a chamada. */
.commerce-hero{padding-block:clamp(8rem,14vh,11rem) clamp(4.5rem,7vw,7.5rem)}
.commerce-hero__layout{grid-template-columns:minmax(0,.94fr) minmax(20rem,.76fr);gap:clamp(3rem,7vw,8rem)}
.commerce-hero h1{max-width:10.8ch;font-size:clamp(3.5rem,5.75vw,6.2rem)}
.commerce-hero__intro{max-width:31rem;margin-top:1.5rem}
.commerce-hero__visual{position:relative;isolation:isolate;width:100%;max-width:32rem;margin:0;justify-self:end;aspect-ratio:4 / 5;overflow:hidden;background:var(--commerce-blue);box-shadow:clamp(.875rem,2vw,1.5rem) clamp(.875rem,2vw,1.5rem) 0 var(--commerce-blue)}
.commerce-hero__visual::after{position:absolute;z-index:1;inset:0;background:linear-gradient(135deg,rgba(11,16,32,.08),rgba(11,16,32,.5));content:""}
.commerce-hero__visual img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.8) contrast(1.08)}
.commerce-hero__cart{position:absolute;z-index:2;right:clamp(1.25rem,4vw,3rem);bottom:clamp(1.25rem,4vw,3rem);width:clamp(7rem,14vw,10rem);height:auto;color:var(--commerce-mint);filter:drop-shadow(0 0 1rem rgba(140,255,209,.32))}
@media(max-width:980px){.commerce-hero__layout{grid-template-columns:1fr}.commerce-hero__visual{justify-self:start;max-width:34rem;aspect-ratio:16 / 10}.commerce-hero__visual img{object-position:center 62%}}
@media(max-width:640px){.commerce-hero{padding-top:8rem}.commerce-hero h1{font-size:clamp(3.1rem,13vw,4.6rem)}.commerce-hero__visual{max-width:none;aspect-ratio:1 / 1}.commerce-hero__cart{width:clamp(6.5rem,32vw,9rem)}}
.commerce-thesis{padding:clamp(90px,13vw,180px) 0;background:#eaf0ff;color:var(--commerce-night)}.commerce-thesis__grid{display:grid;grid-template-columns:minmax(150px,.48fr) minmax(0,1.55fr) minmax(230px,.72fr);gap:clamp(25px,5vw,82px);align-items:start}.commerce-thesis .commerce-eyebrow,.commerce-thesis h2 em{color:#1a49d6}.commerce-thesis h2{margin:0;font-size:clamp(2.8rem,5.2vw,5.7rem)}.commerce-thesis__copy{padding-top:13px;color:#4b5872;font-size:1rem;line-height:1.65}.commerce-thesis__copy p{margin:0}.commerce-thesis__copy p+p{margin-top:20px}
.commerce-decisions{padding:clamp(90px,12vw,160px) 0;background:var(--commerce-night);color:var(--commerce-paper)}.commerce-section-head{display:grid;grid-template-columns:minmax(180px,.55fr) minmax(0,1.45fr);gap:clamp(24px,5vw,80px);align-items:start;margin-bottom:clamp(46px,7vw,88px)}.commerce-section-head h2{margin:0;max-width:820px;font-size:clamp(2.5rem,4.7vw,5rem)}.commerce-decisions__list{border-top:1px solid var(--commerce-line)}.commerce-decisions__list article{display:grid;grid-template-columns:80px minmax(0,1fr) auto;gap:24px;align-items:start;padding:29px 0 31px;border-bottom:1px solid var(--commerce-line)}.commerce-index{color:var(--commerce-mint);font-size:.72rem;font-weight:800}.commerce-decisions h3{margin:0;font-size:clamp(1.35rem,2vw,1.9rem);letter-spacing:-.045em}.commerce-decisions article p{max-width:630px;margin:8px 0 0;color:var(--commerce-muted);font-size:.94rem;line-height:1.55}.commerce-tag{align-self:center;padding:8px 11px;border:1px solid rgba(234,240,255,.2);border-radius:99px;color:var(--commerce-muted);font-size:.59rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.commerce-method{padding:clamp(90px,12vw,160px) 0;background:#111a33;color:var(--commerce-paper)}.commerce-method__head{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(240px,.55fr);gap:clamp(36px,8vw,120px);align-items:end}.commerce-method h2{max-width:780px;font-size:clamp(2.6rem,5vw,5.4rem)}.commerce-method__head>p{margin:0 0 7px;color:var(--commerce-muted);line-height:1.6}.commerce-method__steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:clamp(50px,7vw,90px) 0 0;padding:0;border-top:1px solid var(--commerce-line);list-style:none}.commerce-method__steps li{min-height:245px;padding:24px 24px 0;border-left:1px solid var(--commerce-line)}.commerce-method__steps li:first-child{padding-left:0;border-left:0}.commerce-method__steps li>span{color:var(--commerce-mint);font-size:.68rem;font-weight:800}.commerce-method__steps h3{margin:63px 0 0;font-size:1.25rem}.commerce-method__steps p{margin:10px 0 0;color:var(--commerce-muted);font-size:.82rem;line-height:1.52}
.commerce-cta{padding:clamp(92px,13vw,168px) 0;background:var(--commerce-blue);color:var(--commerce-paper)}.commerce-cta__inner{max-width:1050px}.commerce-cta h2{max-width:920px;font-size:clamp(3rem,6.2vw,6.6rem)}.commerce-cta>div>p:not(.commerce-eyebrow){max-width:540px;margin:29px 0 0;color:rgba(234,240,255,.82);line-height:1.6}.commerce-cta__link{display:inline-flex;gap:18px;align-items:center;margin-top:35px;padding:15px 20px;border:1px solid var(--commerce-mint);background:var(--commerce-mint);color:var(--commerce-night);font-size:.78rem;font-weight:800;text-decoration:none;transition:transform .25s var(--ease-out),background .25s}.commerce-cta__link:hover{transform:translate(-3px,-3px);background:var(--commerce-paper)}
@media(max-width:980px){.commerce-hero__layout{grid-template-columns:1fr}.commerce-route{width:min(100%,590px)}.commerce-thesis__grid{grid-template-columns:minmax(145px,.4fr) minmax(0,1fr)}.commerce-thesis__copy{grid-column:2}.commerce-method__steps{grid-template-columns:repeat(2,minmax(0,1fr))}.commerce-method__steps li:nth-child(3){padding-left:0;border-left:0;border-top:1px solid var(--commerce-line)}.commerce-method__steps li:nth-child(4){border-top:1px solid var(--commerce-line)}}
@media(max-width:640px){.commerce-hero{padding-top:8rem}.commerce-hero h1{font-size:clamp(2.75rem,12vw,3.8rem)}.commerce-hero__facts{grid-template-columns:1fr;gap:.75rem;margin-top:2.1875rem}.commerce-route{padding:17px;box-shadow:10px 10px 0 rgba(36,87,255,.28)}.commerce-thesis__grid,.commerce-section-head,.commerce-method__head{grid-template-columns:1fr}.commerce-thesis h2{font-size:clamp(2.7rem,12vw,4rem)}.commerce-thesis__copy{grid-column:auto;padding-top:0}.commerce-section-head{margin-bottom:42px}.commerce-section-head h2,.commerce-method h2{font-size:clamp(2.45rem,11vw,3.8rem)}.commerce-decisions__list article{grid-template-columns:48px minmax(0,1fr);gap:14px}.commerce-tag{grid-column:2;justify-self:start}.commerce-method__steps{grid-template-columns:1fr}.commerce-method__steps li,.commerce-method__steps li:nth-child(3){min-height:0;padding:23px 0;border-top:1px solid var(--commerce-line);border-left:0}.commerce-method__steps li:first-child{border-top:0}.commerce-method__steps h3{margin-top:30px}.commerce-cta h2{font-size:clamp(3rem,13vw,4.4rem)}}
@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.entry-reveal-tilt-left { transform:translateX(-38px) rotate(-5deg); transform-origin:0 50%; }
.entry-reveal.entry-reveal-tilt-right { transform:translateX(38px) rotate(5deg); transform-origin:100% 50%; }
.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-list a.service { color:inherit; text-decoration:none; }
.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; filter:blur(12px); transform:translate3d(0,44px,0) scale(.78) rotate(-8deg); transition:opacity .75s var(--ease-out),filter 1.05s var(--ease-out),transform 1.15s var(--ease-spring); transition-delay:.2s; }
.about-mark.entry-reveal.is-visible img { opacity:1; filter:none; 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:"\2197"; 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(140px,18vh,220px);
  overflow:hidden;
  background:#050608;
  display:flex;
  align-items:center;
}
.page-hero::before {
  content:"";
  position:absolute;
  z-index:-3;
  inset:-4%;
  background:var(--hero-bg,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:30px;
  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-link { display:block; text-decoration:none; color:inherit; }
.page-service {
  display:grid;
  grid-template-columns:60px 1fr 40px;
  gap:28px;
  padding:44px 24px;
  margin:0 -24px;
  border-bottom:1px solid rgba(244,244,244,.08);
  border-radius:12px;
  align-items:center;
  transition:background .3s var(--ease-out);
}
.page-service:last-child { border-bottom:none; }
.page-service-link:hover .page-service { background:rgba(20,20,20,.6); }
.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;
  transition:transform .3s var(--ease-out);
}
.page-service-link:hover .page-service h2 { transform:translateX(8px); }
.page-service p { margin:0; color:var(--muted); font-size:1.05rem; line-height:1.6; max-width:600px; }
.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); }

/* â”€â”€ 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; }


/* Social Media */
.sm-page{background:#0a0a0a;color:#f4f4f4;font-family:var(--sans)}
.sm-page h1,.sm-page h2,.sm-page h3,.sm-page p{margin-top:0}
.sm-page h1,.sm-page h2,.sm-page h3{font-family:var(--sans);letter-spacing:-.07em}
.sm-label{display:block;margin:0 0 1.5rem;font-size:.63rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:#01f9de}
.sm-label--dark{color:#013fc9}
.sm-btn{display:inline-flex;align-items:center;gap:1rem;padding:16px 24px;background:#01f9de;color:#0a0a0a;font-size:.65rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;transition:transform .25s var(--ease-out),background .25s}
.sm-btn:hover{transform:translateY(-3px);background:#fff}
.sm-hero{padding:0;background:#0a0a0a;overflow:hidden}
.sm-hero-wrap{position:relative;display:flex;align-items:center;min-height:calc(100svh - 104px)}
.sm-hero-left{position:relative;z-index:2;width:min(calc(100% - 48px),1280px);margin:0 auto;padding:calc(clamp(6rem,10vh,8rem) + 50px) 24px clamp(6rem,10vh,8rem)}
.sm-hero h1{margin:0;font-size:clamp(3.5rem,6.5vw,7rem);font-weight:800;line-height:.86;letter-spacing:-.07em;text-transform:uppercase}
.sm-hero h1 em,.sm-statement h2 em,.sm-about h2 em,.sm-deliver h2 em{color:#01f9de;font-style:normal}
.sm-hero-sub{margin:1.8rem 0 2rem;max-width:30rem;color:rgba(244,244,244,.72);font-size:1.05rem;line-height:1.6}

/* Slider — positioned to the right, overflowing */
.sm-hero-right{position:absolute;top:50px;right:0;bottom:0;left:50%;overflow:hidden;z-index:1}
.sm-slider-mask{height:100%;mask:linear-gradient(90deg,transparent 0%,#000 12%,#000 92%,transparent 100%);-webkit-mask:linear-gradient(90deg,transparent 0%,#000 12%,#000 92%,transparent 100%)}
.sm-slider-track{display:flex;gap:14px;width:max-content;height:100%;animation:slider-scroll 35s linear infinite;align-items:center}
.sm-slider-item{flex:none;height:85%;aspect-ratio:4/5;border-radius:8px;overflow:hidden}
.sm-slider-item img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .3s,filter .3s;filter:saturate(.85)}
.sm-slider-item:hover img{transform:scale(1.05);filter:saturate(1.1)}
@keyframes slider-scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.sm-slider-track{animation:none}}
.sm-statement{padding:clamp(5rem,10vw,10rem) 0;background:#111}
.sm-statement h2{margin:0 0 2rem;font-size:clamp(2.8rem,5.5vw,6rem);font-weight:800;line-height:.87;letter-spacing:-.07em;text-transform:uppercase;max-width:16ch}
.sm-statement p{max-width:44rem;font-size:1.05rem;line-height:1.65;color:rgba(244,244,244,.7)}
.sm-infinite{padding:clamp(3rem,5vw,5rem) 0;background:#0a0a0a;overflow:hidden;display:flex;flex-direction:column;gap:14px}
.sm-infinite-row{overflow:hidden}
.sm-infinite-track{display:flex;gap:12px;width:max-content;will-change:transform}
.sm-infinite-item{flex:none;width:clamp(160px,18vw,260px);aspect-ratio:4/5;border-radius:8px;overflow:hidden}
.sm-infinite-item img{display:block;width:100%;height:100%;object-fit:cover;filter:saturate(.85);transition:filter .3s,transform .3s}
.sm-infinite-item:hover img{filter:saturate(1.1);transform:scale(1.05)}
.sm-about{padding:clamp(5rem,10vw,10rem) 0;background:#111}
.sm-about-grid{display:grid;grid-template-columns:minmax(20rem,.8fr) minmax(0,1fr);gap:clamp(3rem,6vw,7rem);align-items:center}
.sm-about-visual img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:4px}
.sm-about h2{margin:0 0 2rem;font-size:clamp(2.5rem,4.5vw,5rem);font-weight:800;line-height:.88;letter-spacing:-.07em;text-transform:uppercase}
.sm-about p{font-size:1.05rem;line-height:1.6;color:rgba(244,244,244,.7)}
.sm-about p:first-of-type{color:#f4f4f4}
.sm-deliver{padding:clamp(5rem,10vw,10rem) 0;background:#0a0a0a}
.sm-deliver h2{margin:0 0 clamp(3rem,5vw,5rem);font-size:clamp(2.8rem,5.5vw,6rem);font-weight:800;line-height:.87;letter-spacing:-.07em;text-transform:uppercase}
.sm-deliver-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid rgba(244,244,244,.1)}
.sm-deliver-card{padding:32px 24px;border-right:1px solid rgba(244,244,244,.1);min-height:260px;display:flex;flex-direction:column}
.sm-deliver-card:last-child{border-right:0}
.sm-deliver-icon{width:48px;height:48px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:rgba(1,249,222,.1);color:#01f9de;font-size:1.1rem;margin-bottom:20px}
.sm-deliver-card h3{margin:0 0 12px;font-size:1.2rem;font-weight:800;letter-spacing:-.03em;line-height:1}
.sm-deliver-card p{margin:0;color:rgba(244,244,244,.55);font-size:.9rem;line-height:1.55}
.sm-end{padding:clamp(8rem,15vw,15rem) 0;background:#01f9de;color:#0a0a0a;text-align:center}
.sm-end h2{margin:0 0 3rem;font-size:clamp(3rem,7vw,8rem);font-weight:800;line-height:.85;letter-spacing:-.08em;text-transform:uppercase}
.sm-end .sm-btn{background:#0a0a0a;color:#f4f4f4}
.sm-end .sm-btn:hover{background:#013fc9;color:#fff}
@media(max-width:900px){
  .sm-about-grid{grid-template-columns:1fr;gap:3rem}
  .sm-deliver-grid{grid-template-columns:repeat(2,1fr)}
  .sm-hero-wrap{flex-direction:column;align-items:stretch}
  .sm-hero-left{width:100%;padding-left:24px;padding-right:24px}
  .sm-hero-right{position:relative;top:auto;left:auto;right:auto;bottom:auto;height:clamp(220px,35vw,320px);width:100%}
}
@media(max-width:620px){
  .sm-hero{padding-top:0;padding-bottom:0}
  .sm-hero-wrap{flex-direction:column;align-items:stretch;min-height:auto}
  .sm-hero-left{width:100%;padding:calc(clamp(5rem,8vh,7rem) + 20px) 20px clamp(2rem,4vh,3rem)}
  .sm-hero h1{font-size:clamp(2.2rem,10vw,3.5rem)}
  .sm-hero-sub{margin:1.2rem 0 1.5rem;font-size:.95rem}
  .sm-hero-right{position:relative;top:auto;left:auto;right:auto;bottom:auto;height:clamp(200px,50vw,300px);width:100%;overflow:hidden}
  .sm-statement h2,.sm-about h2,.sm-deliver h2{font-size:clamp(2.2rem,11vw,3.5rem)}
  .sm-deliver-grid{grid-template-columns:1fr}

  .sm-btn{width:100%;max-width:280px}
  .sm-end h2 br{display:none}
}
@media(prefers-reduced-motion:reduce){
  .sm-btn,.sm-project-card img,.sm-scroll-reel__track img{transition:none}
}
/* 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:20ch;
  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) {
  .social-case__slide { flex-basis:75vw; }
  .social-case__slide:hover { box-shadow:10px 10px 0 #1d45ed; transform:none; }

  .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 â”€â”€ */

/* â”€â”€ Ecommerce Page â”€â”€ */
.ec-platforms { padding:var(--space-6) 0; border-bottom:1px solid rgba(244,244,244,.08); }
.ec-platforms .kicker { margin-bottom:var(--space-4); }
.ec-platforms-grid { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }
.ec-platform { display:flex; align-items:center; gap:10px; padding:14px 24px; border:1px solid rgba(244,244,244,.1); border-radius:999px; background:rgba(255,255,255,.03); transition:all .3s var(--ease-out); }
.ec-platform:hover { border-color:var(--cyan); background:rgba(1,249,222,.08); transform:translateY(-2px); }
.ec-platform i { font-size:1.2rem; color:var(--cyan); }
.ec-platform span { font-size:.85rem; font-weight:600; }

.ec-showcase { padding:var(--space-8) 0; }
.ec-showcase-layout { display:grid; grid-template-columns:1.3fr 1fr; gap:48px; align-items:start; }
.ec-showcase-text { position:sticky; top:120px; }
.ec-showcase-text .kicker { margin-bottom:12px; }
.ec-showcase-text .service-headline { font-size:clamp(2rem,3.5vw,3rem); margin-bottom:20px; }
.ec-showcase-text p { color:var(--muted); font-size:clamp(1rem,1.15vw,1.1rem); line-height:1.7; max-width:420px; margin:0; }

.ec-gallery { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.ec-gallery-item { position:relative; border-radius:16px; overflow:hidden; cursor:pointer; }
.ec-gallery-item img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s var(--ease-out); }
.ec-gallery-item:hover img { transform:scale(1.06); }
.ec-gallery-overlay { position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.8) 0%,transparent 50%); display:flex; align-items:flex-end; padding:20px; opacity:0; transition:opacity .4s var(--ease-out); }
.ec-gallery-item:hover .ec-gallery-overlay { opacity:1; }
.ec-gallery-overlay span { color:var(--paper); font-size:.9rem; font-weight:700; }
.ec-gallery-large { grid-row:span 2; }
.ec-gallery-large img { height:100%; }
.ec-gallery-wide { grid-column:span 2; }
.ec-gallery-wide img { height:260px; }

.ec-stats { padding:var(--space-8) 0; background:linear-gradient(135deg,rgba(1,63,201,.12),rgba(1,249,222,.06)); }
.ec-stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; text-align:center; }
.ec-stat-item { display:flex; flex-direction:column; gap:8px; }
.ec-stat-number { font-size:clamp(2.5rem,4vw,3.5rem); font-weight:800; color:var(--cyan); letter-spacing:-.03em; line-height:1; }
.ec-stat-label { color:var(--muted); font-size:.9rem; line-height:1.4; }

.ec-features { padding:var(--space-10) 0 var(--space-12); }
.ec-features .kicker { margin-bottom:12px; }
.ec-features-title { margin:0 0 var(--space-8); font-size:clamp(2rem,3.5vw,3rem); font-weight:300; letter-spacing:-.04em; }
.ec-features-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.ec-feature { padding:clamp(28px,3vw,36px); border:1px solid rgba(244,244,244,.1); border-radius:18px; background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,.015)); transition:all .4s var(--ease-out); }
.ec-feature:hover { border-color:rgba(1,249,222,.3); transform:translateY(-6px); box-shadow:0 20px 48px rgba(0,0,0,.2); }
.ec-feature-icon { width:56px; height:56px; display:flex; align-items:center; justify-content:center; border-radius:14px; background:rgba(1,249,222,.1); color:var(--cyan); font-size:1.4rem; margin-bottom:20px; }
.ec-feature h3 { margin:0 0 12px; font-size:1.15rem; font-weight:700; letter-spacing:-.02em; }
.ec-feature p { margin:0; color:var(--muted); font-size:.9rem; line-height:1.55; }

@media (max-width:980px) {
  .ec-showcase-layout { grid-template-columns:1fr; }
  .ec-showcase-text { position:static; text-align:center; }
  .ec-showcase-text p { max-width:none; margin-inline:auto; }
  .ec-gallery-large { grid-row:span 1; }
  .ec-gallery-large img { height:260px; }
  .ec-features-grid { grid-template-columns:1fr 1fr; }
  .ec-stats-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:620px) {
  .ec-platforms-grid { gap:8px; }
  .ec-platform { padding:10px 16px; font-size:.8rem; }
  .ec-platform span { display:none; }
  .ec-showcase-text .kicker { text-align:left; }
  .ec-showcase-text .service-headline { text-align:left; }
  .ec-showcase-text p { text-align:left; margin-left:0; }
  .ec-gallery { grid-template-columns:1fr; }
  .ec-gallery-wide { grid-column:span 1; }
  .ec-gallery-wide img { height:220px; }
  .ec-features-grid { grid-template-columns:1fr; }
  .ec-stats-grid { grid-template-columns:1fr 1fr; gap:24px; }
}

/* â”€â”€ Ecommerce: conversion journey refresh â”€â”€ */
.ec-hero { min-height:clamp(620px,78vh,780px); }
.ec-hero-content { padding-block:clamp(148px,18vh,220px) 76px; }.ec-hero .page-title { max-width:900px; }
.ec-hero-lead { max-width:590px; margin:30px 0 0; color:rgba(244,244,244,.84); font-size:clamp(1.06rem,1.45vw,1.28rem); line-height:1.55; }
.ec-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:22px; margin-top:34px; }
.ec-cta-primary { display:inline-flex; align-items:center; gap:18px; padding:17px 21px; background:var(--cyan); border:1px solid var(--cyan); color:var(--ink); font-size:.82rem; font-weight:800; letter-spacing:.04em; text-decoration:none; transition:background .3s,color .3s,transform .3s var(--ease-out),box-shadow .3s; }.ec-cta-primary:hover { transform:translateY(-3px); background:var(--paper); border-color:var(--paper); box-shadow:0 16px 34px rgba(1,249,222,.16); }.ec-cta-primary span { font-size:1.15rem; }
.ec-cta-text { color:var(--paper); font-size:.82rem; font-weight:700; text-decoration:none; border-bottom:1px solid rgba(244,244,244,.4); padding-bottom:5px; transition:color .25s,border-color .25s; }.ec-cta-text:hover { color:var(--cyan); border-color:var(--cyan); }
.ec-hero-notes { display:flex; flex-wrap:wrap; gap:0; margin:clamp(48px,7vw,76px) 0 0; padding:0; list-style:none; }.ec-hero-notes li { padding:0 18px; border-left:1px solid rgba(244,244,244,.3); color:rgba(244,244,244,.7); font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }.ec-hero-notes li:first-child { padding-left:0; border-left:0; }
.ec-section-intro { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,.76fr); gap:18px 64px; align-items:end; margin-bottom:40px; }.ec-section-intro .kicker { grid-column:1 / -1; color:var(--cyan); }.ec-section-intro h2 { max-width:640px; margin:0; font-size:clamp(2rem,3.4vw,3.25rem); font-weight:300; line-height:.98; letter-spacing:-.05em; }.ec-section-intro > p:last-child { margin:0; color:var(--muted); font-size:1rem; line-height:1.65; }
.ec-journey { padding:clamp(84px,11vw,144px) 0; overflow:hidden; background:linear-gradient(115deg,#081a48 0%,#0b234f 48%,#0f1c2d 100%); }.ec-journey-head { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(250px,.65fr); gap:22px 80px; align-items:end; }.ec-journey-head .kicker { grid-column:1 / -1; color:var(--cyan); }.ec-journey-head h2 { max-width:820px; margin:0; font-size:clamp(2.35rem,4.4vw,4.6rem); font-weight:300; line-height:.93; letter-spacing:-.06em; }.ec-journey-head > p:last-child { margin:0 0 4px; color:rgba(244,244,244,.72); line-height:1.65; }
.ec-journey-track { position:relative; display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin:clamp(54px,7vw,84px) 0 0; padding:0; list-style:none; }.ec-journey-track::before { content:""; position:absolute; top:37px; left:8%; right:8%; height:1px; background:linear-gradient(90deg,transparent,rgba(1,249,222,.8) 14%,rgba(1,249,222,.35) 86%,transparent); }.ec-journey-step { position:relative; padding:0 14px 0 0; }.ec-step-number { display:block; margin-bottom:18px; color:var(--cyan); font-size:.7rem; font-weight:800; letter-spacing:.12em; }.ec-journey-step > i { position:relative; z-index:1; display:flex; align-items:center; justify-content:center; width:40px; height:40px; margin-bottom:28px; border:1px solid rgba(1,249,222,.7); border-radius:50%; background:#102957; color:var(--cyan); font-size:.9rem; box-shadow:0 0 0 7px #102957; }.ec-journey-step h3 { margin:0 0 10px; font-size:1.2rem; letter-spacing:-.03em; }.ec-journey-step p { margin:0; color:rgba(244,244,244,.65); font-size:.9rem; line-height:1.52; }
.ec-gallery-item { appearance:none; width:100%; padding:0; border:0; border-radius:16px; background:transparent; color:inherit; text-align:left; }.ec-gallery-item:hover img,.ec-gallery-item:focus-visible img { transform:scale(1.06); }.ec-gallery-overlay { flex-direction:column; justify-content:flex-end; gap:4px; opacity:0; }.ec-gallery-item:hover .ec-gallery-overlay,.ec-gallery-item:focus-visible .ec-gallery-overlay { opacity:1; }.ec-gallery-overlay strong { color:var(--paper); font-size:.92rem; font-weight:700; }.ec-gallery-overlay small { color:rgba(244,244,244,.72); font-size:.72rem; }.ec-gallery-item:focus-visible { outline:2px solid var(--cyan); outline-offset:4px; }.ec-showcase-text p + p { margin-top:14px; }.ec-inline-link { display:inline-flex; gap:10px; margin-top:28px; color:var(--cyan); font-size:.84rem; font-weight:800; text-decoration:none; border-bottom:1px solid rgba(1,249,222,.45); padding-bottom:6px; transition:color .25s,border-color .25s; }.ec-inline-link:hover { color:var(--paper); border-color:var(--paper); }
.ec-deliverables { padding:var(--space-12) 0; border-top:1px solid rgba(244,244,244,.09); }.ec-deliverables-head { display:flex; justify-content:space-between; gap:32px; align-items:end; margin-bottom:var(--space-8); }.ec-deliverables-head .kicker { color:var(--cyan); }.ec-deliverables-head h2 { max-width:670px; margin:0; font-size:clamp(2rem,3.5vw,3.3rem); font-weight:300; line-height:.98; letter-spacing:-.05em; }.ec-final-cta p:not(.kicker) { max-width:520px; margin:22px auto 30px; color:rgba(244,244,244,.72); font-size:1.05rem; line-height:1.6; }
@media (max-width:980px) { .ec-section-intro,.ec-journey-head { grid-template-columns:1fr; gap:18px; }.ec-section-intro .kicker,.ec-journey-head .kicker { grid-column:auto; }.ec-journey-track { grid-template-columns:repeat(3,1fr); row-gap:42px; }.ec-journey-track::before { display:none; }.ec-deliverables-head { display:block; }.ec-deliverables-head h2 { margin-top:14px; } }
@media (max-width:620px) { .ec-hero { min-height:620px; }.ec-hero-content { padding-top:136px; }.ec-hero .page-title { font-size:clamp(3rem,13vw,4.4rem); }.ec-hero .page-title span { white-space:normal; }.ec-hero-notes { gap:12px 0; }.ec-hero-notes li { font-size:.62rem; padding-inline:12px; }.ec-hero-notes li:first-child { padding-left:0; }.ec-platform { padding:10px 13px; font-size:.8rem; }.ec-platform span { font-size:.75rem; }.ec-journey { padding-block:72px; }.ec-journey-track { grid-template-columns:1fr; gap:0; margin-top:46px; }.ec-journey-step { display:grid; grid-template-columns:44px 1fr; column-gap:16px; padding:0 0 28px; }.ec-step-number { grid-column:1; margin:3px 0 0; }.ec-journey-step > i { grid-column:1; grid-row:2 / span 2; margin:13px 0 0; }.ec-journey-step h3,.ec-journey-step p { grid-column:2; }.ec-journey-step h3 { margin:10px 0 8px; }.ec-journey-step p { max-width:360px; }.ec-journey-step:not(:last-child)::after { content:""; position:absolute; left:20px; top:72px; bottom:0; width:1px; background:rgba(1,249,222,.35); }.ec-gallery { grid-template-columns:1fr; }.ec-gallery-large { grid-row:span 1; }.ec-gallery-large img { height:250px; } }

/* â”€â”€ Identidade Visual Page â”€â”€ */
.iv-gallery { padding:var(--space-8) 0; }
.iv-gallery-layout { display:grid; grid-template-columns:1fr 1.3fr; gap:48px; align-items:start; }
.iv-gallery-text { position:sticky; top:120px; }
.iv-gallery-text .kicker { margin-bottom:12px; }
.iv-gallery-text .service-headline { font-size:clamp(2rem,3.5vw,3rem); margin-bottom:20px; }
.iv-gallery-text p { color:var(--muted); font-size:clamp(1rem,1.15vw,1.1rem); line-height:1.7; max-width:420px; margin:0; }

.iv-gallery-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:16px; }
.iv-gallery-item { position:relative; border-radius:16px; overflow:hidden; cursor:pointer; }
.iv-gallery-item img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s var(--ease-out); }
.iv-gallery-item:hover img { transform:scale(1.06); }
.iv-gallery-overlay { position:absolute; inset:0; background:linear-gradient(0deg,rgba(0,0,0,.8) 0%,transparent 50%); display:flex; align-items:flex-end; padding:20px; opacity:0; transition:opacity .4s var(--ease-out); }
.iv-gallery-item:hover .iv-gallery-overlay { opacity:1; }
.iv-gallery-overlay span { color:var(--paper); font-size:.9rem; font-weight:700; }
.iv-gallery-large { grid-row:span 2; }
.iv-gallery-large img { height:100%; }
.iv-gallery-wide { grid-column:span 2; }
.iv-gallery-wide img { height:280px; }

.iv-features { padding:var(--space-10) 0 var(--space-12); }
.iv-features .kicker { margin-bottom:12px; }
.iv-features-title { margin:0 0 var(--space-8); font-size:clamp(2rem,3.5vw,3rem); font-weight:300; letter-spacing:-.04em; }
.iv-features-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.iv-feature { padding:clamp(28px,3vw,36px); border:1px solid rgba(244,244,244,.1); border-radius:18px; background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,.015)); transition:all .4s var(--ease-out); }
.iv-feature:hover { border-color:rgba(1,249,222,.3); transform:translateY(-6px); box-shadow:0 20px 48px rgba(0,0,0,.2); }
.iv-feature-icon { width:56px; height:56px; display:flex; align-items:center; justify-content:center; border-radius:14px; background:rgba(1,249,222,.1); color:var(--cyan); font-size:1.4rem; margin-bottom:20px; }
.iv-feature h3 { margin:0 0 12px; font-size:1.15rem; font-weight:700; letter-spacing:-.02em; }
.iv-feature p { margin:0; color:var(--muted); font-size:.9rem; line-height:1.55; }

@media (max-width:980px) {
  .iv-gallery-layout { grid-template-columns:1fr; }
  .iv-gallery-text { position:static; text-align:center; }
  .iv-gallery-text p { max-width:none; margin-inline:auto; }
  .iv-gallery-large { grid-row:span 1; }
.iv-gallery-large img { height:280px; }
  .iv-features-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:620px) {
  .iv-gallery-text .kicker { text-align:left; }
  .iv-gallery-text .service-headline { text-align:left; }
  .iv-gallery-text p { text-align:left; margin-left:0; }
  .iv-gallery-grid { grid-template-columns:1fr; }
  .iv-gallery-wide { grid-column:span 1; }
  .iv-gallery-wide img { height:220px; }
  .iv-features-grid { grid-template-columns:1fr; }
}

/* â”€â”€ TrÃ¡fego Pago Page â”€â”€ */
/* â”€â”€ Hospedagem Page â”€â”€ */
.host-showcase { padding:var(--space-8) 0; }
.host-showcase-layout { display:grid; grid-template-columns:1fr 1.1fr; gap:48px; align-items:center; }
.host-dashboard { display:flex; align-items:center; justify-content:center; }
.host-showcase-text .kicker { margin-bottom:12px; }
.host-showcase-text .service-headline { font-size:clamp(2rem,3.5vw,3rem); margin-bottom:20px; }
.host-showcase-text p { color:var(--muted); font-size:clamp(1rem,1.15vw,1.1rem); line-height:1.7; max-width:480px; margin:0; }

.host-dashboard { position:relative; height:400px; }
.host-dashboard-screen { position:relative; width:100%; background:linear-gradient(135deg,#0d1117,#161b22); border-radius:16px; border:1px solid rgba(244,244,244,.1); box-shadow:0 30px 80px rgba(0,0,0,.4); overflow:hidden; z-index:2; }
.host-dashboard-bar { display:flex; gap:6px; padding:12px 16px; background:rgba(255,255,255,.03); border-bottom:1px solid rgba(244,244,244,.06); }
.host-dashboard-bar span { width:10px; height:10px; border-radius:50%; background:rgba(244,244,244,.15); }
.host-dashboard-bar span:first-child { background:#ff5f57; }
.host-dashboard-bar span:nth-child(2) { background:#ffbd2e; }
.host-dashboard-bar span:last-child { background:#28c840; }
.host-dashboard-content { padding:20px; }
.host-dash-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-bottom:16px; }
.host-dash-block { padding:16px; background:rgba(1,249,222,.06); border-radius:10px; border:1px solid rgba(1,249,222,.15); text-align:center; }
.host-dash-block i { font-size:1.2rem; color:var(--cyan); display:block; margin-bottom:6px; }
.host-dash-block span { display:block; font-size:1.1rem; font-weight:700; color:var(--paper); }
.host-dash-block small { display:block; color:var(--muted); font-size:.7rem; margin-top:2px; }
.host-dash-up i { color:#28c840; }
.host-dash-speed i { color:var(--cyan); }
.host-dash-chart { display:flex; align-items:flex-end; gap:8px; height:80px; margin-bottom:16px; padding:12px; background:rgba(255,255,255,.02); border-radius:10px; }
.host-dash-bar-item { flex:1; background:linear-gradient(180deg,var(--cyan),rgba(1,63,201,.6)); border-radius:4px 4px 0 0; transition:height .5s var(--ease-out); }

.host-float-badge { position:absolute; display:flex; align-items:center; gap:8px; padding:10px 18px; background:rgba(26,26,26,.9); border:1px solid rgba(1,249,222,.25); border-radius:999px; box-shadow:0 8px 24px rgba(0,0,0,.3); z-index:3; animation:host-float 4s ease-in-out infinite alternate; }
.host-float-badge i { color:var(--cyan); font-size:1rem; }
.host-float-badge span { font-size:.8rem; font-weight:600; color:var(--paper); white-space:nowrap; }
.host-float-1 { top:5%; left:-20px; animation-delay:0s; }
.host-float-2 { top:5%; right:-20px; animation-delay:.3s; }
.host-float-3 { top:45%; left:-20px; animation-delay:.6s; }
.host-float-4 { top:45%; right:-20px; animation-delay:.9s; }
.host-float-5 { bottom:10%; left:-20px; animation-delay:1.2s; }
.host-float-6 { bottom:10%; right:-20px; animation-delay:1.5s; }
@keyframes host-float { 0% { transform:translateY(0); } 100% { transform:translateY(-12px); } }

@media (max-width:980px) {
  .host-showcase-layout { grid-template-columns:1fr; text-align:center; }
  .host-showcase-text p { max-width:none; margin-inline:auto; }
  .host-dashboard { max-width:400px; margin:0 auto; height:350px; }
  .host-float-badge { padding:8px 14px; }
  .host-float-badge span { font-size:.75rem; }
}
@media (max-width:620px) {
  .host-showcase-text .kicker { text-align:left; }
  .host-showcase-text .service-headline { text-align:left; }
  .host-showcase-text p { text-align:left; margin-left:0; }
  .host-dashboard { max-width:100%; height:320px; }
  .host-float-badge { display:none; }
}

.host-stats { padding:var(--space-8) 0; background:linear-gradient(135deg,rgba(1,63,201,.12),rgba(1,249,222,.06)); }
.host-stats-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; text-align:center; }
.host-stat-item { display:flex; flex-direction:column; gap:8px; }
.host-stat-number { font-size:clamp(2.5rem,4vw,3.5rem); font-weight:800; color:var(--cyan); letter-spacing:-.03em; line-height:1; }
.host-stat-label { color:var(--muted); font-size:.9rem; line-height:1.4; }

.host-features { padding:var(--space-8) 0 var(--space-6); }
.host-features .kicker { margin-bottom:12px; }
.host-features-title { margin:0 0 var(--space-8); font-size:clamp(2rem,3.5vw,3rem); font-weight:300; letter-spacing:-.04em; }
.host-features-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.host-feature { padding:clamp(28px,3vw,36px); border:1px solid rgba(244,244,244,.1); border-radius:18px; background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,.015)); transition:all .4s var(--ease-out); }
.host-feature:hover { border-color:rgba(1,249,222,.3); transform:translateY(-6px); box-shadow:0 20px 48px rgba(0,0,0,.2); }
.host-feature-icon { width:56px; height:56px; display:flex; align-items:center; justify-content:center; border-radius:14px; background:rgba(1,249,222,.1); color:var(--cyan); font-size:1.4rem; margin-bottom:20px; }
.host-feature h3 { margin:0 0 12px; font-size:1.15rem; font-weight:700; letter-spacing:-.02em; }
.host-feature p { margin:0; color:var(--muted); font-size:.9rem; line-height:1.55; }

/* Pricing Section */
.host-pricing { padding:var(--space-10) 0 var(--space-12); }
.host-pricing-header { text-align:center; margin-bottom:var(--space-8); }
.host-pricing-title { margin:12px 0 12px; font-size:clamp(2rem,3.5vw,3rem); font-weight:300; letter-spacing:-.04em; }
.host-pricing-desc { color:var(--muted); font-size:1rem; margin:0 0 28px; }
.host-pricing-toggle { display:flex; align-items:center; justify-content:center; gap:14px; }
.host-toggle-label { font-size:.9rem; font-weight:600; color:var(--muted); transition:color .3s; }
.host-toggle-label:first-child { color:var(--paper); }
.host-toggle-badge { padding:4px 10px; background:rgba(40,200,64,.15); color:#28c840; font-size:.7rem; font-weight:700; border-radius:99px; margin-left:6px; }
.host-toggle-btn { position:relative; width:52px; height:28px; background:rgba(255,255,255,.1); border:none; border-radius:99px; cursor:pointer; transition:background .3s; }
.host-toggle-btn.active { background:var(--cyan); }
.host-toggle-knob { position:absolute; top:4px; left:4px; width:20px; height:20px; background:var(--paper); border-radius:50%; transition:transform .3s var(--ease-out); }
.host-toggle-btn.active .host-toggle-knob { transform:translateX(24px); }

.host-pricing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:start; }
.host-pricing-card { padding:32px; border:1px solid rgba(244,244,244,.1); border-radius:20px; background:rgba(255,255,255,.02); transition:all .4s var(--ease-out); position:relative; }
.host-pricing-card:hover { border-color:rgba(244,244,244,.2); transform:translateY(-4px); }
.host-pricing-popular { border-color:var(--cyan); background:linear-gradient(135deg,rgba(1,249,222,.06),rgba(1,63,201,.04)); transform:scale(1.04); }
.host-pricing-popular:hover { transform:scale(1.04) translateY(-4px); border-color:var(--cyan); }
.host-pricing-badge { position:absolute; top:-12px; left:50%; transform:translateX(-50%); padding:6px 18px; background:var(--cyan); color:var(--ink); font-size:.72rem; font-weight:800; letter-spacing:.06em; text-transform:uppercase; border-radius:99px; white-space:nowrap; }
.host-pricing-card-header { margin-bottom:24px; }
.host-pricing-card-header h3 { margin:0 0 6px; font-size:1.3rem; font-weight:700; }
.host-pricing-card-header p { margin:0; color:var(--muted); font-size:.85rem; }
.host-pricing-price { display:flex; align-items:baseline; gap:4px; margin-bottom:28px; padding-bottom:28px; border-bottom:1px solid rgba(244,244,244,.08); }
.host-price-currency { font-size:1.2rem; font-weight:700; color:var(--muted); }
.host-price-value { font-size:3.5rem; font-weight:800; letter-spacing:-.04em; line-height:1; transition:all .3s var(--ease-out); }
.host-price-period { font-size:.9rem; color:var(--muted); }
.host-pricing-features { list-style:none; padding:0; margin:0 0 28px; display:flex; flex-direction:column; gap:14px; }
.host-pricing-features li { display:flex; align-items:center; gap:10px; font-size:.9rem; color:var(--muted); }
.host-pricing-features li i { color:var(--cyan); font-size:.8rem; }
.host-pricing-btn { display:block; width:100%; padding:14px; text-align:center; border:1px solid rgba(244,244,244,.15); border-radius:12px; background:transparent; color:var(--paper); font-family:var(--sans); font-size:.9rem; font-weight:700; text-decoration:none; transition:all .3s var(--ease-out); }
.host-pricing-btn:hover { border-color:var(--cyan); background:rgba(1,249,222,.08); color:var(--cyan); }
.host-pricing-btn-primary { background:var(--cyan); color:var(--ink); border-color:var(--cyan); }
.host-pricing-btn-primary:hover { background:#00e6c9; border-color:#00e6c9; color:var(--ink); transform:translateY(-2px); box-shadow:0 12px 32px rgba(1,249,222,.25); }

@media (max-width:980px) {
  .host-pricing-grid { grid-template-columns:1fr; max-width:420px; margin:0 auto; }
  .host-pricing-popular { transform:none; }
  .host-pricing-popular:hover { transform:translateY(-4px); }
}

@media (max-width:980px) {
  .host-features-grid { grid-template-columns:1fr 1fr; }
  .host-stats-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:620px) {
  .host-platforms-grid { gap:8px; }
  .host-platform { padding:10px 16px; font-size:.8rem; }
  .host-platform span { display:none; }
  .host-features-grid { grid-template-columns:1fr; }
  .host-stats-grid { grid-template-columns:1fr 1fr; gap:24px; }
}

/* â”€â”€ Social Media Page â”€â”€ */
.sm-platforms { padding:var(--space-6) 0; border-bottom:1px solid rgba(244,244,244,.08); }
.sm-platforms-grid { display:flex; flex-wrap:wrap; gap:14px; justify-content:center; }
.sm-platform { display:flex; align-items:center; gap:10px; padding:14px 24px; border:1px solid rgba(244,244,244,.1); border-radius:999px; background:rgba(255,255,255,.03); transition:all .3s var(--ease-out); }
.sm-platform:hover { border-color:var(--cyan); background:rgba(1,249,222,.08); transform:translateY(-2px); }
.sm-platform i { font-size:1.2rem; color:var(--cyan); }
.sm-platform span { font-size:.85rem; font-weight:600; }

/* Showcase com Card Fan Carousel */
.sm-showcase { padding:var(--space-4) 0 0; }
.sm-showcase-text-center { text-align:center; margin-bottom:var(--space-8); }
.sm-showcase-text-center .service-headline { font-size:clamp(2rem,3.5vw,3.2rem); margin-bottom:24px; }
.sm-showcase-text-below { padding-top:var(--space-6); text-align:center; }
.sm-showcase-text-below .kicker { margin-bottom:20px; }
.sm-showcase-text-below .service-headline { font-size:clamp(2rem,3.5vw,3.2rem); margin-bottom:24px; }
.sm-showcase-text-below p { max-width:700px; margin-left:auto; margin-right:auto; }

/* Card Fan Layout */
.fan-layout { display:flex; justify-content:center; align-items:center; position:relative; height:608px; width:100%; max-width:80rem; margin:0 auto; perspective:1200px; }
.fan-card { position:absolute; width:280px; height:420px; border-radius:20px; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,.4); transform-origin:center bottom; transition:box-shadow .4s; cursor:pointer; }
.fan-card img { width:100%; height:100%; object-fit:cover; display:block; }
.fan-card:hover { box-shadow:0 30px 80px rgba(1,249,222,.2),0 20px 60px rgba(0,0,0,.5); }

/* Fan Controls */
.fan-controls { display:flex; align-items:center; justify-content:center; gap:16px; margin-top:32px; }
.fan-btn { width:48px; height:48px; border-radius:50%; border:1.5px solid rgba(244,244,244,.15); background:rgba(255,255,255,.05); backdrop-filter:blur(16px); color:rgba(244,244,244,.6); cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all .3s; }
.fan-btn:hover { border-color:rgba(244,244,244,.3); color:rgba(244,244,244,.9); background:rgba(255,255,255,.1); }
.fan-btn:active { opacity:.7; }
.fan-dots { display:flex; gap:8px; }
.fan-dot { width:8px; height:8px; border-radius:50%; background:rgba(244,244,244,.15); transition:all .3s; }
.fan-dot.active { background:rgba(244,244,244,.8); transform:scale(1.3); }

@media (max-width:1024px) {
  .fan-layout { height:544px; }
  .fan-card { width:240px; height:360px; }
}
@media (max-width:768px) {
  .fan-layout { height:448px; }
  .fan-card { width:200px; height:320px; border-radius:16px; }
}
@media (max-width:620px) {
  .fan-layout { height:416px; }
  .fan-card { width:170px; height:280px; border-radius:14px; }
}
@media (max-width:480px) {
  .fan-layout { height:352px; }
  .fan-card { width:140px; height:240px; border-radius:12px; }
}

/* Galeria de trabalhos */
.sm-gallery { padding:var(--space-8) 0 var(--space-12); }
.sm-gallery .kicker { margin-bottom:12px; }
.sm-gallery-title { margin:0 0 var(--space-8); font-size:clamp(2rem,3.5vw,3rem); font-weight:300; letter-spacing:-.04em; }
.sm-gallery-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.sm-gallery-item { border-radius:12px; overflow:hidden; aspect-ratio:4/5; transition:transform .4s var(--ease-out); }
.sm-gallery-item:hover { transform:scale(1.04); }
.sm-gallery-item img { width:100%; height:100%; object-fit:cover; }

/* NÃºmeros */
.sm-results { padding:var(--space-10) 0; background:linear-gradient(135deg,rgba(1,63,201,.12),rgba(1,249,222,.06)); }
.sm-results-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:32px; text-align:center; }
.sm-result-item { display:flex; flex-direction:column; gap:8px; }
.sm-result-number { font-size:clamp(2.5rem,4vw,3.5rem); font-weight:800; color:var(--cyan); letter-spacing:-.03em; line-height:1; }
.sm-result-label { color:var(--muted); font-size:.9rem; line-height:1.4; }

@media (max-width:980px) {
  .sm-gallery-grid { grid-template-columns:repeat(3,1fr); }
  .sm-results-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:620px) {
  .sm-platforms-grid { gap:8px; }
  .sm-platform { padding:10px 16px; font-size:.8rem; }
  .sm-platform span { display:none; }
  .sm-showcase-text-below { text-align:left; }
  .sm-showcase-text-below .kicker { text-align:left; }
  .sm-showcase-text-below .service-headline { text-align:left; }
  .sm-showcase-text-below p { text-align:left; margin-left:0; margin-right:0; max-width:none; }
  .sm-gallery-grid { grid-template-columns:repeat(2,1fr); gap:10px; }
  .sm-results-grid { grid-template-columns:1fr 1fr; gap:24px; }
}

/* â”€â”€ Service Detail Pages â”€â”€ */
.web-hero { min-height:100svh; padding:clamp(112px,13vw,164px) 0 80px; overflow:hidden; background:#101112; }
.web-hero-layout { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(390px,.78fr); gap:clamp(48px,8vw,128px); align-items:center; }
.web-hero-copy h1 { margin:16px 0 38px; font-size:clamp(3.6rem,7.1vw,7.5rem); font-weight:800; line-height:.82; letter-spacing:-.075em; text-transform:uppercase; }
.web-hero-copy h1 em { color:var(--cyan); font-style:normal; white-space:nowrap; }
.web-hero-intro { display:flex; gap:32px; align-items:end; max-width:640px; padding-top:24px; border-top:1px solid rgba(243,241,235,.22); }
.web-hero-intro p { max-width:300px; margin:0; color:rgba(243,241,235,.72); font-size:1rem; line-height:1.58; }
.web-button { display:inline-flex; gap:18px; align-items:center; padding:15px 18px; color:#101112; background:var(--cyan); font-size:.78rem; font-weight:800; letter-spacing:.06em; text-decoration:none; text-transform:uppercase; transition:transform .3s var(--ease-out),background .3s; white-space:nowrap; }
.web-button:hover { transform:translateY(-4px); background:#f3f1eb; }
.web-button span { font-size:1.2rem; }
.web-wireframe { position:relative; padding:18px; color:#101112; background:#f3f1eb; box-shadow:22px 22px 0 var(--cyan); transform:rotate(2.5deg); }
.web-wireframe > div { border:1px solid #101112; }
.web-wireframe-top { display:flex; gap:10px; align-items:center; height:43px; padding:0 12px; font-size:.59rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.web-wireframe-top span { margin-right:auto; }.web-wireframe-top i { width:23px; height:4px; background:#101112; }
.web-wireframe-hero { display:flex; justify-content:space-between; min-height:190px; padding:26px 18px; background:var(--cyan); font-size:clamp(1.45rem,2.4vw,2.3rem); font-weight:800; line-height:.9; letter-spacing:-.06em; text-transform:uppercase; }.web-wireframe-hero b { align-self:end; font-size:2rem; }
.web-wireframe-proof { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:14px; }.web-wireframe-proof i { height:34px; background:#d5d4ce; }
.web-wireframe-content { display:grid; grid-template-columns:1fr .8fr; gap:18px; padding:22px 18px; font-size:1.05rem; font-weight:700; line-height:1; }.web-wireframe-content div { display:grid; gap:8px; }.web-wireframe-content i { display:block; height:7px; background:#101112; }.web-wireframe-content i:nth-child(2) { width:76%; }.web-wireframe-content i:nth-child(3) { width:52%; }
.web-wireframe-action { display:flex; justify-content:space-between; padding:13px 16px; background:#101112; color:#f3f1eb; font-size:.7rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; }.web-wireframe-label { margin:15px 0 0; font-size:.61rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.web-premise { padding:96px 0; background:#f3f1eb; color:#101112; }.web-premise-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:32px; row-gap:48px; align-items:start; }.web-premise-grid > .kicker { grid-column:1/-1; }.web-premise .kicker { color:#101112; }.web-premise-content { display:grid; grid-column:1/-1; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:32px; align-items:start; }.web-premise h2 { grid-column:span 7; max-width:none; margin:0; font-size:clamp(2.35rem,4.25vw,4.65rem); font-weight:800; line-height:.91; letter-spacing:-.065em; text-transform:uppercase; }.web-premise-copy { grid-column:9/span 4; padding-top:8px; }.web-premise p:not(.kicker) { margin:0 0 24px; color:rgba(16,17,18,.72); font-size:clamp(1rem,1.15vw,1.12rem); line-height:1.66; }.web-premise p:not(.kicker):last-child { margin-bottom:0; }
.web-scope { padding:clamp(100px,13vw,165px) 0; background:#101112; }.web-section-heading { display:grid; grid-template-columns:.65fr 1.35fr .8fr; gap:32px; align-items:end; margin-bottom:72px; }.web-section-heading h2 { margin:0; font-size:clamp(2.35rem,4.3vw,4.7rem); font-weight:800; line-height:.88; letter-spacing:-.065em; text-transform:uppercase; }.web-section-heading > p:last-child { margin:0; color:var(--muted); line-height:1.55; }
.web-scope-list { border-top:1px solid rgba(243,241,235,.24); }.web-scope-list article { display:grid; grid-template-columns:70px minmax(0,1fr) 220px; gap:28px; padding:32px 0; border-bottom:1px solid rgba(243,241,235,.18); transition:padding .35s var(--ease-out),color .35s; }.web-scope-list article:hover { padding-inline:16px; color:var(--cyan); }.web-scope-list article > span { color:var(--cyan); font-size:.72rem; font-weight:800; letter-spacing:.1em; }.web-scope-list h3 { margin:0 0 10px; font-size:clamp(1.45rem,2.2vw,2.1rem); line-height:1; letter-spacing:-.045em; }.web-scope-list p { max-width:620px; margin:0; color:var(--muted); line-height:1.55; }.web-scope-list strong { align-self:center; color:rgba(243,241,235,.6); font-size:.72rem; letter-spacing:.08em; text-align:right; text-transform:uppercase; }
.web-projects { padding-block:clamp(100px,12vw,150px); }.web-projects-heading { display:flex; justify-content:space-between; gap:40px; align-items:end; margin-bottom:52px; }.web-projects-heading h2 { max-width:670px; margin:0; font-size:clamp(2.4rem,4.5vw,5rem); font-weight:800; line-height:.88; letter-spacing:-.065em; text-transform:uppercase; }.web-projects-heading > p { max-width:300px; margin:0; color:var(--muted); line-height:1.6; }
.web-method { padding:clamp(100px,13vw,170px) 0; background:#1a1c1d; }.web-method-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(48px,9vw,160px); }.web-method h2 { max-width:480px; margin:18px 0 0; font-size:clamp(2.35rem,4vw,4.5rem); font-weight:800; line-height:.9; letter-spacing:-.06em; text-transform:uppercase; }.web-method-intro { max-width:470px; margin:28px 0 0; color:var(--muted); font-size:clamp(.96rem,1.1vw,1.08rem); line-height:1.62; }.web-method ol { margin:0; padding:0; list-style:none; border-top:1px solid rgba(243,241,235,.2); }.web-method li { display:grid; grid-template-columns:54px 1fr; gap:20px; padding:24px 0; border-bottom:1px solid rgba(243,241,235,.15); }.web-method li > span { color:var(--cyan); font-size:.72rem; font-weight:800; }.web-method h3 { margin:0 0 6px; font-size:1.25rem; letter-spacing:-.035em; }.web-method li p { max-width:470px; margin:0; color:var(--muted); line-height:1.5; }
@media (max-width:980px) { .web-hero-layout,.web-method-grid { grid-template-columns:1fr; }.web-hero { min-height:auto; }.web-wireframe { width:min(560px,calc(100% - 26px)); margin:30px auto 0; }.web-premise { padding:80px 0; }.web-premise-grid { grid-template-columns:repeat(8,minmax(0,1fr)); column-gap:24px; row-gap:40px; }.web-premise-content { grid-column:1/-1; grid-template-columns:repeat(8,minmax(0,1fr)); column-gap:24px; }.web-premise h2 { grid-column:span 5; }.web-premise-copy { grid-column:7/span 2; }.web-section-heading { grid-template-columns:1fr 1fr; }.web-section-heading .kicker { grid-column:1/-1; }.web-projects-heading { display:grid; grid-template-columns:1fr 1fr; }.web-scope-list article { grid-template-columns:54px 1fr; }.web-scope-list strong { grid-column:2; text-align:left; }.web-method-grid { gap:56px; } }
@media (max-width:620px) { .web-hero { padding-top:112px; }.web-hero-copy h1 { font-size:clamp(3.25rem,14vw,4.6rem); }.web-hero-copy h1 em { white-space:normal; }.web-hero-intro { display:block; }.web-button { margin-top:22px; }.web-wireframe { padding:11px; box-shadow:12px 12px 0 var(--cyan); }.web-wireframe-hero { min-height:150px; }.web-premise,.web-scope,.web-method { padding:64px 0; }.web-premise-grid { display:grid; grid-template-columns:1fr; gap:32px; }.web-premise-content { display:grid; grid-template-columns:1fr; gap:32px; }.web-premise h2,.web-premise-copy { grid-column:auto; }.web-premise-copy { padding-top:0; }.web-section-heading,.web-projects-heading { display:block; margin-bottom:44px; }.web-scope-list article { gap:16px; padding:25px 0; }.web-scope-list h3 { font-size:1.4rem; }.web-scope-list p { font-size:.92rem; }.web-scope-list strong { font-size:.62rem; }.web-projects-heading h2 { font-size:clamp(2.2rem,11vw,3.6rem); } }
.service-detail { padding:var(--space-12) 0 var(--space-16); }
.service-detail-grid { display:grid; grid-template-columns:1fr 1fr; gap:clamp(48px,6vw,96px); align-items:start; }
.service-detail-text { padding-top:12px; }
.service-detail-text p { color:var(--muted); font-size:clamp(1rem,1.15vw,1.1rem); line-height:1.75; max-width:520px; margin:0 0 24px; }
.service-headline { margin:0 0 36px; font-size:clamp(2rem,3.5vw,3.2rem); font-weight:800; line-height:.92; letter-spacing:-.055em; text-transform:uppercase; text-wrap:balance; }
.service-headline span { display:block; color:var(--paper); text-wrap:balance; }
.service-headline span:last-child { color:var(--cyan); text-wrap:balance; }
.service-detail-features { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.feature-item { padding:clamp(24px,3vw,32px); border:1px solid rgba(244,244,244,.1); border-radius:18px; background:linear-gradient(135deg,rgba(255,255,255,.04),rgba(255,255,255,.015)); transition:border-color .35s,transform .4s var(--ease-out),box-shadow .4s; }
.feature-item:hover { border-color:rgba(1,249,222,.3); transform:translateY(-6px); box-shadow:0 20px 48px rgba(0,0,0,.2); }
.feature-item h3 { margin:0 0 12px; font-size:clamp(1.1rem,1.3vw,1.25rem); font-weight:700; letter-spacing:-.02em; line-height:1.15; }
.feature-item p { margin:0; color:var(--muted); font-size:.9rem; line-height:1.55; }

.service-process { padding:var(--space-4) 0 var(--space-10); }
.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; }
}
/* â”€â”€ Client Ticker â”€â”€ */
.client-ticker { height:auto; padding:10px 0; margin:0; overflow:hidden; background:transparent; position:relative; }
.client-ticker::before,.client-ticker::after { content:""; position:absolute; top:0; bottom:0; width:280px; z-index:2; pointer-events:none; }
.client-ticker::before { left:0; background:linear-gradient(90deg,#000,transparent); }
.client-ticker::after { right:0; background:linear-gradient(270deg,#000,transparent); }
.client-ticker .ticker-track { display:flex; width:max-content; animation:ticker-clients 40s linear infinite; }
.client-ticker .ticker-group { display:flex; align-items:center; gap:32px; padding:0 clamp(16px,2vw,30px); flex-shrink:0; }
.client-ticker .ticker-group img { height:96px; width:auto; object-fit:contain; filter:grayscale(1) brightness(2.5) contrast(1.2); opacity:.9; transition:filter .3s,opacity .3s; }
.client-ticker .ticker-group img:hover { filter:none; opacity:1; }
@keyframes ticker-clients { 0% { transform:translateX(0); } 100% { transform:translateX(-50%); } }

/* â”€â”€ Service Statement â”€â”€ */
.service-statement { padding:var(--space-8) 0; text-align:left; }
.service-statement h2 { margin:0; max-width:900px; font-size:clamp(2.5rem,5vw,4.5rem); font-weight:800; line-height:.95; letter-spacing:-.05em; text-transform:uppercase; color:var(--paper); }
.service-statement h2 span { color:var(--cyan); font-weight:800; }

/* â”€â”€ Projects Carousel â”€â”€ */
.service-projects { padding:var(--space-4) 0 var(--space-6); }
.projects-carousel { position:relative; }
.carousel-track { display:flex; gap:20px; overflow:hidden; padding:0; scroll-snap-type:x mandatory; }
.carousel-track::-webkit-scrollbar { display:none; }
.project-card-link { flex:1; min-width:0; text-decoration:none; color:inherit; scroll-snap-align:start; transition:flex .5s var(--ease-out); }
.project-card-link:hover { flex:2; }
.project-card { flex:unset; min-width:0; transition:none; }
.project-card:hover { flex:unset; }
.project-card { min-width:0; }
.project-card-inner { position:relative; border-radius:20px; overflow:hidden; height:500px; cursor:pointer; }
.project-card-image { position:relative; width:100%; height:100%; }
.card-img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:opacity .5s var(--ease-out),transform .5s var(--ease-out); }
.card-img-hover { opacity:0; }
.project-card-link:is(:hover,:focus-visible) .card-img-default { opacity:0; transform:scale(1.05); }
.project-card-link:is(:hover,:focus-visible) .card-img-hover { opacity:1; transform:scale(1.05); }
.project-card-info { position:absolute; bottom:0; left:0; right:0; padding:28px 24px; background:linear-gradient(transparent,rgba(0,0,0,.85)); transform:translateY(10px); opacity:0; transition:transform .4s var(--ease-out),opacity .4s var(--ease-out); z-index:1; }
.project-card-link:is(:hover,:focus-visible) .project-card-info { transform:translateY(0); opacity:1; }
.project-card-category { display:inline-block; margin-bottom:8px; padding:8px 18px; background:linear-gradient(105deg,var(--blue),#075de0 56%,#01bfae); border:none; border-radius:99px; color:#fff; font-family:var(--sans); font-size:.85rem; font-weight:300; letter-spacing:.02em; text-transform:none; }
.project-card-info h3 { margin:0 0 4px; font-size:1.4rem; font-weight:700; color:#fff; }
.project-card-info p { margin:0; font-size:.85rem; color:rgba(255,255,255,.7); }
.carousel-controls { display:flex; justify-content:center; gap:14px; margin-top:var(--space-6); }
.carousel-btn { width:52px; height:52px; border-radius:50%; border:1px solid rgba(244,244,244,.2); background:rgba(255,255,255,.04); color:var(--paper); cursor:pointer; transition:all .3s var(--ease-out); display:flex; align-items:center; justify-content:center; backdrop-filter:blur(8px); }
.carousel-btn:hover { border-color:var(--cyan); background:rgba(1,249,222,.12); color:var(--cyan); transform:scale(1.08); }
.carousel-btn:active { transform:scale(.95); }
.carousel-btn svg { flex-shrink:0; }

@media (max-width:900px) {
  .project-card-inner { height:400px; }
}
@media (max-width:600px) {
  .project-card-inner { height:350px; }
  .service-statement { padding:var(--space-4) 0 var(--space-6); }
  .service-statement h2 { font-size:clamp(1.8rem,7vw,2.5rem); }
}

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%; }
}

/* â”€â”€ Ecommerce premium dossier â”€â”€ */
.ecp-hero { position:relative; min-height:100vh; isolation:isolate; display:flex; align-items:flex-end; overflow:hidden; background:#101317; color:var(--paper); }.ecp-hero::before { content:""; position:absolute; z-index:-2; inset:0; background:radial-gradient(circle at 77% 30%,rgba(1,63,201,.32),transparent 27%),linear-gradient(125deg,#111419 0%,#111820 55%,#071d4f 100%); }.ecp-hero-grid { position:absolute; z-index:-1; inset:0; opacity:.25; background-image:linear-gradient(rgba(244,244,244,.11) 1px,transparent 1px),linear-gradient(90deg,rgba(244,244,244,.11) 1px,transparent 1px); background-size:clamp(48px,5vw,80px) clamp(48px,5vw,80px); mask-image:linear-gradient(180deg,transparent 0%,#000 20%,#000 75%,transparent 100%); }.ecp-hero-inner { width:100%; padding-top:160px; padding-bottom:clamp(42px,6vw,82px); }.ecp-hero-meta,.ecp-hero-index { display:flex; justify-content:space-between; gap:20px; color:rgba(244,244,244,.55); font-size:.67rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; }.ecp-hero-meta p { margin:0; }.ecp-hero-copy { max-width:1120px; margin-top:clamp(72px,12vw,160px); }.ecp-hero-copy .kicker { color:var(--cyan); margin-bottom:24px; }.ecp-hero h1 { max-width:1030px; margin:0; font-size:clamp(3.7rem,8.25vw,8.9rem); font-weight:800; letter-spacing:-.075em; line-height:.83; text-transform:uppercase; }.ecp-hero h1 em { color:var(--cyan); font-style:normal; }.ecp-hero-bottom { display:grid; grid-template-columns:minmax(0,510px) auto; gap:42px; align-items:end; margin-top:clamp(42px,6vw,74px); }.ecp-hero-bottom p { max-width:510px; margin:0; color:rgba(244,244,244,.74); font-size:clamp(1rem,1.25vw,1.16rem); line-height:1.65; }.ecp-button { display:inline-flex; align-items:center; justify-content:space-between; gap:34px; min-width:260px; padding:17px 20px; border:1px solid var(--cyan); background:var(--cyan); color:var(--ink); font-size:.75rem; font-weight:800; letter-spacing:.06em; text-decoration:none; text-transform:uppercase; transition:transform .3s var(--ease-out),background .3s,color .3s; }.ecp-button:hover { transform:translateY(-4px); background:transparent; color:var(--cyan); }.ecp-button span { font-size:1.2rem; }.ecp-hero-index { justify-content:flex-start; gap:0; margin-top:clamp(68px,10vw,132px); border-top:1px solid rgba(244,244,244,.2); }.ecp-hero-index span { flex:1; padding-top:14px; border-right:1px solid rgba(244,244,244,.2); }.ecp-hero-index span:last-child { border-right:0; }
.ecp-statement { padding:clamp(104px,14vw,190px) 0; background:var(--paper); color:var(--ink); }.ecp-statement-grid { display:grid; grid-template-columns:.42fr 1.25fr .7fr; gap:clamp(28px,5vw,78px); align-items:start; }.ecp-statement .kicker { color:var(--blue); }.ecp-statement h2 { margin:0; font-size:clamp(2.5rem,4.65vw,5rem); font-weight:300; letter-spacing:-.065em; line-height:.94; }.ecp-statement-grid > div { padding-top:8px; border-top:1px solid #aeb7c6; }.ecp-statement p:not(.kicker) { margin:18px 0 0; color:#505966; font-size:1rem; line-height:1.65; }.ecp-statement p:not(.kicker):first-child { margin-top:18px; }
.ecp-decision { padding:clamp(94px,12vw,160px) 0; background:#111419; }.ecp-section-head { display:grid; grid-template-columns:.7fr 1.2fr .65fr; gap:30px; align-items:end; margin-bottom:clamp(58px,8vw,100px); }.ecp-section-head .kicker { color:var(--cyan); }.ecp-section-head h2 { margin:0; font-size:clamp(2.4rem,4.3vw,4.7rem); font-weight:300; letter-spacing:-.06em; line-height:.93; }.ecp-section-head > p { margin:0; color:var(--muted); font-size:.95rem; line-height:1.6; }.ecp-decision-list { margin:0; padding:0; border-top:1px solid rgba(244,244,244,.2); list-style:none; }.ecp-decision-list li { display:grid; grid-template-columns:.35fr 1.2fr .6fr; gap:26px; align-items:start; padding:32px 0 36px; border-bottom:1px solid rgba(244,244,244,.2); transition:padding .35s var(--ease-out),color .35s; }.ecp-decision-list li:hover { padding-inline:16px; color:var(--cyan); }.ecp-number { color:var(--cyan); font-size:.7rem; font-weight:800; letter-spacing:.12em; }.ecp-decision-list h3 { margin:0 0 10px; color:var(--paper); font-size:clamp(1.4rem,2vw,2rem); font-weight:500; letter-spacing:-.04em; }.ecp-decision-list p { max-width:580px; margin:0; color:var(--muted); font-size:.95rem; line-height:1.6; }.ecp-decision-list strong { padding-top:8px; color:var(--paper); font-size:.75rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; text-align:right; }
.ecp-systems { padding:clamp(100px,13vw,180px) 0; background:#081a48; }.ecp-systems-intro { display:grid; grid-template-columns:.48fr 1.3fr; gap:40px; max-width:1050px; }.ecp-systems-intro .kicker { color:var(--cyan); }.ecp-systems-intro h2 { margin:0; font-size:clamp(2.5rem,4.7vw,5rem); font-weight:300; letter-spacing:-.065em; line-height:.93; }.ecp-systems-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:clamp(72px,10vw,128px); border-top:1px solid rgba(244,244,244,.24); border-bottom:1px solid rgba(244,244,244,.24); }.ecp-systems-grid article { min-height:300px; padding:28px; border-right:1px solid rgba(244,244,244,.24); }.ecp-systems-grid article:last-child { border-right:0; }.ecp-systems-grid span,.ecp-method-list span { color:var(--cyan); font-size:.68rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }.ecp-systems-grid h3 { margin:clamp(62px,8vw,112px) 0 14px; font-size:clamp(1.4rem,2vw,2rem); font-weight:500; letter-spacing:-.04em; }.ecp-systems-grid p { margin:0; color:rgba(244,244,244,.68); font-size:.92rem; line-height:1.62; }
.ecp-visual { padding:clamp(96px,13vw,174px) 0; background:var(--paper); color:var(--ink); }.ecp-visual-head { display:grid; grid-template-columns:.5fr 1.15fr; gap:40px; align-items:end; }.ecp-visual-head .kicker { color:var(--blue); }.ecp-visual-head h2 { max-width:850px; margin:0; font-size:clamp(2.5rem,4.7vw,5.1rem); font-weight:300; letter-spacing:-.065em; line-height:.93; }.ecp-visual-layout { display:grid; grid-template-columns:.55fr 1.45fr; gap:clamp(32px,6vw,96px); align-items:start; margin-top:clamp(56px,8vw,100px); }.ecp-visual-copy { padding-top:12px; border-top:1px solid #8994a5; }.ecp-visual-copy p { margin:0 0 18px; color:#4f5866; font-size:1rem; line-height:1.65; }.ecp-text-link { display:inline-flex; gap:12px; margin-top:16px; color:var(--blue); font-size:.77rem; font-weight:800; letter-spacing:.04em; text-decoration:none; text-transform:uppercase; border-bottom:1px solid currentColor; padding-bottom:6px; }.ecp-gallery { display:grid; grid-template-columns:1.25fr .75fr; gap:14px; }.ecp-gallery .ec-gallery-item { position:relative; min-height:220px; border-radius:0; overflow:hidden; }.ecp-gallery .ec-gallery-item img { width:100%; height:100%; object-fit:cover; filter:saturate(.74); transition:filter .4s,transform .6s var(--ease-out); }.ecp-gallery .ec-gallery-item:hover img,.ecp-gallery .ec-gallery-item:focus-visible img { filter:saturate(1); transform:scale(1.04); }.ecp-gallery .ec-gallery-item span { position:absolute; left:0; right:0; bottom:0; padding:14px; background:linear-gradient(transparent,rgba(0,0,0,.8)); color:#fff; font-size:.72rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }.ecp-gallery-main { grid-row:span 2; min-height:510px!important; }
.ecp-method { padding:clamp(100px,13vw,170px) 0; background:#111419; }.ecp-method-heading { display:grid; grid-template-columns:.5fr 1.1fr; gap:40px; max-width:1030px; }.ecp-method-heading .kicker { color:var(--cyan); }.ecp-method-heading h2 { margin:0; font-size:clamp(2.5rem,4.6vw,4.9rem); font-weight:300; letter-spacing:-.065em; line-height:.93; }.ecp-method-list { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:clamp(62px,8vw,100px); }.ecp-method-list article { padding-top:18px; border-top:1px solid rgba(244,244,244,.3); }.ecp-method-list h3 { margin:52px 0 12px; font-size:1.45rem; font-weight:500; letter-spacing:-.04em; }.ecp-method-list p { margin:0; color:var(--muted); font-size:.9rem; line-height:1.6; }.ecp-method-note { display:grid; grid-template-columns:18px minmax(0,570px); gap:14px; margin-top:72px; padding-top:18px; border-top:1px solid rgba(244,244,244,.2); }.ecp-method-note i { color:var(--cyan); font-size:.45rem; padding-top:6px; }.ecp-method-note p { margin:0; color:rgba(244,244,244,.72); font-size:.92rem; line-height:1.62; }
@media (max-width:980px) { .ecp-statement-grid,.ecp-section-head,.ecp-systems-intro,.ecp-visual-head,.ecp-method-heading { grid-template-columns:1fr; }.ecp-statement-grid { gap:26px; }.ecp-section-head { gap:18px; }.ecp-decision-list li { grid-template-columns:70px 1fr; }.ecp-decision-list strong { grid-column:2; padding:0; text-align:left; }.ecp-systems-grid { grid-template-columns:1fr; }.ecp-systems-grid article { min-height:0; border-right:0; border-bottom:1px solid rgba(244,244,244,.24); }.ecp-systems-grid article:last-child { border-bottom:0; }.ecp-systems-grid h3 { margin-top:40px; }.ecp-visual-layout { grid-template-columns:1fr; }.ecp-method-list { grid-template-columns:repeat(2,1fr); }.ecp-hero-bottom { grid-template-columns:1fr; justify-items:start; } }
@media (max-width:620px) { .ecp-hero { min-height:720px; }.ecp-hero-inner { padding-top:120px; }.ecp-hero-meta { font-size:.56rem; }.ecp-hero-meta p:last-child { display:none; }.ecp-hero h1 { font-size:clamp(3.5rem,15vw,5.3rem); }.ecp-hero-index { display:grid; grid-template-columns:1fr 1fr; margin-top:68px; }.ecp-hero-index span { padding:12px 0; border-bottom:1px solid rgba(244,244,244,.2); }.ecp-statement,.ecp-decision,.ecp-systems,.ecp-visual,.ecp-method { padding-block:82px; }.ecp-decision-list li { grid-template-columns:46px 1fr; gap:12px; }.ecp-decision-list h3 { font-size:1.35rem; }.ecp-decision-list strong { font-size:.64rem; }.ecp-method-list { grid-template-columns:1fr; gap:36px; }.ecp-method-list h3 { margin-top:36px; }.ecp-gallery { grid-template-columns:1fr 1fr; }.ecp-gallery-main { grid-column:1 / -1; grid-row:auto; min-height:310px!important; }.ecp-gallery .ec-gallery-item { min-height:155px; }.ecp-button { width:100%; }.ecp-method-note { margin-top:52px; } }

/* â”€â”€ Social Media dossier â”€â”€ */
.smp-hero { position:relative; min-height:100svh; overflow:hidden; background:var(--ink); color:var(--paper); }
.smp-noise { position:absolute; inset:0; opacity:.1; pointer-events:none; background-image:radial-gradient(var(--paper) .55px,transparent .75px); background-size:5px 5px; }
.smp-hero-grid { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1.05fr) minmax(390px,.78fr); gap:clamp(48px,8vw,128px); min-height:100svh; padding-top:clamp(112px,13vw,164px); padding-bottom:80px; align-items:center; }
.smp-hero-copy h1 { margin:16px 0 38px; max-width:650px; font-size:clamp(3.15rem,5vw,5.6rem); font-weight:800; line-height:.88; letter-spacing:-.07em; text-transform:uppercase; }
.smp-hero-copy h1 em { color:var(--cyan); font-style:normal; }
.smp-hero .kicker,.smp-statement .kicker { color:var(--cyan); }
.smp-hero-bottom { display:grid; grid-template-columns:minmax(0,295px) auto; gap:26px; align-items:end; padding-top:24px; border-top:1px solid rgba(244,244,244,.22); max-width:640px; }
.smp-hero-bottom p { margin:0; font-size:.98rem; line-height:1.58; }
.smp-button { display:inline-flex; align-items:center; justify-content:space-between; gap:22px; padding:15px 18px; background:var(--cyan); color:var(--ink); font-size:.73rem; font-weight:800; letter-spacing:.065em; text-decoration:none; text-transform:uppercase; transition:transform .3s var(--ease-out),background .3s; white-space:nowrap; }
.smp-button:hover { background:var(--paper); transform:translateY(-3px); }
.smp-case { position:relative; display:grid; grid-template-rows:auto minmax(0,1fr) auto; min-height:610px; margin:0; overflow:hidden; border:1px solid rgba(244,244,244,.32); background:var(--blue); box-shadow:18px 20px 0 var(--cyan); }
.smp-case::after { content:""; position:absolute; z-index:1; top:42px; right:0; bottom:0; width:34%; background:linear-gradient(90deg,transparent,rgba(1,63,201,.35)); pointer-events:none; }
.smp-case-topline { position:relative; z-index:2; display:flex; justify-content:space-between; padding:14px 16px 13px; border-bottom:1px solid rgba(244,244,244,.35); color:var(--paper); font-size:.58rem; font-weight:800; letter-spacing:.12em; }
.smp-case-media { position:relative; min-height:0; overflow:hidden; background:#0c2230; }
.smp-case-media img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; filter:saturate(.9) contrast(1.04); transition:transform .8s var(--ease-out),filter .8s var(--ease-out); }
.smp-case:hover .smp-case-media img { transform:scale(1.035); filter:saturate(1.05) contrast(1.06); }
.smp-case figcaption { position:relative; z-index:2; display:grid; grid-template-columns:1fr auto; gap:8px 18px; padding:18px 18px 19px; background:var(--blue); color:var(--paper); }
.smp-case figcaption span,.smp-case figcaption small { font-size:.59rem; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }
.smp-case figcaption strong { grid-column:1 / -1; font-size:clamp(1.75rem,2.45vw,2.55rem); font-weight:800; letter-spacing:-.065em; line-height:.88; text-transform:uppercase; }
.smp-case figcaption small { color:rgba(244,244,244,.7); text-align:right; }
.smp-feed { position:relative; min-height:570px; border:1px solid rgba(20,20,20,.45); background:var(--ink); overflow:hidden; box-shadow:18px 20px 0 var(--blue); }
.smp-feed-label { position:absolute; z-index:4; inset:0 0 auto; display:flex; justify-content:space-between; padding:13px 15px; color:var(--paper); border-bottom:1px solid rgba(244,244,244,.3); font-size:.56rem; font-weight:800; letter-spacing:.12em; }
.smp-post { position:absolute; margin:0; overflow:hidden; border:5px solid var(--paper); box-shadow:0 16px 38px rgba(20,20,20,.42); }
.smp-post img { display:block; width:100%; height:100%; object-fit:cover; }
.smp-post-one { width:51%; height:62%; left:8%; top:17%; transform:rotate(-7deg); }
.smp-post-two { width:43%; height:51%; right:7%; top:21%; transform:rotate(8deg); }
.smp-post-three { width:45%; height:53%; left:28%; bottom:-7%; transform:rotate(-2deg); }
.smp-feed-stamp { position:absolute; z-index:3; right:7%; bottom:9%; display:grid; place-items:center; width:115px; aspect-ratio:1; border-radius:50%; background:var(--cyan); color:var(--ink); font-size:.75rem; font-weight:900; line-height:.86; letter-spacing:-.04em; text-align:center; transform:rotate(12deg); }
.smp-statement { padding:clamp(108px,14vw,190px) 0; background:var(--ink); }
.smp-statement-grid { display:grid; grid-template-columns:.52fr 1.25fr .74fr; gap:clamp(32px,5vw,84px); }
.smp-statement h2 { margin:0; font-size:clamp(2.55rem,4.3vw,5rem); font-weight:400; line-height:.96; letter-spacing:-.065em; }
.smp-statement-copy { padding-top:8px; border-top:1px solid rgba(244,244,244,.32); }
.smp-statement-copy p { margin:0 0 20px; color:rgba(244,244,244,.75); font-size:.96rem; line-height:1.64; }
.smp-scope { padding:clamp(104px,13vw,174px) 0; background:var(--cyan); color:var(--ink); }
.smp-section-heading { display:grid; grid-template-columns:.52fr 1.48fr; gap:30px; margin-bottom:clamp(60px,8vw,110px); }
.smp-section-heading .kicker { color:var(--blue); }.smp-section-heading h2 { margin:0; font-size:clamp(2.9rem,5.1vw,5.8rem); font-weight:800; line-height:.86; letter-spacing:-.075em; text-transform:uppercase; }
.smp-scope-list { border-top:2px solid var(--ink); }.smp-scope-list article { display:grid; grid-template-columns:100px minmax(0,1fr) 180px; gap:26px; padding:28px 0 32px; border-bottom:1px solid rgba(20,20,20,.4); }
.smp-scope-list article>span { font-size:.72rem; font-weight:800; letter-spacing:.1em; }.smp-scope-list h3 { margin:0 0 10px; font-size:clamp(1.55rem,2.25vw,2.25rem); letter-spacing:-.05em; }.smp-scope-list p { max-width:560px; margin:0; font-size:.95rem; line-height:1.58; }.smp-scope-list strong { align-self:end; font-size:.65rem; letter-spacing:.12em; text-align:right; text-transform:uppercase; }
.smp-work { padding:clamp(108px,13vw,178px) 0; background:var(--ink); }.smp-work-head { display:grid; grid-template-columns:1.1fr .55fr; gap:clamp(40px,9vw,150px); align-items:end; margin-bottom:62px; }.smp-work-head .kicker,.smp-method .kicker { color:var(--cyan); }.smp-work-head h2 { margin:16px 0 0; font-size:clamp(2.9rem,5vw,5.6rem); font-weight:400; line-height:.87; letter-spacing:-.07em; }.smp-work-head>p { margin:0; padding-bottom:6px; color:rgba(244,244,244,.72); font-size:.98rem; line-height:1.65; }
.smp-work-grid { display:grid; grid-template-columns:1.28fr .72fr; grid-template-rows:repeat(2,minmax(240px,1fr)); gap:16px; }.smp-work-item { position:relative; min-height:270px; margin:0; overflow:hidden; background:var(--blue); }.smp-work-large { grid-row:span 2; }.smp-work-item img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .7s var(--ease-out); }.smp-work-item:hover img { transform:scale(1.045); }.smp-work-item figcaption { position:absolute; right:0; bottom:0; left:0; display:flex; justify-content:space-between; gap:16px; padding:15px 17px; background:rgba(20,20,20,.92); font-size:.8rem; font-weight:800; }.smp-work-item figcaption span { color:rgba(244,244,244,.64); font-size:.61rem; letter-spacing:.06em; text-transform:uppercase; }
.smp-method { padding:clamp(105px,14vw,185px) 0; background:var(--blue); color:var(--paper); }.smp-method-heading { display:grid; grid-template-columns:.52fr 1.18fr; gap:40px; max-width:1050px; }.smp-method .kicker { color:var(--cyan); }.smp-method h2 { margin:0; font-size:clamp(3rem,5vw,5.65rem); font-weight:800; line-height:.86; letter-spacing:-.075em; text-transform:uppercase; }.smp-method-list { display:grid; grid-template-columns:repeat(4,1fr); gap:22px; margin-top:clamp(64px,9vw,116px); }.smp-method-list article { padding-top:17px; border-top:2px solid var(--paper); }.smp-method-list span { font-size:.65rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }.smp-method-list h3 { margin:48px 0 12px; font-size:1.5rem; letter-spacing:-.045em; }.smp-method-list p { margin:0; font-size:.9rem; line-height:1.6; }
@media (max-width:980px) { .smp-hero-grid,.smp-statement-grid,.smp-section-heading,.smp-work-head,.smp-method-heading { grid-template-columns:1fr; }.smp-hero-grid { padding-top:132px; }.smp-feed,.smp-case { max-width:620px; width:100%; min-height:520px; }.smp-statement-grid { gap:28px; }.smp-section-heading { gap:18px; }.smp-method-list { grid-template-columns:1fr 1fr; row-gap:40px; }.smp-scope-list article { grid-template-columns:72px minmax(0,1fr); }.smp-scope-list strong { grid-column:2; text-align:left; }.smp-work-head { gap:28px; }.smp-work-head>p { max-width:520px; } }
@media (max-width:620px) { .smp-hero-grid { min-height:0; padding-top:120px; padding-bottom:70px; }.smp-hero-copy h1 { font-size:clamp(3.2rem,14.5vw,5.1rem); }.smp-hero-bottom { grid-template-columns:1fr; }.smp-button { width:100%; }.smp-feed,.smp-case { min-height:390px; box-shadow:10px 11px 0 var(--cyan); }.smp-feed-label { font-size:.46rem; }.smp-case figcaption { padding:15px; }.smp-case figcaption strong { font-size:1.65rem; }.smp-case figcaption small { grid-column:1 / -1; text-align:left; }.smp-feed-stamp { width:82px; font-size:.55rem; }.smp-statement,.smp-scope,.smp-work,.smp-method { padding-block:82px; }.smp-statement h2,.smp-section-heading h2,.smp-work-head h2,.smp-method h2 { font-size:clamp(2.65rem,12vw,4rem); }.smp-scope-list article { grid-template-columns:46px minmax(0,1fr); gap:12px; }.smp-scope-list h3 { font-size:1.45rem; }.smp-scope-list p { font-size:.86rem; }.smp-work-grid { grid-template-columns:1fr; grid-template-rows:auto; }.smp-work-item,.smp-work-large { min-height:320px; grid-row:auto; }.smp-work-item:not(.smp-work-large) { min-height:245px; }.smp-work-item figcaption { font-size:.72rem; }.smp-work-item figcaption span { font-size:.5rem; }.smp-method-list { grid-template-columns:1fr; gap:34px; margin-top:62px; }.smp-method-list h3 { margin-top:32px; } }

/* Ecommerce dossier: 12-column grid locked to the site container (1280px). */
.container.ecp-hero-inner { width:min(calc(100% - 48px),1280px); margin-inline:auto; }
.ecp-hero-grid { inset:0 auto; left:50%; width:min(calc(100% - 48px),1280px); transform:translateX(-50%); border-inline:1px solid rgba(244,244,244,.12); background-image:linear-gradient(90deg,rgba(244,244,244,.12) 1px,transparent 1px); background-size:calc(100% / 12) 100%; }
.ecp-hero-inner,.ecp-statement-grid,.ecp-section-head,.ecp-systems-intro,.ecp-visual-head,.ecp-visual-layout,.ecp-method-heading { --ecp-column:repeat(12,minmax(0,1fr)); }
.ecp-hero-copy { max-width:none; display:grid; grid-template-columns:var(--ecp-column); column-gap:24px; }.ecp-hero-copy > .kicker,.ecp-hero-copy > h1 { grid-column:1 / span 10; }.ecp-hero-bottom { grid-column:1 / -1; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:24px; }.ecp-hero-bottom p { grid-column:1 / span 5; }.ecp-hero-bottom .ecp-button { grid-column:10 / -1; justify-self:stretch; }.ecp-hero-index { display:grid; grid-template-columns:var(--ecp-column); }.ecp-hero-index span { grid-column:span 3; }
.ecp-statement-grid { grid-template-columns:var(--ecp-column); column-gap:24px; }.ecp-statement-grid > .kicker { grid-column:1 / span 2; }.ecp-statement-grid > h2 { grid-column:3 / span 6; }.ecp-statement-grid > div { grid-column:10 / -1; }
.ecp-section-head { grid-template-columns:var(--ecp-column); column-gap:24px; }.ecp-section-head > .kicker { grid-column:1 / span 3; }.ecp-section-head > h2 { grid-column:4 / span 6; }.ecp-section-head > p { grid-column:11 / -1; }.ecp-decision-list li { grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:24px; }.ecp-decision-list .ecp-number { grid-column:1 / span 2; }.ecp-decision-list li > div { grid-column:4 / span 6; }.ecp-decision-list li > strong { grid-column:11 / -1; }
.ecp-systems-intro { grid-template-columns:var(--ecp-column); column-gap:24px; }.ecp-systems-intro > .kicker { grid-column:1 / span 3; }.ecp-systems-intro > h2 { grid-column:4 / span 8; }.ecp-systems-grid { grid-template-columns:repeat(12,minmax(0,1fr)); }.ecp-systems-grid article { grid-column:span 4; }.ecp-visual-head { grid-template-columns:var(--ecp-column); column-gap:24px; }.ecp-visual-head > .kicker { grid-column:1 / span 3; }.ecp-visual-head > h2 { grid-column:4 / span 8; }.ecp-visual-layout { grid-template-columns:var(--ecp-column); column-gap:24px; }.ecp-visual-copy { grid-column:1 / span 3; }.ecp-gallery { grid-column:5 / -1; }
.ecp-method-heading { grid-template-columns:var(--ecp-column); column-gap:24px; max-width:none; }.ecp-method-heading > .kicker { grid-column:1 / span 3; }.ecp-method-heading > h2 { grid-column:4 / span 7; }.ecp-method-list { grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:24px; }.ecp-method-list article { grid-column:span 3; }.ecp-method-note { grid-template-columns:18px minmax(0,1fr); max-width:calc((100% / 12) * 7 - 24px); margin-left:calc((100% / 12) * 3 + 24px); }
@media (max-width:980px) { .ecp-hero-copy > .kicker,.ecp-hero-copy > h1,.ecp-hero-bottom p,.ecp-hero-bottom .ecp-button,.ecp-statement-grid > .kicker,.ecp-statement-grid > h2,.ecp-statement-grid > div,.ecp-section-head > .kicker,.ecp-section-head > h2,.ecp-section-head > p,.ecp-systems-intro > .kicker,.ecp-systems-intro > h2,.ecp-visual-head > .kicker,.ecp-visual-head > h2,.ecp-visual-copy,.ecp-gallery,.ecp-method-heading > .kicker,.ecp-method-heading > h2 { grid-column:1 / -1; }.ecp-hero-bottom { row-gap:28px; }.ecp-hero-bottom .ecp-button { max-width:360px; }.ecp-decision-list .ecp-number { grid-column:1 / span 2; }.ecp-decision-list li > div { grid-column:3 / -1; }.ecp-decision-list li > strong { grid-column:3 / -1; }.ecp-systems-grid article { grid-column:1 / -1; }.ecp-method-list article { grid-column:span 6; }.ecp-method-note { max-width:none; margin-left:0; } }
@media (max-width:620px) { .ecp-hero-grid { width:calc(100% - var(--space-4)); background-size:50% 100%; }.ecp-hero-bottom .ecp-button { max-width:none; }.ecp-decision-list .ecp-number { grid-column:1; }.ecp-decision-list li > div,.ecp-decision-list li > strong { grid-column:2 / -1; }.ecp-method-list article { grid-column:1 / -1; } }

/* Ecommerce hero: versÃ£o compacta, com a mesma hierarquia visual. */
.ecp-hero { min-height:auto; align-items:stretch; }
.ecp-hero-inner { padding-top:clamp(124px,10vw,148px); padding-bottom:clamp(36px,4vw,56px); }
.ecp-hero-copy { margin-top:clamp(48px,6vw,78px); }
.ecp-hero h1 { max-width:960px; font-size:clamp(3.2rem,6vw,6.5rem); line-height:.86; }
.ecp-hero-bottom { gap:32px; margin-top:clamp(32px,4vw,48px); }
.ecp-hero-index { position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0; margin-top:clamp(42px,5vw,64px); border-block:1px solid rgba(244,244,244,.22); color:var(--paper); }
.ecp-pillar { position:relative; min-height:172px; margin:0; padding:20px clamp(16px,2vw,30px) 22px; border-right:1px solid rgba(244,244,244,.18); overflow:hidden; transition:background .35s var(--ease-out),color .35s var(--ease-out); }
.ecp-pillar:last-child { border-right:0; }
.ecp-pillar::before { content:""; position:absolute; top:0; left:0; width:100%; height:3px; background:var(--cyan); transform:scaleX(0); transform-origin:left; transition:transform .4s var(--ease-out); }
.ecp-pillar-number { display:block; color:var(--cyan); font-size:.64rem; font-weight:800; letter-spacing:.12em; line-height:1; }
.ecp-pillar h2 { max-width:180px; margin:clamp(24px,3vw,43px) 0 10px; color:inherit; font-size:clamp(1.2rem,1.65vw,1.65rem); font-weight:700; letter-spacing:-.045em; line-height:1; text-transform:uppercase; }
.ecp-pillar p { max-width:220px; margin:0; color:rgba(244,244,244,.62); font-size:.77rem; font-weight:400; letter-spacing:0; line-height:1.48; text-transform:none; transition:color .35s var(--ease-out); }
.ecp-pillar:hover,.ecp-pillar:focus-within { background:var(--cyan); color:var(--ink); }
.ecp-pillar:hover::before,.ecp-pillar:focus-within::before { transform:scaleX(1); background:var(--paper); }
.ecp-pillar:hover .ecp-pillar-number,.ecp-pillar:focus-within .ecp-pillar-number,.ecp-pillar:hover p,.ecp-pillar:focus-within p { color:var(--ink); }
@media (max-width:820px) { .ecp-hero-index { grid-template-columns:repeat(2,minmax(0,1fr)); }.ecp-pillar:nth-child(2) { border-right:0; }.ecp-pillar:nth-child(-n+2) { border-bottom:1px solid rgba(244,244,244,.18); } }
@media (max-width:620px) { .ecp-hero-inner { padding-top:112px; padding-bottom:32px; }.ecp-hero-copy { margin-top:44px; }.ecp-hero h1 { font-size:clamp(2.85rem,12vw,4.4rem); line-height:.88; }.ecp-hero-bottom { margin-top:30px; }.ecp-hero-index { grid-template-columns:1fr; margin-top:44px; }.ecp-pillar,.ecp-pillar:nth-child(2) { min-height:0; padding:18px 16px 20px; border-right:0; border-bottom:1px solid rgba(244,244,244,.18); }.ecp-pillar:last-child { border-bottom:0; }.ecp-pillar h2 { margin:20px 0 7px; }.ecp-pillar p { max-width:300px; } }

/* E-commerce hero: uma página de produto reconhecível, não uma composição abstrata. */
.commerce-hero .commerce-hero__copy h1{max-width:12.8ch;text-wrap:initial}.commerce-hero .commerce-hero__copy h1>span{display:block;white-space:nowrap}.commerce-hero .commerce-hero__copy h1>span:last-child{margin-top:.1em;font-size:.63em;letter-spacing:-.065em;line-height:1.02}.commerce-storefront{inset:0 2.15rem 2.5rem 0;background:#eef2fb}.commerce-storefront:after{background:linear-gradient(135deg,rgba(255,255,255,.32),transparent 42%,rgba(8,13,27,.13))}.commerce-storefront__top{height:3.8rem;padding:0 1.3rem}.commerce-storefront__top b{font-size:.67rem;letter-spacing:.08em}.commerce-storefront__top em{font-size:.48rem;letter-spacing:.09em}.commerce-storefront__top strong{margin-left:1rem;font-size:1.05rem;font-weight:400}.commerce-storefront__canvas{inset:3.8rem 0 0;display:grid;grid-template-columns:1.08fr .92fr;background:#dfe5f2}.commerce-product-image{position:relative;overflow:hidden;min-height:100%;background:linear-gradient(145deg,#d9e1ef 0%,#bdc8dd 100%)}.commerce-product-image:before{position:absolute;top:9%;right:9%;width:37%;aspect-ratio:1;border:1px solid rgba(11,16,32,.22);border-radius:50%;content:""}.commerce-product-image:after{position:absolute;right:-21%;bottom:-22%;width:92%;height:44%;border:1px solid rgba(11,16,32,.15);border-radius:50%;content:"";transform:rotate(-20deg)}.commerce-product-image__shade{position:absolute;z-index:1;bottom:15%;left:20%;width:55%;height:9%;border-radius:50%;background:rgba(14,20,35,.28);filter:blur(9px)}.commerce-product-image__body{position:absolute;z-index:2;bottom:19%;left:31%;width:32%;height:41%;border:clamp(8px,1.3vw,13px) solid #17213a;border-top:0;border-radius:0 0 48% 48%;background:linear-gradient(100deg,#101a32,#344565 55%,#101a32);box-shadow:inset 8px 0 12px rgba(255,255,255,.12),10px 14px 16px rgba(10,16,30,.22)}.commerce-product-image__handle{position:absolute;z-index:2;bottom:57%;left:38%;width:18%;height:27%;border:clamp(7px,1.1vw,11px) solid #17213a;border-bottom:0;border-radius:55% 55% 0 0;transform:rotate(9deg)}.commerce-product-image small{position:absolute;z-index:3;bottom:1.2rem;left:1.3rem;color:#17213a;font-size:.52rem;font-weight:800;letter-spacing:.1em}.commerce-product-info{display:flex;flex-direction:column;padding:clamp(1.35rem,3vw,2.7rem) clamp(1rem,2.4vw,2.2rem);color:#101a36;background:#f3f5fa}.commerce-product-info p{margin:0;color:#64708a;font-size:.5rem;font-weight:800;letter-spacing:.11em}.commerce-product-info h2{margin:.9rem 0 1.35rem;font-size:clamp(1.5rem,2.5vw,2.4rem);letter-spacing:-.07em;line-height:.86}.commerce-product-info>strong{font-size:.77rem}.commerce-product-info>span{display:flex;align-items:center;gap:.35rem;margin:1.3rem 0 auto;color:#64708a;font-size:.54rem}.commerce-product-info i{width:.72rem;aspect-ratio:1;border:1px solid #101a36;border-radius:50%;background:#101a36}.commerce-product-info i:nth-child(3){background:#a6b1c5}.commerce-product-info i:nth-child(4){background:#e1b37d}.commerce-product-info button{display:flex;align-items:center;justify-content:space-between;width:100%;padding:.83rem .72rem;border:0;background:#101a36;color:#f3f5fa;font:800 .48rem var(--sans);letter-spacing:.08em}.commerce-product-info button b{font-size:.95rem;font-weight:400}.commerce-cart-card{right:0;bottom:0;width:min(17.5rem,50%);border-color:rgba(140,255,209,.6)}.commerce-cart-card__item i{border-radius:0;background:linear-gradient(120deg,#aebcd2,#17213a 55%,#50668e)}.commerce-hero__visual figcaption{bottom:-2.7rem}@media(max-width:800px){.commerce-hero .commerce-hero__copy h1>span{white-space:normal}.commerce-storefront{inset:0 1.7rem 2rem 0}.commerce-storefront__top em{display:none}.commerce-storefront__canvas{grid-template-columns:1fr .82fr}}@media(max-width:460px){.commerce-hero .commerce-hero__copy h1>span:last-child{font-size:.72em}.commerce-storefront__top{height:3.05rem}.commerce-storefront__canvas{inset:3.05rem 0 0}.commerce-storefront__top strong{margin-left:.6rem}.commerce-product-info{padding:1rem .7rem}.commerce-product-info h2{font-size:1.35rem}.commerce-product-info>span{margin:.7rem 0 auto}.commerce-product-info button{padding:.66rem .48rem;font-size:.4rem}.commerce-product-image small{bottom:.7rem;left:.7rem}.commerce-cart-card{width:min(15.5rem,55%)}}


/* Ecommerce hero: tÃ­tulo menor para preservar respiro e leitura na primeira dobra. */
.ecp-hero-copy { margin-top:clamp(48px,8vw,100px); }.ecp-hero h1 { max-width:850px; font-size:clamp(2.9rem,4.2vw,5rem); line-height:.9; }

/* Ecommerce hero: vitrine de produto que materializa a jornada de compra. */
.ecp-hero-inner { position:relative; }.ecp-store-preview { position:absolute; z-index:2; top:clamp(118px,14vh,156px); right:0; width:min(31vw,430px); color:var(--paper); border:1px solid rgba(244,244,244,.3); background:#0c285c; box-shadow:18px 20px 0 var(--cyan); }.ecp-store-bar { display:flex; justify-content:space-between; padding:13px 15px; border-bottom:1px solid rgba(244,244,244,.3); font-size:.57rem; font-weight:800; letter-spacing:.12em; }.ecp-store-product { padding:14px; }.ecp-store-image { height:clamp(168px,18vw,230px); overflow:hidden; background:#ccd4da; }.ecp-store-image img { display:block; width:100%; height:100%; object-fit:cover; filter:saturate(.78) contrast(1.04); }.ecp-store-info { padding:17px 3px 5px; }.ecp-store-label { margin:0; color:var(--cyan); font-size:.58rem; font-weight:800; letter-spacing:.11em; text-transform:uppercase; }.ecp-store-info h2 { margin:9px 0 13px; font-size:clamp(1.3rem,1.7vw,1.65rem); font-weight:500; letter-spacing:-.055em; line-height:.95; }.ecp-store-price { display:flex; gap:10px; align-items:center; margin:0; font-size:.85rem; font-weight:700; }.ecp-store-price s { color:rgba(244,244,244,.5); font-size:.68rem; font-weight:400; }.ecp-store-options { display:flex; align-items:center; gap:7px; margin-top:15px; }.ecp-store-options span { margin-right:5px; color:rgba(244,244,244,.65); font-size:.59rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }.ecp-store-options i { width:13px; height:13px; border:1px solid rgba(244,244,244,.75); border-radius:50%; background:#d9dfdf; }.ecp-store-options i:nth-of-type(2) { background:var(--cyan); }.ecp-store-options i:nth-of-type(3) { background:#15233d; }.ecp-store-info button { display:flex; justify-content:space-between; width:100%; margin-top:17px; padding:12px 13px; border:0; background:var(--cyan); color:var(--ink); font:inherit; font-size:.65rem; font-weight:800; letter-spacing:.065em; text-align:left; text-transform:uppercase; }.ecp-store-info button b { font-size:1rem; line-height:.6; }.ecp-cart-preview { position:absolute; right:-36px; bottom:-40px; display:flex; align-items:center; gap:10px; width:calc(100% - 32px); padding:12px 14px; background:var(--paper); color:var(--ink); box-shadow:0 12px 26px rgba(0,0,0,.26); }.ecp-cart-icon { display:grid; width:27px; height:27px; place-items:center; border-radius:50%; background:var(--cyan); font-size:.82rem; transform:rotate(45deg); }.ecp-cart-preview p { display:grid; gap:3px; margin:0; }.ecp-cart-preview strong { font-size:.64rem; letter-spacing:.02em; }.ecp-cart-preview small { color:#677080; font-size:.54rem; }.ecp-cart-preview>b { margin-left:auto; font-size:.72rem; }.ecp-hero-copy { position:relative; z-index:3; }.ecp-hero-index { position:relative; z-index:4; }
@media (max-width:980px) { .ecp-store-preview { position:relative; top:auto; right:auto; width:min(440px,calc(100% - 36px)); margin:42px 0 72px auto; }.ecp-cart-preview { right:-18px; }.ecp-hero-copy { z-index:1; } }
@media (max-width:620px) { .ecp-store-preview { width:calc(100% - 12px); margin:34px 0 62px; box-shadow:10px 11px 0 var(--cyan); }.ecp-store-image { height:185px; }.ecp-cart-preview { right:-12px; bottom:-32px; width:calc(100% - 22px); }.ecp-store-info h2 { font-size:1.45rem; } }

/* Ecommerce hero: blueprint que comunica construÃ§Ã£o de uma loja digital, nÃ£o uma compra. */
.ecp-store-blueprint { position:absolute; z-index:2; top:clamp(118px,14vh,156px); right:0; width:min(34vw,470px); margin:0; overflow:hidden; border:1px solid rgba(244,244,244,.34); background:#0c285c; color:var(--paper); box-shadow:18px 20px 0 var(--cyan); }.ecp-blueprint-top,.ecp-blueprint-footer { display:flex; align-items:center; justify-content:space-between; padding:14px 17px; color:rgba(244,244,244,.72); font-size:.59rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }.ecp-blueprint-top { border-bottom:1px solid rgba(244,244,244,.28); }.ecp-blueprint-top span:last-child { color:var(--cyan); }.ecp-blueprint-canvas { position:relative; display:grid; grid-template-columns:repeat(2,1fr); gap:16px; min-height:405px; padding:28px; background-image:linear-gradient(rgba(244,244,244,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(244,244,244,.07) 1px,transparent 1px); background-size:24px 24px; }.ecp-flow-line { position:absolute; inset:0; pointer-events:none; }.ecp-flow-line::before,.ecp-flow-line::after,.ecp-flow-line i { position:absolute; content:""; display:block; background:var(--cyan); box-shadow:0 0 12px rgba(0,224,209,.45); }.ecp-flow-line::before { top:31%; left:23%; width:54%; height:1px; }.ecp-flow-line::after { top:31%; right:23%; width:1px; height:38%; }.ecp-flow-line i { width:7px; height:7px; border:1px solid #0c285c; border-radius:50%; }.ecp-flow-line i:nth-child(1) { top:calc(31% - 3px); left:calc(23% - 3px); }.ecp-flow-line i:nth-child(2) { top:calc(31% - 3px); right:calc(23% - 3px); }.ecp-flow-line i:nth-child(3) { top:calc(69% - 3px); right:calc(23% - 3px); }.ecp-page-card { position:relative; z-index:1; display:flex; min-height:120px; flex-direction:column; justify-content:flex-end; padding:15px; border:1px solid rgba(244,244,244,.42); background:rgba(7,29,79,.86); box-shadow:8px 9px 0 rgba(0,0,0,.17); }.ecp-page-card span { position:absolute; top:13px; left:14px; color:var(--cyan); font-size:.58rem; font-weight:800; letter-spacing:.1em; }.ecp-page-card strong { font-size:clamp(1.15rem,1.5vw,1.48rem); font-weight:600; letter-spacing:-.055em; line-height:.95; }.ecp-page-card small { margin-top:6px; color:rgba(244,244,244,.58); font-size:.58rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; }.ecp-page-catalog { margin-top:32px; }.ecp-page-product { margin-top:-4px; }.ecp-page-account { margin-top:28px; border-color:var(--cyan); background:#102d61; }.ecp-blueprint-footer { border-top:1px solid rgba(244,244,244,.28); }.ecp-blueprint-footer span { display:flex; align-items:center; gap:7px; }.ecp-blueprint-footer i { display:block; width:7px; height:7px; border-radius:50%; background:var(--cyan); box-shadow:0 0 10px var(--cyan); }.ecp-blueprint-footer b { color:var(--cyan); font-size:.54rem; }
@media (max-width:980px) { .ecp-store-blueprint { position:relative; top:auto; right:auto; width:min(470px,calc(100% - 36px)); margin:42px 0 72px auto; }.ecp-hero-copy { z-index:1; } }
@media (max-width:620px) { .ecp-store-blueprint { width:calc(100% - 12px); margin:34px 0 62px; box-shadow:10px 11px 0 var(--cyan); }.ecp-blueprint-canvas { min-height:365px; padding:19px; gap:11px; }.ecp-page-card { min-height:110px; padding:13px; }.ecp-blueprint-footer b { display:none; } }

/* O texto de apoio ocupa sozinho a base do hero; o CTA foi removido deste bloco. */
.ecp-hero-bottom { display:block; }

/* Hero de e-commerce: diagrama de desenvolvimento no fluxo, sem vitrine, preÃ§o ou botÃ£o sobreposto. */
.ecp-hero-stage { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr); gap:clamp(36px,6vw,96px); align-items:center; }
.ecp-hero-stage .ecp-hero-copy { margin-top:0; }
.ecp-store-blueprint { position:relative; top:auto; right:auto; z-index:auto; width:100%; max-width:470px; justify-self:end; margin:0; }
.ecp-store-preview,.ecp-cart-preview,.ecp-store-info button,.ecp-button { display:none !important; }
.ecp-hero-index { position:relative; z-index:auto; }
@media (max-width:980px) { .ecp-hero-stage { grid-template-columns:1fr; }.ecp-store-blueprint { justify-self:end; margin-top:10px; }.ecp-hero-stage .ecp-hero-copy { z-index:auto; } }
@media (max-width:620px) { .ecp-store-blueprint { width:100%; margin-top:4px; } }

/* Final override: e-commerce storefront hero */
.commerce-hero{position:relative;isolation:isolate;padding-block:clamp(8rem,14vh,11rem) clamp(5rem,8vw,8.5rem);background:radial-gradient(circle at 78% 40%,rgba(36,87,255,.27),transparent 24rem),linear-gradient(120deg,#080d1b 0%,#0c1429 58%,#131f43 100%)}
.commerce-hero:after{position:absolute;z-index:-1;right:-10vw;bottom:-17vw;width:45vw;height:45vw;border:1px solid rgba(140,255,209,.16);border-radius:50%;content:""}
.commerce-hero__layout{grid-template-columns:minmax(0,.92fr) minmax(27rem,.88fr);gap:clamp(3rem,7vw,8rem)}
.commerce-hero h1{max-width:10.6ch;font-size:clamp(3.45rem,5.5vw,6.1rem);line-height:.91;letter-spacing:-.078em}
.commerce-hero__intro{max-width:31rem;margin-top:2rem}
.commerce-hero__visual{position:relative;width:min(100%,38rem);min-height:32rem;margin:0 0 0 auto}
.commerce-storefront{position:absolute;inset:0 3.35rem 2.9rem 0;overflow:hidden;border:1px solid rgba(234,240,255,.28);background:#eaf0ff;box-shadow:0 2.1rem 5.5rem rgba(0,0,0,.27)}
.commerce-storefront:after{position:absolute;inset:0;background:linear-gradient(135deg,rgba(255,255,255,.36),transparent 35%,rgba(8,13,27,.09));content:"";pointer-events:none}
.commerce-storefront__top{position:relative;z-index:1;display:flex;align-items:center;height:3.35rem;padding:0 1.1rem;border-bottom:1px solid rgba(11,16,32,.15);color:#0b1020;font-size:.5rem;font-style:normal;font-weight:800;letter-spacing:.1em}
.commerce-storefront__top i{width:.38rem;height:.38rem;margin-right:.28rem;border-radius:50%;background:#0b1020}.commerce-storefront__top span{flex:1}.commerce-storefront__top b{font-size:.6rem;letter-spacing:.13em}.commerce-storefront__top em{margin-left:auto;font-style:normal}
.commerce-storefront__canvas{position:absolute;inset:3.35rem 0 3.2rem;overflow:hidden;background:linear-gradient(153deg,#cad7f7 0 38%,#9cb2f5 38% 66%,#eff4ff 66%)}
.commerce-storefront__sun{position:absolute;top:7%;right:9%;width:21%;aspect-ratio:1;border:1px solid rgba(11,16,32,.34);border-radius:50%}
.commerce-storefront__orb{position:absolute;display:block;border-radius:47% 53% 51% 49% / 38% 47% 53% 62%;background:linear-gradient(135deg,#72ffd2 2%,#2354ff 56%,#101942 100%);box-shadow:inset -.8rem -.8rem 1.8rem rgba(4,9,44,.28),inset .7rem .7rem 1.5rem rgba(255,255,255,.38),1rem 1.4rem 1.4rem rgba(8,15,41,.16)}
.commerce-storefront__orb--one{z-index:2;top:21%;left:21%;width:43%;aspect-ratio:1;transform:rotate(-24deg)}.commerce-storefront__orb--two{z-index:1;right:9%;bottom:14%;width:27%;aspect-ratio:1;transform:rotate(54deg);filter:saturate(.8)}.commerce-storefront__orb--three{bottom:17%;left:8%;width:17%;aspect-ratio:1;transform:rotate(12deg);background:#0b1020}
.commerce-storefront__base{position:absolute;z-index:3;bottom:21%;left:16%;width:54%;height:10%;border-radius:50%;background:rgba(8,14,37,.28);filter:blur(8px)}.commerce-storefront__floor{position:absolute;right:-10%;bottom:-24%;width:93%;height:52%;border:1px solid rgba(11,16,32,.22);border-radius:50%;transform:rotate(-25deg)}
.commerce-storefront__bottom{position:absolute;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:center;height:3.2rem;padding:0 1.1rem;color:#0b1020;font-size:.55rem;font-weight:800;letter-spacing:.08em}.commerce-storefront__bottom span{flex:1;border-top:1px solid rgba(11,16,32,.25);margin:0 1rem}.commerce-storefront__bottom em{font-style:normal}
.commerce-cart-card{position:absolute;right:0;bottom:0;width:min(16.8rem,47%);padding:1rem;border:1px solid rgba(140,255,209,.7);background:#111b38;color:#eaf0ff;box-shadow:1.2rem 1.2rem 0 #2457ff,0 1.8rem 3.2rem rgba(0,0,0,.26)}
.commerce-cart-card__head,.commerce-cart-card__total{display:flex;justify-content:space-between;font-size:.58rem;font-weight:800;letter-spacing:.11em}.commerce-cart-card__head{padding-bottom:.85rem;border-bottom:1px solid rgba(234,240,255,.18);color:#8cffd1}.commerce-cart-card__item{display:grid;grid-template-columns:2.35rem 1fr auto;align-items:center;gap:.65rem;padding:1rem 0;border-bottom:1px solid rgba(234,240,255,.18)}.commerce-cart-card__item i{display:block;width:2.35rem;aspect-ratio:1;border-radius:39% 61% 48% 52% / 43% 45% 55% 57%;background:linear-gradient(135deg,#8cffd1,#2457ff 60%,#131a3d);transform:rotate(-22deg)}.commerce-cart-card__item b,.commerce-cart-card__item em{font-size:.62rem;font-style:normal}.commerce-cart-card__item small{display:block;margin-top:.2rem;color:#9aa6c4;font-size:.5rem}.commerce-cart-card__total{padding:1rem 0;color:#fff}.commerce-cart-card__button{display:flex;justify-content:space-between;padding:.72rem .78rem;background:#8cffd1;color:#0b1020;font-size:.5rem;font-weight:800;letter-spacing:.08em}.commerce-cart-card__button b{font-size:.85rem;line-height:.5rem}.commerce-hero__visual figcaption{position:absolute;bottom:-3.55rem;left:0;color:rgba(234,240,255,.56);font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
@media (max-width:800px){.commerce-hero{padding-block:7.5rem 7rem}.commerce-hero__layout{grid-template-columns:1fr;gap:3.5rem}.commerce-hero__visual{width:min(100%,34rem);min-height:27rem;margin:0 auto}.commerce-hero__visual figcaption{bottom:-2.5rem}.commerce-storefront{inset:0 2.4rem 2.2rem 0}.commerce-cart-card{width:min(16rem,49%);box-shadow:.85rem .85rem 0 #2457ff}.commerce-hero h1{font-size:clamp(3.3rem,10vw,5rem)}}
@media (max-width:460px){.commerce-hero__visual{min-height:22rem}.commerce-storefront__top{height:2.7rem;padding:0 .7rem}.commerce-storefront__canvas{inset:2.7rem 0 2.7rem}.commerce-storefront__bottom{height:2.7rem;padding:0 .7rem}.commerce-cart-card{padding:.7rem}.commerce-cart-card__item{grid-template-columns:1.8rem 1fr;padding:.7rem 0}.commerce-cart-card__item i{width:1.8rem}.commerce-cart-card__item em{display:none}.commerce-cart-card__button{padding:.62rem;font-size:.43rem}.commerce-hero__visual figcaption{font-size:.48rem}}
