:root { --craft-blue: #0d6efd; --craft-black: #050505; --craft-gray: #d9d9d9; }
html { scroll-behavior: smooth; overflow-x: clip; }
body { margin: 0; overflow-x: hidden; background: var(--craft-black); color: #fff; }

body .nav { position: absolute; inset: 0 0 auto; z-index: 50; height: 160px; background: linear-gradient(180deg, rgba(0,0,0,.78), transparent); }
body .nav-inner { position: relative; width: min(1320px, calc(100% - 80px)); height: 100%; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; background: transparent; }
body .nav .logo img { display: block; width: 123px; height: 64px; object-fit: contain; }
body .hamburger { position: relative; z-index: 2; width: 46px; height: 46px; padding: 10px 7px; border: 0; background: transparent; }
body .hamburger span { display: block; flex: 0 0 2px; width: 32px; height: 2px; margin: 0; background: #fff; }
body .nav-menu { background: rgba(0,0,0,.94); }

body #hero { position: relative; height: min(1080px, 100svh); min-height: 720px; isolation: isolate; overflow: hidden; }
body #hero .hero-video, body #hero .hero-video-mobile { position: absolute !important; inset: 0 !important; z-index: -2 !important; }
body #hero .hero-video > div, body #hero .hero-video iframe { width: 100%; height: 100%; padding: 0 !important; }
body #hero .hero-poster { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; background-position: center; background-size: cover; }
body #hero .hero-poster-desktop { background-image: url("../img/figma/hero-poster.webp"); }
body #hero .hero-poster-mobile { background-image: url("../img/figma/hero-poster-mobile.webp"); }
body #hero .hero-arrow { display: inline-block; color: #fff; font-size: 18px; line-height: 1; }
body #hero .hero-video iframe, body #hero .hero-video-mobile iframe { z-index: 1; }
body #hero .hero-video iframe { object-fit: cover; transform: scale(1.04); }
body #hero .hero-video-mobile { display: none; }
body #hero .overlay { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(0,0,0,.2), rgba(0,0,0,.25) 45%, rgba(0,0,0,.88)); }
body #hero .content { position: relative; width: min(1320px, calc(100% - 80px)); height: 100%; margin: 0 auto; }
body #hero h1 { position: absolute; left: 0; bottom: 70px; width: 760px; margin: 0; color: #fff; font-size: 36px; font-weight: 400; line-height: 1.56; letter-spacing: -.03em; }
body #hero .conheca { position: absolute; right: 0; bottom: 70px; }
body #hero .scroll-indicator { display: flex; align-items: center; gap: 18px; color: #fff; text-decoration: none; }
body #hero .seta { display: grid; width: 54px; height: 54px; place-items: center; border: 1px solid rgba(255,255,255,.75); border-radius: 50%; }
body #hero .conheca-text { font-size: 12px; font-weight: 700; letter-spacing: .14em; }

body .about { position: relative; min-height: 832px; display: flex; align-items: center; background: #0a0a0a url("../img/logo-bg-black.png") center / cover no-repeat; }
body .about::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 0 45%, rgba(0,0,0,.3)); pointer-events: none; }
body .about-div { position: relative; z-index: 1; width: 555px; margin-left: max(60px, calc((100vw - 1320px) / 2)); }
body .about-title { margin: 0 0 38px; font-size: 36px; font-weight: 400; line-height: 1.56; letter-spacing: -.035em; }
body .about-text { margin: 0 0 28px; font-size: 18px; font-weight: 400; line-height: 2.1; }

body .speakers { position: relative; height: 1591px; min-height: 0; overflow: hidden; background: #000; }
body .speakers-hero { height: 548px; background: linear-gradient(180deg, rgba(0,0,0,.06), #000 96%), url("../img/figma/speakers-bg.png") center 44% / cover no-repeat; }
body .speakers-wrap { position: relative; width: min(1320px, calc(100% - 80px)); margin: -213px auto 0; padding-bottom: 170px; }
body .speaker { display: grid; grid-template-columns: 302px 262px minmax(0, 550px); gap: 80px; align-items: start; min-height: 575px; }
body .speaker + .speaker { margin-top: 48px; }
body .speaker-photo { width: 302px; height: 440px; margin: 0; overflow: hidden; }
body .speaker-photo img { width: 100%; height: 100%; object-fit: cover; }
body .speaker:nth-child(2) .speaker-photo img { object-position: 57% center; }
body .speaker-name { margin: 40px 0 36px; font-size: 66px; font-weight: 300; line-height: 1; letter-spacing: -.065em; }
body .speaker-summary { margin: 0; font-size: 20px; line-height: 1.5; }
body .speaker-bio { padding-top: 44px; font-size: 18px; line-height: 2.1; }
body .speaker-bio p { margin: 0; }

body .diagram { height: 1060px; overflow: hidden; background: linear-gradient(180deg, #151515, #060606 78%); }
body .diagram .conteudo { position: relative; width: min(1320px, calc(100% - 80px)); height: 100%; margin: 0 auto; padding-top: 150px; }
body .eco-text { position: relative; z-index: 2; margin: 0; font-size: 36px; font-weight: 300; line-height: 1.3; text-align: center; }
body .ecosystem-map { position: relative; width: 880px; height: 880px; margin: -45px auto 0; }
body .ecosystem-ring { position: absolute; top: 50%; left: 50%; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; transform: translate(-50%, -50%); }
body .ecosystem-ring-outer { width: 100%; height: 100%; }
body .ecosystem-ring-third { width: 66%; height: 66%; }
body .ecosystem-ring-middle { width: 52%; height: 52%; }
body .ecosystem-ring-inner { width: 39%; height: 39%; }
body .ecosystem-logo { position: absolute; top: 50%; left: 50%; width: 292px; height: auto; transform: translate(-50%, -50%); }
body .ecosystem-label { position: absolute; z-index: 2; font-size: 18px; font-weight: 600; letter-spacing: .04em; transform: translate(-50%, -50%); }
body .ecosystem-black { top: 35%; left: 50%; }
body .ecosystem-blue { top: 43%; left: 69%; }
body .ecosystem-green { top: 41%; left: 31%; }
body .ecosystem-pink { top: 67%; left: 31%; }
body .ecosystem-business { top: 67%; left: 69%; }
body .ecosystem-implementation { top: 81%; left: 50%; }

body .craft-products { background: #050505; }
body .craft-products-hero { position: relative; height: 417px; overflow: hidden; }
body .craft-products-hero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.05), rgba(0,0,0,.35)); }
body .craft-products-hero img { width: 100%; height: 100%; object-fit: cover; object-position: center 50%; }

@media (min-width: 901px) {
  body .craft-products-hero::after { display: none; }
  body .craft-products-hero img { object-fit: fill; object-position: bottom; opacity: .65; }
}
body .craft-product { box-sizing: border-box; width: min(1320px, calc(100% - 80px)); margin: 0 auto; display: grid; align-items: center; column-gap: 95px; border: 0; }
body .craft-product-black { min-height: 1180px; grid-template-columns: 555px 1fr; padding: 100px 0 90px; }
body .craft-product-blue { min-height: 1160px; grid-template-columns: 1fr 620px; padding: 100px 0; }
body .craft-product-implementation { min-height: 1260px; grid-template-columns: 555px 1fr; padding: 120px 0; }
body .craft-product-business { min-height: 1280px; grid-template-columns: 1fr 554px; padding: 120px 0; }
body .craft-product-pallur { min-height: 900px; grid-template-columns: 654px 1fr; padding: 120px 0; }
body .craft-product-copy { max-width: 555px; }
body .craft-product-logo { display: block; width: 320px; max-height: 168px; margin: 0 0 48px; object-fit: contain; object-position: left center; }
body .craft-product-logo-pallur { width: 372px; height: auto; margin-bottom: 60px; }
body .craft-product h2 { margin: 0 0 34px; font-size: 36px; font-weight: 400; line-height: 1.56; letter-spacing: -.035em; }
body .craft-product p, body .craft-product li { font-size: 18px; line-height: 2.1; }
body .craft-product p { margin: 0 0 24px; }
body .craft-product ul { margin: -4px 0 24px; padding-left: 22px; }
body .craft-product-link { display: inline-flex; align-items: center; gap: 14px; margin-top: 12px; color: #1775ff; font-size: 20px; font-weight: 600; text-decoration: none; }
body .craft-product-gallery img { display: block; width: 100%; height: 100%; object-fit: cover; }
body .craft-product-gallery-black { display: grid; grid-template-rows: 541px 289px; gap: 20px; }
body .craft-product-small-photos { display: grid; grid-template-columns: 207px 1fr; gap: 20px; overflow: hidden; }
body .craft-product-small-photos img:first-child { object-position: 52% center; }
body .craft-product-gallery-blue { width: 620px; height: 785px; }
body .craft-product-gallery-blue img { object-position: 52% center; }
body .craft-product-gallery-implementation { width: 555px; height: 815px; display: flex; align-items: flex-end; justify-content: center; background: #101010; }
body .craft-product-gallery-implementation img { width: 263px; height: 296px; margin-bottom: 92px; object-fit: cover; }
body .craft-product-gallery-business { width: 554px; height: 808px; overflow: hidden; }
body .craft-product-gallery-business img { object-position: 58% center; }
body .craft-product-placeholder { width: 654px; height: 492px; background: #171717; }

body .pillars { box-sizing: border-box; height: 718px; min-height: 0; padding: 64px 0 76px; overflow: hidden; color: #050505; background: #d9d9d9; }
body .pillars-container { width: min(1320px, calc(100% - 80px)); margin: 0 auto; }
body .pillars-head { width: 100%; text-align: center; }
body .pillars-head h2 { margin: 0 0 16px; font-size: 36px; font-weight: 300; line-height: 1.35; }
body .pillars-sub { margin: 0 0 44px; font-size: 18px; line-height: 1.55; }
body .pillars-viewport { width: 100%; overflow: visible; }
body .pillars-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; transform: none !important; }
body .pillar-card { box-sizing: border-box; min-width: 0; height: 395px; padding: 38px 34px 30px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid #aaa; background: transparent; }
body .pillar-card h3 { margin: 0; color: #050505; font-size: 28px; font-weight: 400; line-height: 1.35; }
body .pillar-icon { color: #050505; font-size: 34px; }
body .pillars-nav { display: none; }
body .site-footer { height: 150px; padding: 0; color: #050505; background: #fff; }
body .footer-inner { width: min(1320px, calc(100% - 80px)); height: 100%; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; }

@media (max-width: 900px) {
  body .nav { height: 80px; }
  body .nav-inner, body #hero .content, body .speakers-wrap, body .diagram .conteudo, body .craft-product, body .pillars-container, body .footer-inner { width: calc(100% - 40px); }
  body .nav .logo img { width: 92px; height: auto; }
  body #hero { height: 640px; min-height: 0; }
  body #hero .hero-video { display: none; }
  body #hero .hero-video-mobile { display: block; }
  body #hero .hero-video-mobile > div, body #hero .hero-video-mobile iframe { width: 100%; height: 100%; padding: 0 !important; }
  body #hero h1 { bottom: 92px; width: 100%; font-size: 27px; line-height: 1.4; }
  body #hero .conheca { right: auto; bottom: 24px; left: 0; }
  body .about { min-height: 650px; padding: 90px 0; align-items: flex-start; }
  body .about-div { width: calc(100% - 40px); margin: 0 auto; }
  body .about-title, body .craft-product h2 { font-size: 28px; line-height: 1.45; }
  body .about-text, body .craft-product p, body .craft-product li { font-size: 17px; line-height: 1.75; }
  body .speakers { height: auto; min-height: 0; }
  body .speakers-hero { height: 260px; }
  body .speakers-wrap { margin: -70px auto 0; padding-bottom: 90px; }
  body .speaker { display: grid; grid-template-columns: 116px 1fr; gap: 24px; min-height: 0; }
  body .speaker + .speaker { margin-top: 90px; }
  body .speaker-photo { width: 116px; height: 170px; }
  body .speaker-main { align-self: center; }
  body .speaker-name { margin: 0 0 16px; font-size: 40px; }
  body .speaker-summary { font-size: 16px; }
  body .speaker-bio { grid-column: 1 / -1; padding-top: 18px; font-size: 16px; line-height: 1.8; }
  body .diagram { height: 765px; }
  body .diagram .conteudo { display: block; padding-top: 72px; }
  body .eco-text { font-size: 28px; }
  body .nav-menu {
    box-sizing: border-box;
    left: 0;
    right: 0;
    width: 100%;
  }
  body .ecosystem-map {
    width: 110vw;
    max-width: 600px;
    height: auto;
    aspect-ratio: 1;
    margin: 25px 0 0 50%;
    transform: translateX(-50%);
  }
  body .ecosystem-logo { width: 34%; }
  body .ecosystem-label { font-size: clamp(10px, 3vw, 16px); }
  body .craft-products-hero { height: 190px; }
  body .craft-product, body .craft-product-black, body .craft-product-blue, body .craft-product-implementation, body .craft-product-business, body .craft-product-pallur { min-height: 0; grid-template-columns: 1fr; gap: 56px; padding: 90px 0; }
  body .craft-product-gallery, body .craft-product-gallery-blue, body .craft-product-gallery-implementation, body .craft-product-gallery-business, body .craft-product-placeholder { width: 100%; }
  body .craft-product-gallery-black { grid-template-rows: 78vw 43vw; order: 2; }
  body .craft-product-small-photos { grid-template-columns: 38% 1fr; }
  body .craft-product-gallery-blue, body .craft-product-gallery-business { height: 112vw; }
  body .craft-product-gallery-implementation { height: 100vw; order: 2; }
  body .craft-product-gallery-implementation img { width: 48%; height: auto; margin-bottom: 12vw; }
  body .craft-product-placeholder { height: 70vw; order: 2; }
  body .craft-product-logo { width: 250px; max-width: 82%; margin-bottom: 36px; }
  body .craft-product-logo-pallur { width: 280px; }
  body .pillars { height: auto; min-height: 680px; padding: 70px 0; }
  body .pillars-head h2 { font-size: 29px; }
  body .pillars-sub br { display: none; }
  body .pillars-viewport { overflow: hidden; }
  body .pillars-grid { display: flex; gap: 16px; transition: transform .25s ease; }
  body .pillar-card { flex: 0 0 82vw; height: 390px; }
  body .pillars-nav { display: block; }
  body .site-footer { height: auto; min-height: 190px; }
  body .footer-inner { padding: 30px 0; flex-direction: column; align-items: flex-start; justify-content: center; gap: 24px; }
}

/* Precision pass against Figma frame 543:363 (1920 px). */
html { scrollbar-width: none; }
html::-webkit-scrollbar { display: none; }
body { width: 100vw; }

@media (min-width: 901px) {
  body #hero,
  body .about,
  body .speakers,
  body .diagram,
  body .craft-products,
  body .pillars,
  body .site-footer { width: 100vw; }
  body #hero { height: 1080px; min-height: 1080px; }
  body #hero .content,
  body .nav-inner { width: 1320px; }
  body #hero h1 { left: 0; bottom: 70px; width: 756px; font-weight: 700; line-height: 56px; }

  body .about { height: 832px; min-height: 832px; display: block; }
  body .about-div {
    position: absolute;
    left: calc(50% - 473px);
    top: 181px;
    width: 578px;
    margin: 0;
    padding: 0;
  }
  body .about-title { width: 578px; margin-bottom: 34px; line-height: 56px; }
  body .about-text { width: 550px; margin-bottom: 20px; line-height: 38px; }

  body .speakers-wrap {
    position: absolute;
    left: 50%;
    top: 334px;
    width: 1320px;
    max-width: none;
    height: 1150px;
    margin: 0;
    padding: 0;
    transform: translateX(-50%);
  }
  body .speaker {
    position: absolute;
    inset: 0 auto auto 0;
    display: block;
    width: 1320px;
    height: 575px;
    min-height: 0;
    padding: 0;
  }
  body .speaker + .speaker { top: 575px; margin: 0; }
  body .speaker-photo {
    position: absolute;
    left: 0;
    top: 0;
    width: 302px;
    height: 440px;
    border-radius: 0;
    box-shadow: none;
  }
  body .speaker-photo img { max-width: none; object-fit: cover; }
  body .speaker:first-child .speaker-photo img {
    width: 335.19%;
    height: 153.25%;
    transform: translate(-35.03%, 0);
  }
  body .speaker:nth-child(2) .speaker-photo img {
    width: 433.26%;
    height: 167.27%;
    transform: translate(-36.63%, -17.8%);
    object-position: center;
  }
  body .speaker-main {
    position: absolute;
    left: 390px;
    top: 187px;
    width: 262px;
    padding: 0;
  }
  body .speaker:nth-child(2) .speaker-main { top: 217px; }
  body .speaker-name { margin: 0 0 31px; font-size: 66px; line-height: 66px; }
  body .speaker-summary { margin: 0; font-size: 20px; line-height: 30px; }
  body .speaker-bio {
    position: absolute;
    left: 768px;
    top: 250px;
    width: 549px;
    max-width: none;
    padding: 0;
    font-size: 18px;
    line-height: 38px;
  }
  body .speaker:nth-child(2) .speaker-bio { top: 288px; width: 414px; }

  body .diagram { padding: 0; }
  body .diagram .conteudo { width: 1320px; height: 100%; max-width: none; padding: 0; }
  body .eco-text { position: absolute; top: 170px; left: 0; width: 100%; line-height: 47px; transform: none; }
  body .ecosystem-map {
    position: absolute;
    top: 154px;
    left: 50%;
    width: 989px;
    height: 989px;
    margin: 0;
    transform: translateX(-50%);
  }
  body .ecosystem-logo { width: 291px; }

  body .craft-products-hero { height: 417px; }
  body .craft-product {
    position: relative;
    width: 1320px;
    min-height: 0;
    margin: 0 auto;
    padding: 0;
    display: block;
  }
  body .craft-product-black { height: 1048px; }
  body .craft-product-blue { height: 1075px; }
  body .craft-product-implementation { height: 1365px; }
  body .craft-product-business { height: 1300px; }
  body .craft-product-pallur { height: 765px; }
  body .craft-product-copy,
  body .craft-product-gallery,
  body .craft-product-placeholder { position: absolute; }
  body .craft-product-copy { width: 555px; max-width: none; }
  body .craft-product-logo { width: 320px; height: auto; max-height: none; margin: 0 0 42px; object-fit: contain; }
  body .craft-product h2 { margin: 0 0 34px; font-size: 36px; line-height: 56px; }
  body .craft-product p,
  body .craft-product li { font-size: 18px; line-height: 38px; }
  body .craft-product p { margin-bottom: 20px; }
  body .craft-product-link { margin-top: 4px; font-size: 20px; }

  body .craft-product-black .craft-product-gallery { left: 0; top: -33px; width: 555px; }
  body .craft-product-black .craft-product-copy { left: 706px; top: -67px; }
  body .craft-product-black .craft-product-logo { width: 321px; height: 167px; margin-bottom: 30px; }

  body .craft-product-blue .craft-product-copy { left: 0; top: 62px; }
  body .craft-product-blue .craft-product-logo { width: 292px; height: 138px; margin-bottom: 42px; }
  body .craft-product-blue .craft-product-gallery { left: 704px; top: 131px; width: 620px; height: 785px; }
  body .craft-product-blue .craft-product-gallery img { object-fit: cover; object-position: center; }

  body .craft-product-implementation .craft-product-gallery { left: 0; top: 232px; }
  body .craft-product-implementation .craft-product-copy { left: 706px; top: 78px; }
  body .craft-product-implementation .craft-product-logo { width: 321px; height: 167px; margin-bottom: 57px; }
  body .craft-product-gallery-implementation {
    width: 555px;
    height: auto;
    display: grid;
    grid-template-rows: 541px 296px;
    gap: 20px;
    background: transparent;
  }
  body .craft-product-gallery-implementation > .craft-product-main-photo {
    position: static;
    width: 555px;
    height: 541px;
    margin: 0;
    object-fit: cover;
  }
  body .craft-product-gallery-implementation .craft-product-small-photos {
    grid-template-columns: 262px 272px;
    gap: 20px;
  }

  body .craft-product-business .craft-product-copy { left: 0; top: 47px; }
  body .craft-product-business .craft-product-gallery { left: 707px; top: 176px; width: 554px; height: 808px; }
  body .craft-product-business .craft-product-logo { width: 321px; height: 153px; margin-bottom: 35px; }

  body .craft-product-pallur .craft-product-placeholder { left: -41px; top: 88px; width: 654px; height: 492px; }
  body .craft-product-pallur .craft-product-copy { left: 707px; top: 116px; }
  body .craft-product-pallur .craft-product-logo { width: 372px; height: 63px; margin-bottom: 48px; }

  body .pillars { position: relative; height: 718px; padding: 0; background: #dbdbdb; }
  body .pillars-container { position: relative; width: 1320px; max-width: none; height: 100%; padding: 0 !important; align-items: stretch !important; }
  body .pillars-head { position: absolute; top: 160px; left: 0; width: 100%; margin: 0 !important; }
  body .pillars-head h2 { margin: 0 0 12px; font-size: 36px; line-height: 48px; }
  body .pillars-sub { margin: 0 0 30px; font-size: 18px; line-height: 24px; }
  body .pillars-viewport { position: absolute; top: 341px; left: 0; width: 1320px; max-width: none; height: 395px; }
  body .pillars-grid { width: 1320px; margin: 0; padding: 0; grid-template-columns: repeat(4, 321px); gap: 12px; }
  body .pillar-card {
    width: 321px;
    height: 395px;
    padding: 36px 38px 28px;
    border: 0;
    color: #fff;
    background: #171717;
  }
  body .pillar-card h3 { color: #fff; font-size: 28px; line-height: 36px; }
  body .pillar-icon { color: #999; }

  body .site-footer { height: 347px; color: #fff; background: #050505; }
  body .footer-inner { width: 1320px; max-width: none; height: 100%; padding: 0; align-items: center; transform: translateY(70px); }
  body .logo-footer { width: 159px; height: 83px; object-fit: contain; }
  body .footer-left,
  body .footer-right { color: #fff; }
  body .footer-icons img { filter: invert(1); }
}

@media (max-width: 900px) {
  body .craft-product-gallery-implementation {
    height: auto;
    display: grid;
    grid-template-rows: auto auto;
    gap: 12px;
    background: transparent;
  }
  body .craft-product-gallery-implementation > .craft-product-main-photo {
    width: 100%;
    height: auto;
    margin: 0;
  }
  body .craft-product-gallery-implementation .craft-product-small-photos {
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  body .craft-product-gallery-implementation .craft-product-small-photos img {
    width: 100%;
    height: auto;
    margin: 0;
  }
}
@font-face { font-family: "Manrope"; src: url("/src/fonts/manrope-latin.woff2") format("woff2"); font-style: normal; font-weight: 300 800; font-display: swap; }