@font-face{font-family:Sora;src:url('/assets/asset-84ff7096ae3e.ttf') format('truetype');font-style:normal;font-weight:100 800;font-display:swap} :root{font-family:Sora,system-ui,sans-serif;color:#101218;background:#080c15;--line:#dfe3e9;--muted:#626b7b;--blue:#2458f5;--rose:#be3f84;--cyan:#57e3f2}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;font-size:14px;line-height:1.8}button,input{font:inherit}button{cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}h1,h2,h3,h4,p,figure,blockquote,ul,ol,dl,dd{margin:0}h1,h2,h3,h4{font-weight:500;letter-spacing:-.035em;line-height:1.2;text-wrap:balance}h2{font-size:clamp(32px,3.5vw,46px)}h3{font-size:28px}p{text-wrap:pretty}img{max-width:100%}img,svg{vertical-align:middle}.ag-icon{width:22px;height:22px;flex:none}[hidden]{display:none!important}a,button,summary{touch-action:manipulation}a:focus-visible,button:focus-visible,summary:focus-visible,[tabindex="0"]:focus-visible{outline:3px solid #5275d2;outline-offset:4px}main:focus{outline:0}.ex-wrap{width:min(calc(100% - 64px),1193px);margin:auto}.ex-section{padding:96px 0;background:#fff}.ex-kicker{font-size:10px;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:#616b7e;margin-bottom:24px;display:flex;align-items:center;gap:10px}.ex-kicker::before{content:'';width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:0 0 0 5px #64728a10;flex:none}.ex-label{display:flex;align-items:center;gap:7px;font-size:9px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:#70798b;line-height:1.6}.ex-label svg{width:15px;height:15px}.ex-heading{max-width:830px;margin-bottom:48px}.ex-heading>p:not(.ex-kicker){font-size:15px;line-height:1.85;color:var(--muted);margin-top:24px;max-width:740px}.ex-text-link{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:12px}.ex-text-link svg{width:17px;height:17px;transition:transform .2s}.ex-text-link:hover svg{transform:translateX(3px)}.ex-sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0)}.ex-skip{position:fixed;left:20px;top:10px;z-index:100;background:#fff;padding:12px 24px;transform:translateY(-150%)}.ex-skip:focus{transform:none}.ex-icon-tile{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid #dde1e9;border-radius:12px;background:#f5f6f9;color:#707d92}.ex-checks{display:grid;gap:12px;list-style:none;padding:0;margin-top:24px}.ex-checks li{display:flex;align-items:flex-start;gap:9px;font-size:12px;color:#626c7b}.ex-checks svg{width:15px;height:15px;color:#8593aa;margin-top:4px} .ex-hero{position:relative;isolation:isolate;background:#080c15;color:#fff;overflow:hidden;padding-top:24px}.ex-hero::before{content:'';position:absolute;inset:0;z-index:-2;background:url('/assets/experiencia/home-cerebral-cyan.svg') 65% 50%/cover no-repeat;opacity:.34;filter:grayscale(1)}.ex-hero::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#080c15f5 0%,#080c15bc 30%,#080c1500 78%),linear-gradient(0deg,#080c15 0%,transparent 30%)}.ex-breadcrumb{display:flex;gap:12px;font-size:11px;color:#8d9eb6;min-height:34px;align-items:center;width:fit-content}.ex-hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:64px 0 80px}.ex-hero h1{font-size:clamp(38px,3.65vw,52px);line-height:1.16}.ex-hero h1 span{color:#b9c4d6}.ex-hero .ex-kicker{color:#a5b2c7}.ex-lead{color:#aeb9ca;font-size:14px;line-height:1.95;margin-top:24px}.ex-actions{display:flex;align-items:center;gap:12px 24px;flex-wrap:wrap;margin-top:32px}.ex-pillars{list-style:none;display:flex;flex-wrap:wrap;gap:8px 16px;border-top:1px solid #2b3343;padding:20px 0 0;margin-top:32px}.ex-pillars li{display:flex;align-items:center;gap:7px;font-size:10px;color:#b2bccd}.ex-pillars svg{width:15px;height:15px;color:#95a3bb}.ex-hero-art{position:relative;min-width:0}.ex-hero-art::before,.ex-hero-art::after{content:'';position:absolute;z-index:-1;border:1px solid #8192ae2e;border-radius:24px;pointer-events:none}.ex-hero-art::before{inset:-14px 14px 14px -14px;background:#8998b005}.ex-hero-art::after{inset:14px -14px -14px 14px}.ex-conversation-window{background:#fff;border:1px solid #c4cbd7;border-radius:20px;overflow:hidden;color:#101218;box-shadow:0 24px 65px #0004}.ex-window-bar{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;background:#1b2330;color:#ced6e4;font-size:11px}.ex-window-bar>span:first-child{display:flex;align-items:center;gap:8px}.ex-window-bar svg{width:16px;height:16px;color:#a4b3ca}.ex-window-bar>span:last-child{letter-spacing:3px;color:#7c8ba4}.ex-conversation-head{display:flex;align-items:center;gap:12px;padding:22px 24px;border-bottom:1px solid var(--line)}.ex-brand-avatar{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;color:#596b88;background:#f0f3f8;border:1px solid #d5deec;flex:none}.ex-conversation-head strong,.ex-phone-head strong{font-size:13px;font-weight:500;display:block;line-height:1.6}.ex-conversation-head small,.ex-phone-head small{font-size:10px;display:block;color:#7a8598;line-height:1.7}.ex-tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);margin-bottom:28px}.ex-tabs button{border:0;border-bottom:2px solid transparent;background:none;padding:14px 18px;min-height:48px;font-size:12px;color:#697487;transition:color .2s,background .2s}.ex-tabs button[aria-selected=true]{color:#202e45;border-color:#6c809f;background:#f3f5f8}.ex-hero-tabs{display:grid;grid-template-columns:repeat(3,1fr);padding:0 24px;margin:0;gap:12px}.ex-hero-tabs button{font-size:11px;padding:12px 3px}.ex-hero-tabs button[aria-selected=true]{background:none}.ex-hero-panels{padding:20px 24px}.ex-hero-panels>[role=tabpanel]{min-height:306px}.ex-demo-time{font-size:8px;letter-spacing:.08em;color:#8b95a5;text-align:center;margin-bottom:16px}.ex-message{font-size:11px;line-height:1.85;padding:12px 15px;border:1px solid #e0e4ec;border-radius:12px;margin-bottom:12px;max-width:94%}.ex-message>span{display:flex;align-items:center;gap:5px;font-size:9px;color:#8a91a0;margin-bottom:5px}.ex-message svg{width:13px;height:13px}.ex-user{margin-left:auto;background:#fff}.ex-agent{background:#f2f5f9;border-color:#dce3ed;color:#3d4b60}.ex-agent>span{color:#657b9c}.ex-memory{border-top:1px solid #e6e9ef;padding-top:16px;margin-top:18px}.ex-memory>span{display:flex;align-items:center;gap:7px;font-size:9px;color:#94677f;margin-bottom:8px}.ex-memory svg{width:14px;height:14px}.ex-memory p{font-size:10px;color:#697488;line-height:1.9}.ex-demo-footer{display:flex;align-items:center;gap:7px;padding:14px 24px;background:#f7f8fa;border-top:1px solid #e4e7ec;color:#7a8699;font-size:9px}.ex-demo-footer svg{width:14px;height:14px} .ex-belief-intro{display:grid;grid-template-columns:1.1fr 1fr;gap:90px;align-items:center}.ex-belief-intro .ex-heading{margin-bottom:0}.ex-belief-intro>p{font-size:16px;line-height:1.9;color:#657084}.ex-belief-points{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:56px;padding-top:32px;border-top:1px solid var(--line)}.ex-belief-points article>span{color:#8b94a5;font-size:11px}.ex-belief-points h3{font-size:21px;margin-top:18px}.ex-belief-points p{font-size:12px;color:var(--muted);margin-top:14px}.ex-value{background:#f6f7f9}.ex-value-panels{border:1px solid #dbe1ea;background:#fff;border-radius:20px;overflow:hidden}.ex-value-panels>[role=tabpanel]{display:grid;grid-template-columns:1.35fr .8fr;min-height:400px}.ex-value-copy{padding:40px}.ex-value-copy h3{font-size:30px;margin-top:24px}.ex-value-copy>p{font-size:13px;color:#697284;line-height:1.9;margin-top:16px}.ex-value-copy dl{display:grid;grid-template-columns:1fr 1fr;gap:24px;border-top:1px solid #e3e7ed;padding-top:24px;margin-top:24px}.ex-value-copy dt{font-size:10px;color:#758199;margin-bottom:8px}.ex-value-copy dd{font-size:12px;line-height:1.9;color:#435167}.ex-value-project{background:linear-gradient(135deg,#eaf0f8,#f4f5f8);border-left:1px solid #e0e5ee;padding:40px;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.ex-value-project h4{font-size:27px;line-height:1.35;margin-top:24px}.ex-value-project>p{font-size:13px;line-height:1.9;color:#62728b;margin-top:20px}.ex-value-project .ex-text-link{margin-top:24px;font-size:11px;color:#465b78}.ex-value-panels>[role=tabpanel]:nth-child(2) .ex-value-project{background:linear-gradient(135deg,#f1edf5,#f6f5f8)}.ex-value-panels>[role=tabpanel]:nth-child(3) .ex-value-project{background:linear-gradient(135deg,#edf3f1,#f5f7f6)} .ex-proactive{background:#101721;color:#fff;isolation:isolate;position:relative;overflow:hidden}.ex-proactive::before{content:'';position:absolute;inset:0;z-index:-1;background:url('/assets/experiencia/home-cerebral-cyan.svg') 100% 60%/cover no-repeat;opacity:.11;filter:grayscale(1)}.ex-proactive .ex-kicker{color:#acbad0}.ex-proactive .ex-heading>p:not(.ex-kicker){color:#aeb8c8}.ex-proactive .ex-tabs{border-color:#344052}.ex-proactive .ex-tabs button{color:#a4b0c4}.ex-proactive .ex-tabs button[aria-selected=true]{background:#1e2a3b;color:#e6edf8;border-color:#9aafce}.ex-proactive-panels>[role=tabpanel]{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:stretch;min-height:390px}.ex-trigger{padding:24px 24px 16px 0}.ex-trigger>.ex-label{color:#98accb}.ex-trigger h3{font-size:29px;margin-top:20px;color:#e5eaf2;max-width:440px}.ex-timeline{list-style:none;padding:0;margin-top:32px}.ex-timeline li{display:flex;gap:16px;position:relative;padding:0 0 24px}.ex-timeline li:first-child::before{content:'';position:absolute;top:32px;bottom:0;left:15px;width:1px;background:#3b4a60}.ex-timeline li>span{display:flex;align-items:center;justify-content:center;flex:none;width:32px;height:32px;border:1px solid #41516a;border-radius:50%;font-size:9px;color:#91a5c4}.ex-timeline strong{font-size:12px;font-weight:500}.ex-timeline p{font-size:11px;color:#a5b3c9;margin-top:5px}.ex-proactive-message{background:#f8fafc;color:#27364b;padding:28px;border:1px solid #99a9bf;border-radius:20px;box-shadow:0 20px 50px #0002}.ex-phone-head{display:flex;gap:12px;align-items:center;border-bottom:1px solid #dce3ed;margin:20px 0;padding-bottom:20px}.ex-phone-head i{width:6px;height:6px;border-radius:50%;background:#7bb7a5;margin-left:auto}.ex-proactive-message .ex-message{font-size:13px;max-width:96%;background:#edf2f8;padding:18px}.ex-result{display:flex;align-items:flex-start;gap:8px;font-size:10px;color:#7b8c9e;margin-top:20px}.ex-result svg{width:15px;height:15px;margin-top:2px;color:#879cbb} .ex-format-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:20px}.ex-format-grid article{grid-column:span 2;border:1px solid #dfe4eb;border-radius:16px;padding:28px;background:#fff}.ex-format-grid h3{font-size:21px;line-height:1.3;margin-top:24px}.ex-format-grid p{font-size:12px;color:#697386;margin-top:16px;line-height:1.9}.ex-format-grid .ex-format-3,.ex-format-grid .ex-format-4{grid-column:span 3;background:#f6f8fa}.ex-cases{padding-top:0}.ex-case{display:grid;grid-template-columns:.85fr 1.15fr;gap:64px;align-items:center;padding:56px 0;border-top:1px solid #dfe4eb;scroll-margin-top:32px}.ex-case:last-child{padding-bottom:0}.ex-case-name{display:block;font-size:14px;font-weight:500;color:#63768a;margin:20px 0 12px}.ex-case h3{font-size:33px;line-height:1.2}.ex-case-copy>p:not(.ex-label){font-size:13px;line-height:1.9;color:#647184;margin-top:20px}.ex-case .ex-text-link{margin-top:24px;color:#526780}.ex-case-film{min-width:0;background:#f3f5f7;border:1px solid #dbe2ea;border-radius:18px;overflow:hidden;box-shadow:0 14px 40px #14233b08}.ex-case-film video{width:100%;height:auto;aspect-ratio:16/9;display:block;background:#101218;object-fit:contain}.ex-case-film figcaption{display:flex;align-items:center;gap:8px;font-size:10px;color:#718095;padding:14px 18px;border-top:1px solid #dbe2ea}.ex-case-film figcaption svg{width:15px;height:15px}.ex-case-polishop .ex-case-name{color:#9d657b}.ex-case-polishop .ex-case-film{border-color:#e5dce2}.ex-case-polishop figcaption{background:#f7f4f6;border-color:#e5dce2}.ex-video-error{font-size:11px;padding:12px 18px;color:#5a6677}.ex-video-error a{display:inline-flex;gap:6px;align-items:center;text-decoration:underline}.ex-video-error svg{width:13px;height:13px} .ex-twin{background:#f5f6f9}.ex-twin-grid{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:80px}.ex-twin .ex-heading{margin:0}.ex-twin .ex-heading h2{font-size:38px}.ex-twin blockquote{border:1px solid #dce1eb;padding:40px;border-radius:24px;background:linear-gradient(135deg,#eff2f8,#fff);position:relative;overflow:hidden}.ex-twin blockquote::after{content:'';position:absolute;width:300px;height:300px;border:1px solid #d3dce94d;border-radius:50%;right:-180px;top:-80px;box-shadow:0 0 0 22px #e3eaf52b,0 0 0 44px #e3eaf52b;pointer-events:none}.ex-twin-symbol{display:flex;align-items:center;gap:12px;color:#8292ae}.ex-twin-symbol svg{width:36px;height:36px;position:relative;z-index:1}.ex-twin-symbol i{display:block;width:80px;height:1px;background:linear-gradient(90deg,#cdd7e8,#a7b8d4)}.ex-twin blockquote>p{font-size:25px;line-height:1.55;letter-spacing:-.03em;color:#46546e;margin-top:32px;position:relative;z-index:1}.ex-twin-note{display:block;font-size:8px;letter-spacing:.09em;color:#7a8ba5;margin-top:24px}.ex-projects{padding-bottom:0}.ex-project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.ex-project-grid>a{padding:24px;border-top:1px solid #cbd4e3;background:linear-gradient(180deg,#f5f7fa,#fff);transition:background .2s}.ex-project-grid>a:hover{background:#f0f3f9}.ex-project-number{display:flex;justify-content:space-between;align-items:center;font-size:10px;color:#a0abba}.ex-project-number svg{width:15px;height:15px;color:#8d9bb1}.ex-project-grid h3{font-size:24px;margin:26px 0 16px}.ex-project-grid strong{font-size:11px;font-weight:500;color:#53647c}.ex-project-grid p{font-size:11px;color:#6b788b;margin-top:10px}.ex-portfolio-note{font-size:11px;color:#939ba8;margin-top:24px}.ex-ecosystem ol{display:grid;grid-template-columns:repeat(4,1fr);list-style:none;padding:0;border:1px solid #dce2ea;border-radius:20px;overflow:hidden}.ex-ecosystem> .ex-wrap>ol>li{padding:32px 24px;position:relative;border-left:1px solid #e0e5ec;--product:#101218}.ex-ecosystem>.ex-wrap>ol>li:first-child{border-left:0}.ex-ecosystem>.ex-wrap>ol>li:nth-child(2){--product:#2458f5}.ex-ecosystem>.ex-wrap>ol>li:nth-child(3){--product:#be3f84}.ex-ecosystem>.ex-wrap>ol>li:nth-child(4){--product:#57e3f2}.ex-ecosystem>.ex-wrap>ol>li::before{content:'';position:absolute;inset:0 0 auto;height:3px;background:var(--product)}.ex-ecosystem li>.ag-icon{color:var(--product);margin-bottom:24px}.ex-ecosystem h3{font-size:19px}.ex-ecosystem h3 a{display:flex;align-items:center;gap:8px}.ex-ecosystem h3 svg{width:15px;height:15px;color:#919bad}.ex-ecosystem p{font-size:12px;color:#6a7586;margin-top:16px}.ex-process{margin-top:64px}.ex-process>h3{font-size:30px;max-width:700px}.ex-process>ol{border:0;border-radius:0;gap:32px;margin-top:32px}.ex-process li{border-top:1px solid #dce2ea;padding-top:24px}.ex-process li>span{font-size:10px;color:#929db0}.ex-process h4{font-size:17px;margin-top:16px}.ex-process li p{font-size:11px;margin-top:12px}.ex-faq{background:#f6f7fa}.ex-faq-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px}.ex-faq details{border-bottom:1px solid #d8dfe9}.ex-faq details:first-child{border-top:1px solid #d8dfe9}.ex-faq summary{display:flex;align-items:center;justify-content:space-between;gap:20px;list-style:none;padding:24px 0;font-size:14px;font-weight:500;cursor:pointer}.ex-faq summary::-webkit-details-marker{display:none}.ex-faq summary svg{width:16px;height:16px;color:#899ab6}.ex-faq details[open] summary svg{transform:rotate(45deg)}.ex-faq details>p{font-size:13px;color:#657185;padding:0 24px 24px 0;line-height:1.9}.ex-closing{background:#080c15;color:#fff;position:relative;isolation:isolate;overflow:hidden}.ex-closing::before{content:'';position:absolute;inset:0;z-index:-2;background:url('/assets/experiencia/home-cerebral-cyan.svg') 85% 50%/cover no-repeat;opacity:.35;filter:grayscale(1)}.ex-closing::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#080c15 10%,#080c15b3 52%,transparent)}.ex-closing h2{font-size:clamp(36px,4.2vw,58px);max-width:960px}.ex-closing h2 span{color:#bcc7d8}.ex-closing .ex-kicker{color:#aab8ce}.ex-closing .ex-wrap>p:not(.ex-kicker){font-size:15px;color:#aeb9ca;max-width:720px;margin:28px 0 32px} @media(min-width:1440px){.ex-hero-grid{padding-top:80px;padding-bottom:96px}.ex-section{padding-top:112px;padding-bottom:112px}.ex-cases{padding-top:0}.ex-projects{padding-bottom:0}} @media(max-width:1050px){.ex-hero-grid{gap:40px}.ex-hero h1{font-size:40px}.ex-hero .ex-kicker{font-size:9px}.ex-hero-panels{padding:20px}.ex-hero-panels>[role=tabpanel]{min-height:330px}.ex-belief-intro{gap:48px}.ex-value-copy,.ex-value-project{padding:28px}.ex-case{gap:40px}.ex-case h3{font-size:29px}.ex-twin-grid{gap:40px}.ex-twin blockquote{padding:32px}.ex-ecosystem>.ex-wrap>ol>li{padding:28px 20px}.ex-ecosystem h3{font-size:16px}.ex-project-grid{gap:12px}.ex-project-grid>a{padding:20px}.ex-project-grid h3{font-size:21px}} @media(max-width:850px){.ex-hero-grid{grid-template-columns:1fr;gap:56px;padding-top:48px}.ex-hero-copy{max-width:690px}.ex-hero h1{font-size:50px}.ex-hero-art{max-width:650px;width:100%}.ex-hero-panels>[role=tabpanel]{min-height:286px}.ex-hero .ex-kicker{font-size:10px}.ex-belief-intro,.ex-twin-grid{grid-template-columns:1fr;gap:32px}.ex-belief-intro>p{max-width:670px}.ex-twin blockquote{max-width:640px}.ex-proactive-panels>[role=tabpanel]{gap:24px}.ex-trigger h3{font-size:25px}.ex-proactive-message{padding:24px}.ex-case{grid-template-columns:1fr;gap:32px}.ex-case-copy{max-width:680px}.ex-case-film{max-width:800px}.ex-project-grid,.ex-ecosystem ol{grid-template-columns:1fr 1fr}.ex-ecosystem>.ex-wrap>ol>li:nth-child(3){border-left:0;border-top:1px solid #e0e5ec}.ex-ecosystem>.ex-wrap>ol>li:nth-child(4){border-top:1px solid #e0e5ec}.ex-ecosystem h3{font-size:20px}.ex-faq-grid{grid-template-columns:1fr;gap:40px}.ex-format-grid{grid-template-columns:repeat(2,1fr)}.ex-format-grid article,.ex-format-grid .ex-format-3{grid-column:span 1}.ex-format-grid .ex-format-4{grid-column:span 2}.ex-belief-points{gap:24px}.ex-belief-points h3{font-size:19px}.ex-value-panels>[role=tabpanel]{grid-template-columns:1.15fr .85fr}.ex-value-copy h3{font-size:25px}.ex-value-copy dl{grid-template-columns:1fr;gap:16px}.ex-value-project h4{font-size:23px}} @media(max-width:640px){.ex-wrap{width:calc(100% - 40px)}.ex-section{padding:64px 0}.ex-hero-grid{padding:36px 0 56px;gap:40px}.ex-hero h1{font-size:38px;line-height:1.19}.ex-hero-art::before{inset:-8px 8px 8px -8px}.ex-hero-art::after{inset:8px -8px -8px 8px}.ex-hero .ex-kicker{font-size:8px;letter-spacing:.06em;margin-bottom:20px}.ex-lead{font-size:13px}.ex-breadcrumb{font-size:10px}.ex-hero-tabs{padding:0 16px;gap:10px}.ex-hero-tabs button{font-size:10px}.ex-window-bar{font-size:10px;padding:14px 16px}.ex-conversation-head{padding:18px 16px}.ex-hero-panels{padding:18px 16px}.ex-hero-panels>[role=tabpanel]{min-height:324px}.ex-message{font-size:11px;padding:12px}.ex-demo-footer{font-size:8px;padding:14px 16px}.ex-pillars{font-size:9px;gap:10px 14px}.ex-pillars li{font-size:9px}.ex-pillars svg{width:14px;height:14px}.ex-actions{gap:12px 20px}.ex-actions .ex-text-link{font-size:11px}.ex-heading{margin-bottom:32px}.ex-kicker{font-size:9px;margin-bottom:20px}.ex-heading>p:not(.ex-kicker){font-size:13px;margin-top:20px}.ex-belief-intro>p{font-size:14px}.ex-belief-points{grid-template-columns:1fr;gap:24px;margin-top:32px;padding-top:28px}.ex-belief-points article{display:grid;grid-template-columns:24px 1fr;gap:6px 14px}.ex-belief-points article>span{grid-row:span 2;padding-top:2px}.ex-belief-points h3{margin:0;font-size:21px}.ex-belief-points p{grid-column:2;margin:0}.ex-tabs{gap:4px;overflow-x:auto}.ex-tabs button{font-size:10px;line-height:1.6;padding:12px 9px;flex:1}.ex-value-panels>[role=tabpanel]{grid-template-columns:1fr}.ex-value-copy{padding:24px}.ex-value-project{padding:24px;border-left:0;border-top:1px solid #e0e5ee}.ex-value-copy h3{font-size:27px}.ex-value-copy dl{grid-template-columns:1fr}.ex-value-project h4{font-size:25px;margin-top:14px}.ex-value-project>p{margin-top:12px}.ex-value-project .ex-text-link{margin-top:14px}.ex-proactive-panels>[role=tabpanel]{grid-template-columns:1fr;gap:12px}.ex-trigger{padding:12px 0 0}.ex-trigger h3{font-size:27px}.ex-timeline{margin-top:24px}.ex-proactive-message{padding:24px 20px}.ex-proactive-message .ex-message{font-size:12px;max-width:100%}.ex-format-grid{grid-template-columns:1fr;gap:14px}.ex-format-grid article,.ex-format-grid .ex-format-3,.ex-format-grid .ex-format-4{grid-column:span 1;padding:24px}.ex-format-grid h3{font-size:23px;margin-top:20px}.ex-format-grid p{font-size:13px;margin-top:12px}.ex-cases{padding-top:0}.ex-case{padding:36px 0}.ex-case h3{font-size:30px}.ex-case-name{margin-top:18px}.ex-case-film figcaption{font-size:9px}.ex-twin .ex-heading h2{font-size:32px}.ex-twin blockquote{padding:28px}.ex-twin blockquote>p{font-size:25px}.ex-projects{padding-bottom:0}.ex-project-grid{grid-template-columns:1fr 1fr;gap:16px}.ex-project-grid>a{padding:16px 12px}.ex-project-grid h3{font-size:21px}.ex-project-grid strong{font-size:10px}.ex-project-grid p{font-size:11px}.ex-project-number{font-size:9px}.ex-ecosystem>.ex-wrap>ol>li{padding:24px 16px}.ex-ecosystem h3{font-size:17px}.ex-ecosystem h3 svg{display:none}.ex-ecosystem p{font-size:11px}.ex-process{margin-top:48px}.ex-process>h3{font-size:28px}.ex-process>ol{gap:24px}.ex-process h4{font-size:16px}.ex-faq summary{font-size:13px;padding:22px 0}.ex-faq details>p{font-size:12px;padding-right:0}.ex-closing h2{font-size:36px}.ex-closing .ex-wrap>p:not(.ex-kicker){font-size:14px}.ex-proactive-tabs button{font-size:9px}} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}@media(forced-colors:active){.ex-tabs button[aria-selected=true]{border:2px solid Highlight}}@media print{.ex-hero,.ex-proactive,.ex-closing{background:white;color:#101218}.ex-hero::before,.ex-hero::after,.ex-proactive::before,.ex-closing::before,.ex-closing::after{display:none}.ex-section{padding:32px 0}.ex-hero-grid,.ex-belief-intro,.ex-twin-grid,.ex-proactive-panels>[role=tabpanel],.ex-faq-grid,.ex-case{grid-template-columns:1fr}.ex-hero h1 span,.ex-closing h2 span{color:#101218}.ex-conversation-window{box-shadow:none}.ex-tabs{display:none}[role=tabpanel][hidden]{display:block!important;margin-top:24px}.ex-case-film{break-inside:avoid}} /* Shared commercial section. Scoped independently of the host page. */ /* Profissio site: the 5 rules that turned the CTA into a pale button were removed (the in-page CTA is the discreet one in the page tone, src/cta.css). Colours, type and the one-line chips are aligned in src/commercial/align.css. */ .pc-section{--pc-accent:#4b6796;--pc-ink:#152238;--pc-text:#59697f;--pc-line:#dbe3ef;--pc-soft:#f4f7fc;--pc-tint:#e9eff8;--pc-muted:#a3b7d7;background:#fff;color:var(--pc-ink);color-scheme:light;padding:100px 0;font-family:inherit;line-height:1.7;scroll-margin-top:100px} .pc-section.pc-theme-neutral{--pc-accent:#5c6371;--pc-ink:#101218;--pc-text:#616976;--pc-line:#dfe2e8;--pc-soft:#f7f8fa;--pc-tint:#eef0f3;--pc-muted:#a6aeba} .pc-section.pc-theme-rose{--pc-accent:#a34b7d;--pc-ink:#291d2c;--pc-text:#706272;--pc-line:#e8dce7;--pc-soft:#faf5f9;--pc-tint:#f4e9f1;--pc-muted:#d4a4c2} .pc-section.pc-theme-cyan{--pc-accent:#326f77;--pc-ink:#142d33;--pc-text:#546e73;--pc-line:#d7e8e9;--pc-soft:#f3fafb;--pc-tint:#e8f4f5;--pc-muted:#95cbd0} .pc-section *,.pc-section *::before,.pc-section *::after{box-sizing:border-box} .pc-section .pc-wrap{width:calc(100% - 64px);max-width:1193px;margin:0 auto} .pc-section h2,.pc-section h3,.pc-section p,.pc-section ol,.pc-section ul{margin:0} .pc-section .pc-icon{display:block;width:22px;height:22px;flex:none;color:var(--pc-accent)} .pc-section .pc-intro{display:grid;grid-template-columns:1fr 1fr;gap:72px;align-items:center} .pc-section .pc-copy{max-width:580px} .pc-section .pc-kicker{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--pc-accent);margin-bottom:25px} .pc-section .pc-kicker>span{display:block;width:6px;height:6px;background:var(--pc-accent);box-shadow:0 0 0 5px var(--pc-soft);border-radius:50%} .pc-section h2{font-size:clamp(32px,3.5vw,45px);font-weight:500;letter-spacing:-.045em;line-height:1.17;text-wrap:balance} .pc-section h2>span{color:var(--pc-accent)} .pc-section .pc-lead{font-size:15px;color:var(--pc-text);margin-top:25px;max-width:520px} .pc-section .pc-billing{font-size:13px;color:var(--pc-text);margin-top:19px;padding-left:17px;border-left:2px solid var(--pc-muted)} .pc-section .pc-cta{margin-top:28px} .pc-section .pc-ledger{border:1px solid var(--pc-line);border-radius:25px;overflow:hidden;background:linear-gradient(140deg,var(--pc-soft),#fff);box-shadow:0 15px 45px rgba(20,34,52,.035)} .pc-section .pc-ledger-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:22px 27px;border-bottom:1px solid var(--pc-line);font-size:12px;font-weight:500} .pc-section .pc-pill{display:inline-block;white-space:nowrap;padding:5px 10px;border:1px solid var(--pc-line);border-radius:99px;font-size:10px;font-weight:400;color:var(--pc-accent);background:#fff} .pc-section .pc-journey{list-style:none;padding:10px 27px} .pc-section .pc-journey li{position:relative;display:flex;gap:14px;align-items:center;padding:18px 0} .pc-section .pc-journey li:not(:last-child)::after{content:'';position:absolute;left:19px;top:60px;bottom:-8px;border-left:1px solid var(--pc-line)} .pc-section .pc-journey-icon{display:flex;align-items:center;justify-content:center;width:39px;height:39px;border:1px solid var(--pc-line);background:#fff;border-radius:12px;flex:none} .pc-section .pc-journey-icon .pc-icon{width:19px;height:19px} .pc-section .pc-journey li>div{flex:1;min-width:0} .pc-section .pc-journey strong{display:block;font-size:12px;font-weight:500} .pc-section .pc-journey li>div>span{display:block;font-size:10px;color:var(--pc-text);margin-top:3px} .pc-section .pc-journey li>.pc-icon{width:16px;height:16px;opacity:.65} .pc-section .pc-count{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 25px;margin:0 27px 23px;background:#fff;border:1px solid var(--pc-line);border-radius:13px;box-shadow:0 4px 12px rgba(20,34,52,.025)} .pc-section .pc-count-label{display:block;font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--pc-accent);margin-bottom:5px} .pc-section .pc-count strong{display:block;font-size:14px;line-height:1.5;font-weight:500} .pc-section .pc-one{color:var(--pc-accent);font-size:51px;line-height:1;font-weight:500;letter-spacing:-.06em} .pc-section .pc-scale{display:flex;align-items:flex-start;gap:15px;padding:22px 27px;border-top:1px solid var(--pc-line);background:var(--pc-tint)} .pc-section .pc-scale>.pc-icon{margin-top:2px} .pc-section .pc-scale h3{font-size:12px;font-weight:500;line-height:1.6} .pc-section .pc-scale p{font-size:10px;color:var(--pc-text);margin-top:5px} .pc-section .pc-inclusions{display:grid;grid-template-columns:1.25fr 1fr;gap:48px;margin-top:58px;padding:35px 0;border-block:1px solid var(--pc-line)} .pc-section .pc-inclusions article+article{border-left:1px solid var(--pc-line);padding-left:48px} .pc-section .pc-feature-heading{display:flex;align-items:center;gap:12px;margin-bottom:13px} .pc-section .pc-feature-heading h3{font-size:19px;line-height:1.35;letter-spacing:-.025em;font-weight:500} .pc-section .pc-inclusions p{font-size:12px;color:var(--pc-text)} .pc-section .pc-included ul{display:flex;list-style:none;flex-wrap:wrap;gap:10px 20px;padding:17px 0 0} .pc-section .pc-included li{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--pc-accent)} .pc-section .pc-included li>.pc-icon{width:13px;height:13px} .pc-section .pc-team-seal{display:flex;align-items:center;gap:8px;margin-top:17px;font-size:10px;color:var(--pc-accent)} .pc-section .pc-team-seal>.pc-icon{width:14px;height:14px} .pc-section .pc-value{display:grid;grid-template-columns:130px 1fr 1fr;gap:36px;align-items:center;padding:32px 35px;border:1px solid var(--pc-line);border-radius:19px;background:linear-gradient(120deg,var(--pc-soft),#fff);margin-top:32px} .pc-section .pc-economy>strong{display:block;font-size:55px;line-height:1;letter-spacing:-.06em;font-weight:500;color:var(--pc-accent)} .pc-section .pc-economy>strong>span{font-size:30px;letter-spacing:-.04em} .pc-section .pc-economy>span{display:block;font-size:10px;color:var(--pc-accent);margin-top:9px} .pc-section .pc-value h3{font-size:16px;font-weight:500;letter-spacing:-.025em;line-height:1.5;margin-bottom:7px} .pc-section .pc-value p{font-size:11px;color:var(--pc-text)} .pc-section .pc-value .pc-value-context{border-left:1px solid var(--pc-line);padding-left:30px} @media(max-width:1000px){.pc-section .pc-intro{gap:38px}.pc-section .pc-inclusions{gap:30px}.pc-section .pc-inclusions article+article{padding-left:30px}.pc-section .pc-value{grid-template-columns:100px 1fr;gap:24px}.pc-section .pc-value .pc-value-context{grid-column:2;border-left:0;padding:0}.pc-section .pc-economy{grid-row:span 2}} @media(max-width:760px){.pc-section{padding:70px 0}.pc-section .pc-wrap{width:calc(100% - 40px)}.pc-section .pc-intro{grid-template-columns:1fr;gap:35px}.pc-section h2{font-size:clamp(31px,7vw,44px)}.pc-section .pc-copy{max-width:650px}.pc-section .pc-lead{max-width:none;font-size:14px}.pc-section .pc-billing{font-size:12px}.pc-section .pc-ledger{max-width:620px;width:100%}.pc-section .pc-inclusions{gap:25px;margin-top:35px}.pc-section .pc-inclusions article+article{padding-left:25px}.pc-section .pc-feature-heading{align-items:flex-start}.pc-section .pc-feature-heading h3{font-size:17px}.pc-section .pc-inclusions p{font-size:12px}.pc-section .pc-value{padding:25px;gap:20px}.pc-section .pc-value p{font-size:11px}} @media(max-width:520px){.pc-section .pc-inclusions{grid-template-columns:1fr;padding:27px 0}.pc-section .pc-inclusions article+article{padding:25px 0 0;border-left:0;border-top:1px solid var(--pc-line)}.pc-section .pc-value{grid-template-columns:75px 1fr;gap:18px;padding:24px 20px}.pc-section .pc-economy>strong{font-size:44px}.pc-section .pc-economy>strong>span{font-size:23px}.pc-section .pc-economy>span{font-size:9px}.pc-section .pc-value h3{font-size:15px}.pc-section .pc-ledger-head{padding:20px}.pc-section .pc-journey{padding-inline:20px}.pc-section .pc-count{margin-inline:20px;padding:19px}.pc-section .pc-scale{padding:20px}.pc-section .pc-ledger-head>span:first-child{font-size:11px}.pc-section .pc-pill{font-size:9px;padding:5px 8px}} /* Product pages · shared alignment with the home (Agentes, Atendimento, Ativação and the next products). The product exports follow design-system revision 3 (flat surfaces, no gradients or glows, lowercase kickers, underline tabs), which moves them away from the home. The home is the reference for the whole site; this layer brings each part back to it. #profissio-experiencia is replaced by the build with the page root (#profissio-agentes, #profissio-atendimento...), which gives these rules precedence over the page CSS without !important. Light sections are marked .ag-light; everything else is dark. Colour: the structure is the home's; the tones are the product's (standardisation of 24/09: each page works shades of its palette colour). The blue primary CTA stays the site's everywhere (header, hero, closing): blue means "act", the product tone means "where you are". Each product sets these variables in its own align.css; the defaults below are the home's own values. --pd-dark, --pd-glow, --pd-glow-2 dark base and its corner light --pd-card-a/-b/-line cards on a dark section --pd-deep-a/-b/-line the one deep accent card on a light section --pd-wash, --pd-light-line, --pd-ink light sections: background, card and tab borders, title ink --pd-tone, --pd-tone-light the muted last sentence of titles, on dark / on light --pd-hero-tone the same in the hero title --pd-kicker, --pd-dot (+ -light) kicker text and dot, on dark / on light --pd-accent, --pd-accent-bg links, active tabs, icons on light --pd-num, --pd-num-dark gradient of big numbers, on light / on dark --pd-active, --pd-active-line, --pd-active-glow active step and current item --pd-rail, --pd-rail-light line joining the steps, on dark / on light --pd-ghost-bg/-line/-text (+ -hover) the hero's secondary button (the home's explore button) */ #profissio-experiencia { --pd-dark: #080c15; --pd-glow: #172e544d; --pd-glow-2: #231d3d40; --pd-card-a: #16243980; --pd-card-b: #0b1422; --pd-card-line: #283d5b; --pd-deep-a: #1d2d49; --pd-deep-b: #142138; --pd-deep-line: #344c73; --pd-wash: linear-gradient(145deg, #f7f8fc 5%, #f1f4fb 46%, #f4f0f9 100%); --pd-light-line: #d8dfed; --pd-ink: #182235; --pd-tone: #8f97c7; --pd-tone-light: #6c698e; --pd-hero-tone: #8fb4ff; --pd-kicker: #92c5f6; --pd-dot: #7f9cff; --pd-kicker-light: #626f89; --pd-dot-light: #5b72de; --pd-accent: #345bc5; --pd-accent-bg: #eef2fb; --pd-num: linear-gradient(145deg, #24498f 15%, #576ec4 67%, #8276b0); --pd-num-dark: linear-gradient(145deg, #7ea2ff 10%, #9c8ee0); --pd-active: linear-gradient(135deg, #477ce4, #8268cc); --pd-active-line: #96ace9; --pd-active-glow: #8079d051; --pd-rail: linear-gradient(90deg, #2c3446, #3a3f63, #2c3446); --pd-rail-light: linear-gradient(90deg, #dfe5f1, #d8d4ee, #dfe5f1); --pd-ghost-bg: #111d30; --pd-ghost-line: #30496d; --pd-ghost-text: #d2e4ff; --pd-ghost-bg-hover: #182b47; --pd-ghost-line-hover: #7399cd; } /* ---------- Surfaces ---------- */ /* Light sections: the home's light wash (.ph-problems / .ph-faq), tinted with the product. */ #profissio-experiencia .ag-light { background: var(--pd-wash); color: var(--pd-ink); } /* Dark sections: the product's dark base with the home's soft corner light (.preview-why, footer). */ #profissio-experiencia .ag-section:not(.ag-light) { background: radial-gradient(ellipse at 95% 0, var(--pd-glow), transparent 58%), radial-gradient(ellipse at 0 100%, var(--pd-glow-2), transparent 55%), var(--pd-dark); } /* ---------- Type ---------- */ /* Revision 3 set letter-spacing -0.035em on :root and body; running text goes back to the home's normal tracking. */ #profissio-experiencia { letter-spacing: normal; } /* Section titles: the home scale and tracking, two tones like the home headlines (the last sentence muted). */ #profissio-experiencia .ag-section h2 { font-size: clamp(34px, 3.9vw, 52px); line-height: 1.1; letter-spacing: -.048em; color: #eff6ff; } #profissio-experiencia .ag-light h2 { color: var(--pd-ink); } #profissio-experiencia .ag-tone { color: var(--pd-tone); } #profissio-experiencia .ag-light .ag-tone { color: var(--pd-tone-light); } #profissio-experiencia .ag-section-heading > p:not(.ag-kicker), #profissio-experiencia .ag-actions-heading p:not(.ag-kicker), #profissio-experiencia .ag-heading-split > p { color: #9caec8; font-size: 15px; line-height: 1.75; } #profissio-experiencia .ag-light .ag-section-heading > p:not(.ag-kicker), #profissio-experiencia .ag-light .ag-actions-heading p:not(.ag-kicker), #profissio-experiencia .ag-light .ag-heading-split > p { color: #485972; } /* Kickers: the home's .ph-section-kicker (uppercase, wide tracking, 6px dot with a halo). */ #profissio-experiencia .ag-kicker { gap: 10px; margin-bottom: 20px; font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: var(--pd-kicker); } #profissio-experiencia .ag-kicker i { width: 6px; height: 6px; background: var(--pd-dot); box-shadow: 0 0 0 4px color-mix(in srgb, var(--pd-dot) 8%, transparent); } #profissio-experiencia .ag-light .ag-kicker { color: var(--pd-kicker-light); } #profissio-experiencia .ag-light .ag-kicker i { background: var(--pd-dot-light); box-shadow: 0 0 0 4px color-mix(in srgb, var(--pd-dot-light) 6%, transparent); } /* Small labels the exports left in a pale grey (#aab3c4, readable only on dark). */ #profissio-experiencia .ag-light .ag-application-copy h4, #profissio-experiencia .ag-light .ag-map-destination { color: var(--pd-kicker-light); } /* Big numbers: the home's gradient figures (.ph-number dt). */ #profissio-experiencia .ag-case-metric > strong, #profissio-experiencia .ag-benefit strong, #profissio-experiencia .ag-application-proof strong { background: var(--pd-num); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: var(--pd-accent); letter-spacing: -.05em; } /* ---------- Hero ---------- */ #profissio-experiencia .ag-hero h1 { letter-spacing: -.045em; line-height: 1.08; } #profissio-experiencia .ag-hero h1 > span { color: var(--pd-hero-tone); -webkit-text-fill-color: currentColor; } #profissio-experiencia .ag-hero-lead { color: #9caec8; } #profissio-experiencia .ag-breadcrumb { font-size: 12px; color: #8e9bb0; } #profissio-experiencia .ag-breadcrumb strong { color: #c6d2e4; } #profissio-experiencia .ag-hero-demo { border-color: #ffffff1f; border-radius: 22px; box-shadow: 0 40px 90px -40px #000000d9, 0 0 0 1px #ffffff0a; } /* Secondary action: the home's explore button (.ps-explore-cta). */ #profissio-experiencia .ag-hero-actions .ag-text-link { min-height: 44px; padding: 0 22px; border: 1px solid var(--pd-ghost-line); border-radius: 14px; background: var(--pd-ghost-bg); color: var(--pd-ghost-text); font-size: 13px; font-weight: 500; } #profissio-experiencia .ag-hero-actions .ag-text-link:hover { background: var(--pd-ghost-bg-hover); border-color: var(--pd-ghost-line-hover); color: #fff; } #profissio-experiencia .ag-hero-actions > p { color: #8e9bb0; } /* ---------- Tabs (first section): the home's problem tabs (.ph-problem-nav), joined to a light surface ---------- */ #profissio-experiencia .ag-application-tabs { gap: 0; margin-bottom: 0; border-bottom: 0; align-items: end; position: relative; z-index: 2; } #profissio-experiencia .ag-application-tabs button { min-height: 64px; margin-top: 8px; padding: 12px 18px; gap: 10px; background: linear-gradient(180deg, #edf0f7, #e5eaf4); border: 1px solid var(--pd-light-line); border-bottom: 0; border-radius: 13px 13px 0 0; color: #5b6883; font-size: 13px; } #profissio-experiencia .ag-application-tabs button + button { margin-left: -4px; } #profissio-experiencia .ag-application-tabs button[aria-selected=true] { z-index: 3; min-height: 72px; margin-top: 0; background: #fbfcff; border-color: var(--pd-light-line); color: var(--pd-accent); box-shadow: 0 -7px 20px #597ab00a; } /* The selected tab covers the panel's top border (1px lower), so it opens into the panel like the home's tabs. */ #profissio-experiencia .ag-application-tabs button[aria-selected=true] { margin-bottom: -1px; padding-bottom: 13px; } #profissio-experiencia .ag-application-tabs button:hover { color: #2b3b56; } #profissio-experiencia .ag-application-tabs button > span { color: #8a96aa; } #profissio-experiencia .ag-application-panel { padding: 44px 44px 40px; background: #fbfcff; border: 1px solid var(--pd-light-line); border-radius: 0 0 22px 22px; box-shadow: 0 17px 40px #5268910a; } #profissio-experiencia .ag-applications .ag-example-note { margin-top: 18px; } /* ---------- Cards ---------- */ /* Light cards: the home's surfaces (#fbfcff, soft shadow), with the product's border. */ #profissio-experiencia .ag-case, #profissio-experiencia .ag-application-demo, #profissio-experiencia .ag-handoff-demo { background: #fbfcff; border-color: var(--pd-light-line); border-radius: 22px; box-shadow: 0 17px 40px #5268910f; } #profissio-experiencia .ag-case { transition: transform .35s cubic-bezier(.2, .7, .2, 1), box-shadow .35s; } #profissio-experiencia .ag-case:hover { transform: translateY(-3px); box-shadow: 0 26px 50px -24px #24314859; } /* Feature cards on a dark section: the home's reason cards (.preview-reasons article), in the product's dark. */ #profissio-experiencia .ag-feature { border-radius: 22px; } #profissio-experiencia .ag-section:not(.ag-light) .ag-feature { background: linear-gradient(150deg, var(--pd-card-a), var(--pd-card-b)); border-color: var(--pd-card-line); } #profissio-experiencia .ag-section:not(.ag-light) .ag-feature:hover { border-color: #3a4c6d; } #profissio-experiencia .ag-section:not(.ag-light) .ag-feature h3 { color: #e5efff; } #profissio-experiencia .ag-feature > p { font-size: 13px; } #profissio-experiencia .ag-section:not(.ag-light) .ag-feature > p { color: #9caec8; } /* On a light section: the home's light cards; one card per page takes the product's deep tone (set in its align.css with --pd-deep-*, as .ag-deep-card rules). */ #profissio-experiencia .ag-light .ag-feature { background: linear-gradient(145deg, #fff, #fbfcff); border-color: var(--pd-light-line); box-shadow: 0 17px 40px #5268910a; } #profissio-experiencia .ag-light .ag-feature:hover { border-color: var(--pd-active-line); } #profissio-experiencia .ag-light .ag-feature h3 { color: var(--pd-ink); } #profissio-experiencia .ag-light .ag-feature > p, #profissio-experiencia .ag-light .ag-feature details > p { color: #485972; } #profissio-experiencia .ag-light .ag-feature details { border-color: var(--pd-light-line); } #profissio-experiencia .ag-section:not(.ag-light) .ag-ecosystem-grid, #profissio-experiencia .ag-section:not(.ag-light) .ag-ecosystem-grid > li { border-color: #ffffff17; } #profissio-experiencia .ag-ecosystem-grid > li.is-current::before { background: var(--pd-active); } #profissio-experiencia .ag-section:not(.ag-light) .ag-ecosystem-grid p, #profissio-experiencia .ag-section:not(.ag-light) .ag-ecosystem-grid .ag-micro { color: #9caec8; } #profissio-experiencia .ag-action-icon, #profissio-experiencia .ag-context-icon { background: var(--pd-accent-bg); border-color: var(--pd-light-line); color: var(--pd-accent); } /* Links: the home's "Conheça o case" (.ph-cases-link). */ #profissio-experiencia .ag-light .ag-text-link { color: #2b3b56; font-weight: 500; } #profissio-experiencia .ag-light .ag-text-link:hover { color: var(--pd-accent); } #profissio-experiencia .ag-case > .ag-text-link { border-top-color: #e3e8f0; } /* ---------- Steps (implantação, preparação): the home's method stepper (.ph-method-steps) ---------- */ #profissio-experiencia .ag-method-tabs { position: relative; gap: 0; border-bottom: 0; } #profissio-experiencia .ag-method-tabs::before { content: ""; position: absolute; left: 10%; right: 10%; top: 18px; height: 1px; background: var(--pd-rail); } #profissio-experiencia .ag-method-tabs button { z-index: 1; flex-direction: column; justify-content: flex-start; gap: 12px; min-height: 0; padding: 0 4px 8px; border-bottom: 0; color: #8e9bb0; font-size: 13px; text-align: center; } #profissio-experiencia .ag-method-tabs button > span { display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #333c50; border-radius: 50%; background: #141822; color: #9aa6bd; font-size: 11px; font-variant-numeric: tabular-nums; transition: background .3s, border-color .3s, box-shadow .3s, color .3s; } #profissio-experiencia .ag-method-tabs button[aria-selected=true] { color: #e8efff; } #profissio-experiencia .ag-method-tabs button[aria-selected=true] > span { border-color: var(--pd-active-line); background: var(--pd-active); color: #fff; box-shadow: 0 0 0 5px var(--pd-dark), 0 0 24px var(--pd-active-glow); } #profissio-experiencia .ag-method-tabs button:hover > span { border-color: #56668a; } #profissio-experiencia .ag-method-number { background: var(--pd-num-dark); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } /* On a light section: the home's own (light) stepper colours. */ #profissio-experiencia .ag-light .ag-method-tabs::before { background: var(--pd-rail-light); } #profissio-experiencia .ag-light .ag-method-tabs button { color: #858ca0; } #profissio-experiencia .ag-light .ag-method-tabs button > span { border-color: var(--pd-light-line); background: #fbfcff; color: #858ca0; } #profissio-experiencia .ag-light .ag-method-tabs button[aria-selected=true] { color: var(--pd-ink); } #profissio-experiencia .ag-light .ag-method-tabs button[aria-selected=true] > span { border-color: var(--pd-active-line); background: var(--pd-active); color: #fff; box-shadow: 0 0 0 5px #f4f5fb, 0 0 24px var(--pd-active-glow); } #profissio-experiencia .ag-light .ag-method-tabs button:hover > span { border-color: var(--pd-active-line); } #profissio-experiencia .ag-light .ag-method-number { background: var(--pd-num); -webkit-background-clip: text; background-clip: text; } /* ---------- FAQ: the home FAQ (.ph-faq) ---------- */ #profissio-experiencia .ag-faq-grid { grid-template-columns: minmax(0, 1fr); gap: 34px; } #profissio-experiencia .ag-faq-grid > header { position: static; } #profissio-experiencia .ag-faq-grid h2 { font-size: 34px; letter-spacing: -1.5px; line-height: 1.16; } #profissio-experiencia .ag-faq-item, #profissio-experiencia .ag-faq-item:first-child { border-color: var(--pd-light-line); } #profissio-experiencia .ag-faq-item summary { padding: 22px 0; font-size: 15px; color: var(--pd-ink); letter-spacing: -.2px; } #profissio-experiencia .ag-faq-item summary:hover, #profissio-experiencia .ag-faq-item[open] summary { color: var(--pd-accent); } #profissio-experiencia .ag-faq-item summary svg { color: var(--pd-accent); } #profissio-experiencia .ag-faq-item p { font-size: 14px; line-height: 1.8; color: #485972; max-width: 860px; } /* ---------- Closing: the home's closing block (.preview-why + .ph-why-cta), as on the cases gallery ---------- */ #profissio-experiencia .ag-closing-home { background: radial-gradient(ellipse at 95% 0, var(--pd-glow), transparent 60%), var(--pd-dark); border-top-color: #ffffff12; } #profissio-experiencia .ag-closing-home .ph-why-cta { border-top: 0; margin-top: 0; padding-top: 0; } #profissio-experiencia .ag-closing-title { max-width: 700px; margin: 0; color: #eff6ff; font-size: clamp(25px, 3vw, 36px); line-height: 1.25; letter-spacing: -1.15px; font-weight: 500; text-wrap: balance; } #profissio-experiencia .ag-closing-title .ag-tone { color: var(--pd-tone); } /* ---------- Motion: the home's entrance (translate + soft blur), same easing ---------- */ #profissio-experiencia [data-reveal-ready=true] { opacity: 0; transform: translate3d(0, 20px, 0); filter: blur(3px); transition: opacity .7s var(--delay, 0ms) ease, transform .9s var(--delay, 0ms) cubic-bezier(.2, .75, .2, 1), filter .7s var(--delay, 0ms) ease; } #profissio-experiencia [data-revealed=true] { opacity: 1; transform: none; filter: none; } @media (prefers-reduced-motion: reduce) { #profissio-experiencia [data-reveal-ready=true] { opacity: 1; transform: none; filter: none; transition: none; } #profissio-experiencia .ag-case:hover { transform: none; } } /* ---------- Chip rows: one line (site rule); scroll sideways when they do not fit ---------- */ #profissio-experiencia .ag-chips, #profissio-experiencia .ag-channels ul, #profissio-experiencia .ag-handoff-context ul { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } #profissio-experiencia .ag-chips::-webkit-scrollbar, #profissio-experiencia .ag-channels ul::-webkit-scrollbar, #profissio-experiencia .ag-handoff-context ul::-webkit-scrollbar { display: none; } #profissio-experiencia .ag-chips > li, #profissio-experiencia .ag-channels li, #profissio-experiencia .ag-handoff-context li { flex: none; white-space: nowrap; } /* The one-line chip row must not widen the handoff grid: on phones it pushed the message card past the edge. */ #profissio-experiencia .ag-handoff-body > * { min-width: 0; } /* Card header of the handoff demo: the status pill stays on the title's line; the label may wrap instead. */ #profissio-experiencia .ag-handoff-top { flex-wrap: nowrap; } #profissio-experiencia .ag-handoff-top > div { min-width: 0; flex: 1; } #profissio-experiencia .ag-handoff-top .ag-live-state { flex: none; white-space: nowrap; } /* Decorative light and orbits may extend past the edge; the page never scrolls sideways. */ #profissio-experiencia main { overflow-x: clip; } /* ---------- Phones (the site's 780px breakpoint) ---------- */ @media (max-width: 779px) { #profissio-experiencia .ag-section h2 { font-size: 32px; letter-spacing: -1.4px; } #profissio-experiencia .ag-faq-grid h2 { font-size: 30px; } #profissio-experiencia .ag-kicker, #profissio-experiencia .ph-clients h2 { font-size: 11px; letter-spacing: 1.6px; } /* Tabs stay one row (chips rule): they scroll sideways, bleeding to the screen edge. */ #profissio-experiencia .ag-application-tabs { display: flex; overflow-x: auto; scrollbar-width: none; margin-inline: calc(50% - 50vw); padding-inline: calc(50vw - 50%); } #profissio-experiencia .ag-application-tabs::-webkit-scrollbar { display: none; } #profissio-experiencia .ag-application-tabs button { flex: none; min-height: 56px; padding: 10px 16px; font-size: 13px; white-space: nowrap; } #profissio-experiencia .ag-application-tabs button[aria-selected=true] { min-height: 62px; } /* The tab row scrolls sideways here, which clips the 1px overlap: the panel drops its top border and the tabs that are not selected draw it, so the selected one still opens into the panel. */ #profissio-experiencia .ag-application-tabs button[aria-selected=true] { margin-bottom: 0; } #profissio-experiencia .ag-application-tabs button[aria-selected=false] { border-bottom: 1px solid var(--pd-light-line); } #profissio-experiencia .ag-application-panel { border-top: 0; } #profissio-experiencia .ag-application-panel { padding: 26px 20px 24px; border-radius: 0 0 18px 18px; } #profissio-experiencia .ag-method-tabs { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); overflow: visible; } #profissio-experiencia .ag-method-tabs button { min-width: 0; font-size: 11px; } #profissio-experiencia .ag-method-tabs button > span { width: 32px; height: 32px; } #profissio-experiencia .ag-method-tabs::before { top: 16px; } #profissio-experiencia .ag-faq-item summary { font-size: 15px; } #profissio-experiencia .ag-closing-title { font-size: 27px; } #profissio-experiencia .ag-closing-home .ph-why-cta-kicker { font-size: 11px; letter-spacing: 1.6px; } #profissio-experiencia .ag-closing-home .ph-why-cta-action > span { font-size: 11.5px; } } /* Case cards: the EITA mark is the site's official one (icon over "mentora virtual"), with no typed wordmark next to it, in greys like the other logos (brightness(0) would turn the icon into a solid square). Being almost square, it stands taller than the wide wordmarks to carry the same weight, as on the cases gallery (40 vs 24px there). */ #profissio-experiencia .ag-eita-mark { display: block; flex: none; width: auto; height: 56px; aspect-ratio: 851 / 861; filter: grayscale(1) brightness(.55) contrast(1.6); opacity: .85; } @media (max-width: 779px) { #profissio-experiencia .ag-eita-mark { height: 48px; } } /* Commercial model section ("Modelo comercial", package of 25/09) aligned with the site. The export gives it four fixed themes (neutral, blue, rose, cyan: Vendas and Experiência came out neutral grey); here it takes the tones of the page it sits on, through the --pd-* variables of src/products/align.css (the home sets its own values on .ph-commercial-home). The doubled class outranks the export's theme classes without !important. Type follows the home scale (the export went down to 9-10px), the "1" and the "50%" are the home's gradient figures, the included items stay on one line (chips rule) and the CTA is the discreet one of each page (src/cta.css). */ .ph-commercial-home { --pd-wash: linear-gradient(145deg, #f7f8fc 5%, #f1f4fb 46%, #f4f0f9 100%); --pd-light-line: #d8dfed; --pd-ink: #182235; --pd-tone-light: #6c698e; --pd-kicker-light: #626f89; --pd-dot-light: #5b72de; --pd-accent: #345bc5; --pd-accent-bg: #eef2fb; --pd-num: linear-gradient(145deg, #24498f 15%, #576ec4 67%, #8276b0); } .pc-section.pc-section { --pc-accent: var(--pd-accent); --pc-ink: var(--pd-ink); --pc-line: var(--pd-light-line); --pc-text: color-mix(in srgb, var(--pd-ink) 76%, #fff); --pc-soft: color-mix(in srgb, var(--pd-accent-bg) 45%, #fff); --pc-tint: var(--pd-accent-bg); --pc-muted: color-mix(in srgb, var(--pd-accent) 35%, #fff); background: var(--pd-wash); color: var(--pd-ink); letter-spacing: normal; border-top: 1px solid var(--pd-light-line); } /* Kicker and title: the home's .ph-section-kicker and two-tone section titles. */ .pc-section.pc-section .pc-kicker { gap: 10px; margin-bottom: 20px; font-size: 10px; font-weight: 500; letter-spacing: 2px; color: var(--pd-kicker-light); } .pc-section.pc-section .pc-kicker > span { width: 6px; height: 6px; background: var(--pd-dot-light); box-shadow: 0 0 0 4px color-mix(in srgb, var(--pd-dot-light) 6%, transparent); } /* The title sits in half the width: a notch below the full-width titles, and the muted sentence balances on its own lines (it left a single word alone on the last one). */ .pc-section.pc-section h2 { font-size: clamp(32px, 3.2vw, 42px); line-height: 1.12; letter-spacing: -.045em; font-weight: 500; color: var(--pd-ink); } .pc-section.pc-section h2 > span { display: block; color: var(--pd-tone-light); text-wrap: balance; } .pc-section.pc-section .pc-lead { font-size: 15px; line-height: 1.75; } .pc-section.pc-section .pc-billing { font-size: 13px; line-height: 1.7; } /* Counting card */ .pc-section.pc-section .pc-ledger-head { font-size: 13px; } .pc-section.pc-section .pc-pill { font-size: 11px; } .pc-section.pc-section .pc-journey strong { font-size: 14px; } .pc-section.pc-section .pc-journey li > div > span { font-size: 12px; line-height: 1.5; } .pc-section.pc-section .pc-count-label { font-size: 10px; letter-spacing: .16em; } .pc-section.pc-section .pc-count strong { font-size: 15px; } .pc-section.pc-section .pc-scale h3 { font-size: 14px; } .pc-section.pc-section .pc-scale p { font-size: 12px; line-height: 1.6; } .pc-section.pc-section .pc-one, .pc-section.pc-section .pc-economy > strong { background: var(--pd-num); -webkit-background-clip: text; background-clip: text; color: transparent; } /* Included costs and team */ .pc-section.pc-section .pc-feature-heading h3 { font-size: 20px; } .pc-section.pc-section .pc-inclusions p { font-size: 14px; line-height: 1.7; } .pc-section.pc-section .pc-inclusions > article { min-width: 0; } .pc-section.pc-section .pc-included ul { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; } .pc-section.pc-section .pc-included ul::-webkit-scrollbar { display: none; } .pc-section.pc-section .pc-included li { flex: none; white-space: nowrap; font-size: 12px; } .pc-section.pc-section .pc-team-seal { font-size: 12px; } /* Savings */ .pc-section.pc-section .pc-economy > span { font-size: 11px; } .pc-section.pc-section .pc-value h3 { font-size: 18px; } .pc-section.pc-section .pc-value p { font-size: 13px; line-height: 1.7; } /* Phones (the site's 780px breakpoint): the home's phone title and kicker, 11px reading / 10px labels floor. */ @media (max-width: 779px) { .pc-section.pc-section h2 { font-size: 32px; letter-spacing: -1.4px; } /* This kicker is longer than the others (39 characters): tighter tracking keeps it on one line at 390px. */ .pc-section.pc-section .pc-kicker { font-size: 10px; letter-spacing: 1.1px; white-space: nowrap; } .pc-section.pc-section .pc-pill { font-size: 10px; } .pc-section.pc-section .pc-journey li > div > span, .pc-section.pc-section .pc-scale p, .pc-section.pc-section .pc-included li, .pc-section.pc-section .pc-team-seal { font-size: 11px; } .pc-section.pc-section .pc-economy > span { font-size: 11px; } .pc-section.pc-section .pc-inclusions p { font-size: 13px; } .pc-section.pc-section .pc-value p { font-size: 12px; } /* The included items scroll sideways to the screen edge when they do not fit. */ .pc-section.pc-section .pc-included ul { margin-inline: -20px; padding-inline: 20px; } } /* Solução Experiência · tones and parts only this page has. Shared layer: src/products/align.css. Experiência: the export's institutional graphite (as on the Agentes page), silver-blue accents (#b9c4d6), product colours kept in the ecosystem. This page comes from its own template (ex- classes); its render.js adds the site classes. */ #profissio-experiencia { --pd-dark: #101218; --pd-glow: #2a303d66; --pd-glow-2: #1c202a59; --pd-card-a: #1b2130cc; --pd-card-b: #111419; --pd-card-line: #283246; --pd-deep-a: #212631; --pd-deep-b: #161a22; --pd-deep-line: #384151; --pd-wash: linear-gradient(145deg, #f7f8fa 5%, #f2f4f7 50%, #f5f6f8 100%); --pd-light-line: #dce1e9; --pd-ink: #15181f; --pd-tone: #9aa4b6; --pd-tone-light: #6b7488; --pd-hero-tone: #b9c4d6; --pd-kicker: #aab3c4; --pd-dot: #c4ccd9; --pd-kicker-light: #536078; --pd-dot-light: #63728c; --pd-accent: #3d4a63; --pd-accent-bg: #eef0f4; --pd-num: linear-gradient(145deg, #101218 10%, #3a4356 60%, #6b778e); --pd-num-dark: linear-gradient(145deg, #e3e8f0 10%, #9aa4b6); --pd-active: linear-gradient(135deg, #3c4659, #6b778e); --pd-active-line: #9aa4b6; --pd-active-glow: #6b778e40; --pd-rail: linear-gradient(90deg, #2a2f39, #3b414d, #2a2f39); --pd-rail-light: linear-gradient(90deg, #dde2e9, #cfd5de, #dde2e9); --pd-ghost-bg: #181b22; --pd-ghost-line: #3a404c; --pd-ghost-text: #dfe4ec; --pd-ghost-bg-hover: #222630; --pd-ghost-line-hover: #8a93a4; } #profissio-experiencia .ex-hero h1 { letter-spacing: -.045em; line-height: 1.08; } #profissio-experiencia .ex-hero h1 > span { color: var(--pd-hero-tone); } #profissio-experiencia .ex-heading { margin-bottom: 44px; } #profissio-experiencia .ex-kicker::before { width: 6px; height: 6px; background: var(--pd-dot); box-shadow: 0 0 0 4px color-mix(in srgb, var(--pd-dot) 8%, transparent); } #profissio-experiencia .ag-light .ex-kicker::before { background: var(--pd-dot-light); } /* Ecosystem: the link to each product from the pages registry, at the foot of its card. */ #profissio-experiencia .ex-ecosystem > .ex-wrap > ol > li { display: flex; flex-direction: column; } #profissio-experiencia .ex-ecosystem > .ex-wrap > ol > li .ph-cue { margin-top: auto; padding-top: 16px; } /* Case films: caption in the site's pattern (dot + "X, em 2 minutos."). */ #profissio-experiencia .ex-case-film figcaption { display: flex; align-items: center; gap: 7px; font-size: 10px; } #profissio-experiencia .ex-case-film figcaption > span { width: 4px; height: 4px; border-radius: 50%; background: var(--pd-dot-light); flex: none; } #profissio-experiencia .ex-case-copy .ph-cue { margin-top: 18px; } /* FAQ: the home FAQ, one column. */ #profissio-experiencia .ex-faq details:first-child { border-top: 0; } #profissio-experiencia .ex-faq details > p { font-size: 14px; line-height: 1.8; color: #485972; } /* Contrast: the portfolio note and project numbers were too faint on the light cards. */ #profissio-experiencia .ex-portfolio-note { color: #5d6678; } #profissio-experiencia .ex-project-number { color: #6b7488; } /* Phones: the demo screens and labels kept 8-10px. Site floor: 10px for labels, 11px for anything read (selectors measured at 390px). */ @media (max-width: 779px) { #profissio-experiencia .ex-pillars > li, #profissio-experiencia .ex-demo-time, #profissio-experiencia .ex-message > span, #profissio-experiencia .ex-memory > span, #profissio-experiencia .ex-label, #profissio-experiencia .ex-timeline span, #profissio-experiencia .ex-twin-note, #profissio-experiencia .ex-project-number { font-size: 10px; } #profissio-experiencia .ex-kicker, #profissio-experiencia .ex-window-bar > span, #profissio-experiencia .ex-conversation-head small, #profissio-experiencia .ex-memory > p, #profissio-experiencia .ex-demo-footer, #profissio-experiencia .ex-tabs > button, #profissio-experiencia .ex-result, #profissio-experiencia .ex-case-film > figcaption, #profissio-experiencia .ex-project-grid strong { font-size: 11px; } #profissio-experiencia .ex-kicker { letter-spacing: 1.6px; } } /* Hero secondary action: the home's explore button, as on the other product and solution pages. */ #profissio-experiencia .ex-hero .ex-text-link[href="#experiencias"] { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 22px; border: 1px solid var(--pd-ghost-line); border-radius: 14px; background: var(--pd-ghost-bg); color: var(--pd-ghost-text); font-size: 13px; font-weight: 500; text-decoration: none; } #profissio-experiencia .ex-hero .ex-text-link[href="#experiencias"]:hover { background: var(--pd-ghost-bg-hover); border-color: var(--pd-ghost-line-hover); color: #fff; }