/* === Shared (3 páginas) === */

/* Skip link */
.skip-to-content {
  position: absolute; left: -9999px; top: auto;
  width: 1px; height: 1px; overflow: hidden;
}
.skip-to-content:focus {
  position: fixed; left: 16px; top: 16px;
  width: auto; height: auto; padding: 8px 12px;
  background: #fff; color: #000; border-radius: 6px; z-index: 2000;
}

/* Reveal on scroll (unificado) */
body.reveal-ready .reveal,
body.reveal-ready section {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity .6s ease, transform .6s ease;
  will-change: opacity, transform;
}
body.reveal-ready .reveal.is-visible,
body.reveal-ready section.is-visible {
  opacity: 1;
  transform: none;
}

@media (prefers-reduced-motion: reduce) {
  body.reveal-ready .reveal,
  body.reveal-ready section { opacity: 1 !important; transform: none !important; }
}


/* === Inline CSS migrated from index.html === */

    /* Root Variables */
    :root {
      --bg: #000;
      --text: #D7D9E0;
      --highlight: #38393D;
      --tag-border: #D7D9E0;
      --tooltip-bg: #D7D9E0;
      --tooltip-text: #131314;
    }

    /* Global Reset */
    *, *::before, *::after {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
        /* Remover underline de todos os links (global) */
        a,
        a:visited,
        a:hover,
        a:focus,
        a:active {
          text-decoration: none;
          color: var(--text);
        }
    }

    html, body {
      /*overflow-x: hidden;*/
      background: var(--bg);
      color: var(--text);
      font-family: 'Manrope', sans-serif; /* corrigido */
      scroll-behavior: smooth;
    }

    /* Header (Desktop) */
    .header {
      margin: 0 23px;
      padding: 88px 0 88px;
      display: flex;
      align-items: center;
      gap: 16px;
      opacity: 0;
      animation: fadeUp 0.8s ease-out 0.2s forwards;
    }
    .header_works {
      margin: 0 auto;
      padding: 56px 23px 56px;
      border-bottom: 1px solid #38393D;
      display: flex;
      align-items: center;
      gap: 16px;
      opacity: 0;
      animation: fadeUp 0.8s ease-out 0.2s forwards;
    }
    .header_sobre {
      margin: 0 auto;
      padding: 56px 23px 56px;
      border-bottom: 1px solid #38393D;
      display: flex;
      align-items: center;
      gap: 16px;
      opacity: 0;
      animation: fadeUp 0.8s ease-out 0.2s forwards;
    }
    .header-title {
      width: 50%;
      text-align: left;
      font-size: 52px;
      line-height: 72px;
      font-weight: 400;
    }
    .header-title_works {
      width: 50%;
      text-align: left;
      font-size: 32px;
      line-height: 40px;
      font-weight: 400;
    }
    .header-title_sobre {
      width: 50%;
      text-align: left;
      font-size: 32px;
      line-height: 40px;
      font-weight: 400;
    }
    .header-nav {
      width: 50%;
      display: flex;
      justify-content: flex-end;
      align-items: center;
      /*padding-right: 124px;*/
    }
    .header-about_index {
      font-size: 72px;
      line-height: 72px;
      font-weight: 400;
      color: var(--text);
      margin-right: 32px;
    }
    .header-about_works {
      font-size: 32px;
      line-height: 40px;
      font-weight: 400;
      color: var(--text);
      margin-right: 12px;
    }
    .header-arrow_index { width: 48px; height: 48px; }
    .header-arrow_works { width: 20px; height: 20px; }

    @media (max-width: 1366px) and (min-width: 769px) {
      .header,
      .grid {
        /*max-width: 874px;*/
        /*margin: 0 auto;*/
      }
      .header-nav { /*margin-right: 160px;*/ }
    }

    /* Work Grid (Desktop) */
    .grid {
      margin: 0 23px;
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      gap: 16px;
    }

    /* Mobile Styles — corrigido (chaves balanceadas) */
    @media (max-width: 480px) {
      .header {
        padding: 0 16px;
      }
      .header_works {
        padding: 0 16px;
      }
      /* Footer Mobile Adjustments (mantidos, mas refinados abaixo para tablet também) */
      .footer {
        margin: 0 16px 64px;
        display: flex;
        flex-direction: column;
        align-items: center;
      }
      #footer-text {
        text-align: center;
        padding-bottom: 0;           /* removemos o padding para controlar o espaçamento pelo .footer-links */
      }
      .footer-links {
        justify-content: center;
      }

      .header-title {
        width: 100%;
        font-size: 32px;
        line-height: 40px;
        font-weight: 400;
        text-align: left;
      }
      .header-title_works {
        width: 100%;
        font-size: 32px;
        line-height: 40px;
        font-weight: 400;
        text-align: left;
      }
      .header-title_sobre {
        width: 100%;
        font-size: 32px;
        line-height: 40px;
        font-weight: 400;
        text-align: left;
      }
      .header-nav {
        width: 100%;
        margin-right: 0;
        justify-content: flex-start;
      }
      .grid {
        margin: 0 16px;
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
      }
    }

    .work-card {
      position: relative;
      grid-column: span 6;
      border-radius: 8px;
      overflow: hidden;
      cursor: pointer;
      aspect-ratio: 3 / 2;
      opacity: 0;
      animation: fadeUp 0.8s ease-out forwards;
    }
    /* Staggered animation delays */
    .work-card:nth-child(1) { animation-delay: 0s; }
    .work-card:nth-child(2) { animation-delay: 0.3s; }
    .work-card:nth-child(3) { animation-delay: 0.6s; }
    .work-card:nth-child(4) { animation-delay: 0.9s; }

    .work-image {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: transform 0.5s ease;
    }

    /* Hover Effect (Desktop) */
    @media (min-width: 769px) {
      .work-card:hover .work-image { transform: scale(1.05); }
      .work-overlay {
        position: absolute;
        inset: 0;
        background-color: #131314;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        padding: 72px 0 80px 72px;
        opacity: 0;
        transition: all 0.4s ease;
      }
      .work-card:hover .work-overlay { opacity: 1; }
      .work-tags, .work-title, .arrow-work {
        transform: translateY(40px);
        opacity: 0;
        transition: all 0.4s ease;
      }
      .work-card:hover .work-tags,
      .work-card:hover .work-title,
      .work-card:hover .arrow-work {
        transform: translateY(0);
        opacity: 1;
      }
      .arrow-work {
        position: absolute;
        top: 72px;
        right: 72px;
        width: 32px;
        height: 32px;
        transform: rotate(90deg);
        opacity: 0;
        transition: transform 0.4s ease, opacity 0.4s ease;
      }
      .work-card:hover .arrow-work { transform: rotate(0deg); opacity: 1; }
    }

    .work-tags { display: flex; gap: 12px; margin-bottom: 20px; }
    .tag {
      border: 1px solid var(--tag-border);
      border-radius: 100px;
      padding: 8px 16px;
      font-size: 16px;
      line-height: 24px;
      font-weight: 500;
      color: var(--tag-border);
    }
    .work-title {
      font-size: 56px;
      line-height: 64px;
      font-weight: 400;
    }

    /* Footer (Desktop) */
    .footer {
      margin: 0 23px 0;
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      align-items: center;
      padding: 56px 0 64px;
      /*height: 104px;*/
    }
    #footer-text {
      grid-column: 1 / 2;
      justify-self: start;
      font-size: 20px;
      line-height: 28px;
      font-weight: 400;
      white-space: nowrap;
    }
    .footer-links {
      grid-column: 12 / 13;
      justify-self: end;
      display: flex;
      gap: 8px;
    }
    .footer-links a,
    .footer-links button {
      font-size: 20px;
      line-height: 28px;
      font-weight: 400;
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 8px 16px;
      text-decoration: none;
      background: #131314;
      border: none;
      border-radius: 48px;
      color: var(--text);
      cursor: pointer;
      transition: background-color 0.3s ease, border-radius 0.3s ease;
      white-space: nowrap; /* cada link não quebra em duas linhas */
      position: relative;
    }
    .footer-links a:hover,
    .footer-links button:hover { background-color: var(--highlight); border-radius: 100px; }

    /* Tooltip */
    .tooltip {
      position: absolute;
      bottom: calc(100% + 4px);
      left: 50%;
      transform: translateX(-50%);
      background: var(--tooltip-bg);
      color: var(--tooltip-text);
      padding: 8px 12px;
      border-radius: 100px;
      font-size: 12px;
      line-height: 20px;
      font-weight: 600;
      opacity: 0;
      transition: opacity 0.3s ease;
      pointer-events: none;
      white-space: nowrap;
    }
    .tooltip.show { opacity: 1; }

    @keyframes fadeUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: translateY(0); } }
  


    /* Tablet e Mobile: ajustes existentes do header + header-nav full-bleed */
    @media (max-width: 1024px) {

      .header {
        margin: 0 16px;
        padding: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
      
  .sobre-hero { align-items: center; }
  .sobre-right { margin-left: 0; align-self: center; }
  .sobre-photo { display: block; margin: 0 auto; }
}

      .header_works {
        margin: 0 16px;
        padding: 0;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        border-bottom:0;
      }

      .header_sobre {
        border-bottom:1px solid #38393D;
      }

      .header-title {
        width: 100%;
        margin: 32px 0 24px 0;
      }
      .header-title_works {
        width: 100%;
        margin: 32px 0 24px 0;
      }
      .header-title_sobre {
        width: 100%;
      }

      .header-nav {
        width: 100vw;
        margin-left: calc(50% - 50vw);
        margin-right: calc(50% - 50vw);
        padding: 24px 16px;                 /* 16px de espaçamento interno laterais */
        border-top: 1px solid #38393D;
        border-bottom: 1px solid #38393D;
        margin-bottom: 72px;
        display: flex;
        justify-content: flex-end;
        align-items: center;
      }

      .header-nav-link {
        display: inline-flex;
        align-items: center;
        text-decoration: none;
        color: inherit;
        cursor: pointer;
      }

      .header-about_index {
        font-size: 32px;
        line-height: 32px;
        margin-right: 12px;
      }

      .header-about_works {
        font-size: 32px;
        line-height: 32px;
        margin-right: 12px;
      }

      .header-arrow_index {
        width: 24px;
        height: 24px;
      }

      .header-arrow_works {
        width: 24px;
        height: 24px;
      }

      /* ===== Footer responsivo (o que você solicitou) ===== */
      .footer{
        width: 100%;             /* footer 100% */
        margin: 0;        /* remove margens laterais para preencher a largura */
        padding: 40px 0 32px;    /* mantém o respiro vertical */
        display: flex;
        flex-direction: column;  /* empilha texto e links */
        align-items: center;     /* centraliza conteúdo */
      }
      #footer-text{
        width: 100%;             /* texto 100% */
        text-align: center;      /* centralizado */
        white-space: nowrap;     /* mantém em uma linha */
      }
      .footer-links{
        width: auto;
        margin: 24px 16px 0;     /* 24px abaixo do texto + 16px laterais */
        display: flex;
        flex-wrap: wrap;         /* permite quebrar linha se não couber */
        justify-content: center; /* centraliza os links */
        gap: 8px;                /* mantém o espaçamento entre links */
      }
    }

    /* Mobile (375px): margem específica no h1 */
    @media (max-width: 375px) {
      .header-title {
        margin: 88px 0 24px 0;
      }
    }
  

/* === Inline CSS migrated from work-one.html === */

    /* ===== Base ===== */
    :root { --bg:#000; --text:#D7D9E0; --highlight:#38393D; --tag-border:#D7D9E0; }
    *,*::before,*::after { margin:0; padding:0; box-sizing:border-box; }
    html,body { /*overflow-x:hidden;*/ background:var(--bg); color:var(--text); font-family:'Manrope',sans-serif; font-size:16px; scroll-behavior:smooth; }

    /* ===== Float Header ===== */ 
    .float-header { position:fixed; top:0; left:0; right:0; display:flex; justify-content:space-between; align-items:center; padding:0 23px; height:144px; margin-bottom:48px; overflow:hidden; z-index:1000; }
    .float-header::before { display: none; }
    
    .float-header a { position:relative; z-index:1; font-size:24px; line-height:32px; font-weight:400; color:#F2F3F5; text-decoration:none; transition:color .4s ease; }
    
    .float-header .icon { position:relative; z-index:1; width:32px; height:32px; /*transform:rotate(90deg);*/ fill:#F2F3F5; transition:transform .4s ease, fill .4s ease; }
    
    @media(max-width:480px) {
      .float-header { padding: 0 16px; }
      .float-header::before { display:none; }
      .float-header a { font-size:24px; line-height:32px; color:#D7D9E0; }
      .float-header .icon { width:24px; height:24px; }
    }

    @media (max-width: 480px) {
      .about-link { 
        display: none !important;
      }
    }

    /* ===== Work Title Session ===== */
    .work-title-session { display:flex; /*align-items:center;*/ justify-content:flex-start; gap:16px; margin:88px auto 0; padding:0 23px; }
    .work-title-session .title, .work-title-session .desc { width:50%; text-align:left; }
    .work-title-session .title { font-size:56px; line-height:64px; font-weight:400; color:var(--text); }
    .work-title-session .desc { font-size:24px; line-height:36px; font-weight:400; color:#B0B2B8; }
    @media(max-width:1366px) { .work-title-session { max-width:100%; margin-top:88px; } }
    @media(max-width:480px) { .work-title-session { flex-direction:column; margin-top:0px; padding:0 16px; } .work-title-session .title { width:100%; font-size:40px; line-height:48px; } .work-title-session .desc { width:100%; font-size:20px; line-height:28px; } }

    /* ===== Work Cover Session ===== */
    .work-cover-session { margin-top:128px; }
    .work-cover-session .cover {
      background:url('image-sample.jpg') center/cover no-repeat;
      width: calc(100% - 46px);
      aspect-ratio: 16/9;
      margin: 0 23px;
      border-radius: 8px;
      object-fit: cover;
      display: block;
    }
    @media(max-width:748px) { .work-cover-session { margin-top:64px; } .work-cover-session .cover { width:100%; margin:0; border-radius:0; } }

    /* ===== Work Description & Team ===== */
    .work-description { display:flex; align-items:center; justify-content:space-between; max-width:100%; margin:192px auto; padding:0 23px; }
    .work-description .description { width:100%; padding-right:88px; }
    .work-description .team { width:100%; align-self:baseline; }
    .work-description h2, .work-description h3 { font-size:24px; line-height:36px; font-weight:400; color:#F2F3F5; margin-bottom:16px; }
    .work-description .description p:nth-of-type(1) { font-size:24px; line-height:36px; color:#B0B2B8; margin-bottom:36px; }
    .work-description .description p:nth-of-type(n+2) { font-size:24px; line-height:36px; color:#B0B2B8; margin-bottom:36px; }
    .work-description .team p { font-size:24px; line-height:36px; color:#B0B2B8; }
    /*@media(max-width:768px) { .work-description { max-width:100%; margin:120px auto; } }*/
    @media(max-width:1024px) {
      .work-description { display:flex; flex-direction:column; margin:64px auto; padding:0 16px; }
      .work-description .description { width:100%; padding:0 0 36px; }
      .work-description .description p:nth-of-type(1) { font-size:20px; line-height:32px; }
      .work-description .description p:nth-of-type(n+2) { font-size:20px; line-height:32px; }
      .work-description .team { width:100%; }
      .work-description .team p { font-size:20px; line-height:32px; margin-bottom:64px; }
    }

    /* ===== Process Session ===== */
    .session-process {}
    @media(max-width:1366px) { .session-process { margin:160px auto; } } /* corrigido */
    @media(max-width:480px)  { .session-process { margin: 64px 16px; } }

    .process-slider { display:flex; overflow-x:hidden; gap:16px; padding:0 23px; 
  overflow-y: visible;
}
    @media(min-width:749px) { .process-slider { overflow-x:hidden; scroll-snap-type:none; 
  overflow-y: visible;
} }
    @media(max-width:748px) {
      .process-slider { display:flex; overflow-x:auto; scroll-snap-type:none; gap:8px; padding:0; margin:0 -16px; 
  overflow-y: visible;
}
    }
    .process-slider::-webkit-scrollbar { display:none; }

    /* ===== Centered Fixed Width Container for Process Session ===== */
    @media(min-width:1367px) { .session-process { width:100%; margin:192px auto; } }
    @media(max-width:1366px) and (min-width:769px) { .session-process { width:100%; margin:160px auto; } }

    /* Process Card Base */
    .process-card { flex:0 0 auto; border-radius:8px; padding:32px; width:calc((100% - 32px) / 3); margin:0; }
    @media(min-width:1367px) { .process-card { height:614px; } }
    @media(max-width:1366px) and (min-width:769px) { .process-card { height:560px; } }
    @media(max-width:748px) { .process-card { width:272px; height:440px; padding:32px 16px; } }

    /* Card-specific backgrounds */
    .card-discovery { background:#131314; }
    .card-bench     { background:#38393D; }
    .card-proto     { background:#EBECF0; }

    /* Number styling */
    .process-header { display:flex; justify-content:flex-end; }
    .process-header .number { font-weight:400; text-align:left; }
    @media(min-width:1367px) { .process-header { padding-bottom:144px; } .process-header .number { font-size:24px; line-height:36px; } }
    @media(max-width:1366px) and (min-width:769px) { .process-header { padding-bottom:80px; } .process-header .number { font-size:20px; line-height:32px; } }
    @media(max-width:480px) { .process-header { padding-bottom:32px; } .process-header .number { font-size:16px; line-height:24px; } }

    /* Tag container */
    .content-tags { display:flex; flex-wrap:wrap; margin-bottom:32px; gap:8px; }
    @media(min-width:769px) { .content-tags { gap:12px; } } /* corrigido */

    /* Tag styling */
    .content-tags .tag { border-radius:100px; border:1.5px solid; font-weight:400; padding:8px 16px; white-space:nowrap; }
    @media(min-width:1367px) { .content-tags .tag { padding:12px 20px; font-size:24px; line-height:36px; } }
    @media(max-width:1366px) and (min-width:769px) { .content-tags .tag { padding:8px 16px; font-size:20px; line-height:32px; } }
    @media(max-width:480px) { .content-tags .tag { padding:8px 16px; font-size:16px; line-height:24px; } }

    /* Paragraph styling */
    .card-paragraph { margin-top:32px; font-weight:400; text-align:left; }
    @media(min-width:1367px) { .card-paragraph { font-size:24px; line-height:36px; } }
    @media(max-width:1366px) and (min-width:769px) { .card-paragraph { font-size:20px; line-height:32px; } }
    @media(max-width:480px) { .card-paragraph { font-size:16px; line-height:24px; } }

    /* Text colors per card */
    .card-discovery .process-header .number,
    .card-discovery .content-tags .tag,
    .card-discovery .card-paragraph,
    .card-bench .process-header .number,
    .card-bench .content-tags .tag,
    .card-bench .card-paragraph { color:#B0B2B8; border-color:#B0B2B8; }
    .card-proto .process-header .number,
    .card-proto .content-tags .tag,
    .card-proto .card-paragraph { color:#000; border-color:#000; }

    /* ===== Text Content Session ===== */
    .text-content-session { display:flex; /*align-items:center;*/ justify-content:space-between; /*max-width:1244px;*/ margin:192px auto; padding:0 23px; }
    .text-content-session .text-title, .text-content-session .text-paragraph { width:50%; text-align:left; }
    .text-content-session .text-title { font-size:56px; line-height:64px; font-weight:400; }
    .text-content-session .text-paragraph { font-size:24px; line-height:36px; font-weight:400; }
    @media(max-width:1366px) { .text-content-session { /*max-width:1098px;*/ } }
    @media(max-width:748px) {
      .text-content-session { display:flex; flex-direction:column; margin:120px auto; padding:0 23px; }
      .text-content-session .text-title, .text-content-session .text-paragraph { width:100%; text-align:left; }
      .text-content-session .text-title { margin-bottom:28px; }
      .text-content-session .text-paragraph { font-size:20px; line-height:32px; }
    }

    /* ===== Image Full Width Session ===== */
    .image-fullwidth-session { margin:192px 23px; display:flex; flex-direction:column; gap:16px; }
    .image-fullwidth-session .fullwidth-image { border-radius:8px; width:100%; display:block; object-fit:cover; }
    @media(max-width:748px) { .image-fullwidth-session { margin:64px 23px; } }
    @media(max-width:480px) { .image-fullwidth-session { margin:64px 16px; } }

    /* ===== Screen Description Session ===== */
    .screen-description-session { display:flex; align-items:center; justify-content:space-between; max-width:1244px; margin:192px auto; padding:0 23px; }
    .screen-description-session .text-content { width:48%; }
    .screen-description-session .sd-title { font-size:56px; line-height:64px; font-weight:400; margin-bottom:28px; }
    .screen-description-session .sd-paragraph { font-size:24px; line-height:36px; }
    .screen-description-session .sd-video { width:375px; height:812px; background:#38393D; border-radius:24px; }
    @media(max-width:1366px) { .screen-description-session { max-width:1098px; } }
    @media(max-width:480px) {
      .screen-description-session { flex-direction:column; margin:64px auto; padding:0 16px; }
      .screen-description-session .sd-title { font-size:36px; line-height:44px; margin-bottom:40px; }
      .screen-description-session .sd-paragraph { font-size:20px; line-height:32px; }
      .screen-description-session .sd-video { width:343px; height:742px; border-radius:24px; }
    }
    .screen-description-session.reverse { flex-direction:row-reverse; }

    /* Pedidos (≤748px): text-content 100% e reverse em coluna */
    @media (max-width: 748px) {
      .screen-description-session .text-content { width:100%; margin-bottom:64px; }
      .screen-description-session.reverse { flex-direction:column; width:100%; margin:120px auto; }
    }

    /* ===== Duo Image Content Session ===== */
    .duo-image-session { display:flex; flex-wrap:wrap; gap:16px; margin:192px 23px; }
    @media(max-width:1366px) { .duo-image-session { margin:160px 23px; } }
    @media(max-width:480px)  { .duo-image-session { margin:64px 16px; } }
    .duo-image-session .image-block { width:calc((100% - 16px) / 2); aspect-ratio:1/1; border-radius:8px; object-fit:cover; display:block; }
    @media(max-width:480px)  { .duo-image-session .image-block { border-radius:0; } }

    /* ===== Outros Trabalhos ===== */
    .nextworks-footer { margin:192px 0 0; }
    @media(max-width:1366px) { .nextworks-footer { margin:160px 0 0; } }
    @media(max-width:480px)  { .nextworks-footer { margin:64px 0 0; } }
    .nextworks-footer h2 { font-size:16px; line-height:24px; font-weight:400; color:var(--text); margin:16px 23px; }
    .works-list { display:grid; }
    .work-item { display:flex; align-items:center; justify-content:space-between; padding:88px 23px; background:#000; border-bottom:1px solid #38393D; cursor:pointer; overflow:hidden; text-decoration:none; color:inherit; }
    @media(max-width:480px) { .work-item { flex-direction:column; align-items:flex-start; gap:16px; padding:48px 16px; } .work-item .item-icon { order:-1; content:url('../assets/works-arrow_mb.svg'); } }
    .work-item .item-text h3 { font-size:88px; line-height:96px; font-weight:400; color:var(--text); margin:0; }
    .work-item .item-text p  { font-size:24px; line-height:36px; color:#B0B2B8; margin:20px 0 0; }
    @media(max-width:480px) { .work-item .item-text h3 { font-size:56px; line-height:64px; } .work-item .item-text p { font-size:16px; line-height:24px; } }
    .work-item .item-icon { width:48px; height:48px; fill:var(--text); }

    /* ===== Back to Top Float ===== */
    .back-float { position:fixed; bottom:32px; right:23px; display:flex; align-items:center; background:rgba(56,57,61,0.72); border-radius:100px; padding:8px 8px 8px 16px; backdrop-filter:blur(24px); transform:translateY(20px); opacity:0; visibility:hidden; transition:transform .4s ease, opacity .4s ease; border:none; outline:none; z-index:1000; }
    @media(max-width:480px) { .back-float { bottom:16px; right:16px; } }
    .back-float.show { transform:translateY(0); opacity:1; visibility:visible; }
    .back-float span { font-family:'Manrope',sans-serif; font-weight:600; font-size:16px; line-height:24px; color:#D7D9E0; margin-right:8px; }
    .back-float-icon { padding:8px; border-radius:32px; background-color:#D7D9E0; }

    /* === Responsive: 748px (pedido prévio) === */
    @media (max-width: 748px) {
      .screen-description-session .text-content { width: 100%; margin-bottom:64px; }
      .screen-description-session.reverse { flex-direction: column; width: 100%; margin:120px auto; }
    }

    /* Links work-item: sem underline e sem mudança de cor */
    .works-list a.work-item,
    .works-list a.work-item:visited,
    .works-list a.work-item:hover,
    .works-list a.work-item:focus,
    .works-list a.work-item:active { text-decoration:none; color:inherit; }

    /* Mobile ≤480px: ajustes pontuais para text-content-session */
    @media(max-width:480px){
      .screen-description-session,
      .text-content-session { margin:80px auto; }
      .text-content-session .text-title { font-size:36px; line-height:44px; }
    }

    /* ===== Desktop Process Cards Fullwidth ===== */
    @media(min-width:749px) {
      .process-card:last-child { margin-right:0; }
    }
    @media (max-width: 748px) {
      .duo-image-session .image-block {
        width: 100%;
        border-radius: 8px; /* mantém os cantos arredondados inclusive no ≤480 */
        display: block;
      }
    }
  
    /* Scroll horizontal do process-slider: cria respiro de 16px na borda esquerda apenas do card-discovery */
@media (max-width: 748px) {
  .process-slider .card-discovery { margin-left: 16px; }
}

/* === Reveal on scroll: todas as <section> sobem com fade-in === */
body.reveal-ready section {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity .6s ease, transform .6s ease;
  will-change: opacity, transform;
}
body.reveal-ready section.is-visible {
  opacity: 1;
  transform: none;
}
/* Acessibilidade */
    /* Acessibilidade */
    @media (prefers-reduced-motion: reduce) {
    }
  
    /* About link (texto + ícone) no header */
    .about-link{display:flex;align-items:center;text-decoration:none;color:inherit;}
    .about-text{font-size:56px;line-height:56px;font-weight:400;color:#F2F3F5;margin-right:20px;}
  
    /* ===== Responsivo do header "Sobre" (herdado do index) ===== */
    @media (max-width: 1024px) {
      .about-text { font-size: 32px; line-height: 32px; margin-right: 12px; }
      .float-header .icon { width: 24px; height: 24px; }
      .about-link { text-decoration: none; color: inherit; cursor: pointer; }
    }

/* === SOBRE (About) Page Styles === */
/* Container principal (2 colunas) */
.sobre-hero {
  margin: 88px 0 256px 0; /* 88px abaixo do header */
  padding: 0 23px;
  display: flex;
  align-items: flex-start;
  gap: 174px; /* espaçamento entre colunas */

  justify-content: flex-start;
}
@media (max-width: 1366px) {
  .sobre-hero { gap: 96px; 
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
  margin:0 0 256px 0;
}
}

.sobre-left {
  flex: 1 1 0;
  margin-left: auto;
}

.sobre-right {
  flex: 0 0 auto;
  margin-left: auto;
}

/* Texto da coluna esquerda */
.sobre-left p {
  font-size: 32px;
  line-height: 44px;
  color: #D7D9E0;
  font-weight: 400;
  margin: 0;
}

/* Links sob o parágrafo (estilo inspirado nos links do footer da Home) */
.sobre-links {
  margin-top: 72px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

/* Bloco clicável/link-like (reaproveitável) */
.footer-link-like {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 16px 16px;
  border: 1px solid #38393D;
  border-radius: 4px;
  background: transparent;
  color: #D7D9E0;
  text-decoration: none;
  cursor: pointer;
  transition: background .25s ease, border-color .25s ease, opacity .25s ease, transform .25s ease;
}
.footer-link-like:hover {
  background: #0A0A0A;
  border-color: #4A4B50;
  transform: translateY(-1px);
}
.footer-link-like img {
  width: 20px;
  height: 20px;
  display: block;
}

/* Imagem da coluna direita */
.sobre-photo {
  width: 614px;
  height: 656px;
  /*max-width: 100%;*/
  border-radius: 4px;
  object-fit: cover;
}

/* Responsivo ≤ 1024px: imagem vem primeiro e reduz tamanho; texto sobrepõe -88px */
@media (max-width: 1024px) {
  .sobre-hero {
    flex-direction: column;
    gap: 0;
  
  width: 100%;
  max-width: 100%;
  justify-content: flex-start;
}
  .sobre-right { order: 1; 
  margin-left: auto;
}
  .sobre-left  { order: 2; margin-top: -88px; }

  .sobre-photo {
    width: 482px;
    height: 515px;
  }
}

/* === Footer links @max-width:1024px (requested overrides) === */
@media (max-width: 1024px) {
  .footer-links {
    width: 100%;
    margin: 24px auto;
    gap: 0px;
  }
  .footer-links a {
    width: 100%;
    justify-content: space-between;
    padding: 16px 16px;
    border-bottom: 1px solid #38393D;
    border-radius: 0px;
    background: #000;
  }
  .footer-links button {
    width: 100%;
    justify-content: space-between;
    padding: 16px 16px;
    border-bottom: 1px solid #38393D;
    border-radius: 0px;
    background: #000;
  }
}

/* Responsivo ≤ 375px: imagem 263x281; parágrafo -48px; p 20/28; links margin-top 40px; links 16/24 */
@media (max-width: 480px) {
  .sobre-right { order: 1; 
  margin-left: auto;
}
  .sobre-left  { order: 2; margin-top: -48px; }

  .sobre-photo {
    width: 263px;
    height: 281px;
  }

  .sobre-left p {
    font-size: 20px;
    line-height: 28px;
  }

  .sobre-links {
    margin-top: 40px;
  }

  .footer-link-like {
    font-size: 16px;
    line-height: 24px;
    padding: 12px 12px;
  }
}


/* === SOBRE: ajustar botões/links (largura por conteúdo, coluna, gap 8px, sem borda) === */
.sobre-links {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
}

.sobre-links .footer-link-like,
.sobre-links a,
.sobre-links button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: auto;              /* largura pelo texto */
  white-space: nowrap;      /* evita quebra */
  padding: 20px 24px;
  border: none;             /* remove borda */
  background: #131314;
  border-radius: 48px;      /* mantive pílula (você não pediu para remover) */
  color: #D7D9E0;
  font-size:32px;
  line-height: 32px;
  cursor: pointer;
  transition: background-color 0.3s ease, border-radius 0.3s ease, transform 0.25s ease;
}

.sobre-links .footer-link-like:hover,
.sobre-links a:hover,
.sobre-links button:hover {
  background-color: #38393D;
  transform: translateY(-1px);
}

.sobre-links .footer-link-like img,
.sobre-links a img,
.sobre-links button img {
  width: 24px;
  height: 24px;
  display: block;
}

/* === Sobre: corrigir overflow horizontal === */
.sobre-hero {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box; /* padding não soma à largura total */
}

/* Robustez extra no mobile: permitir quebra de linha nos botões/links longos */
@media (max-width: 480px) {
  .sobre-links .footer-link-like,
  .sobre-links a,
  .sobre-links button {
    max-width: 100%;
    padding: 8px 16px;
    white-space: normal;
    overflow-wrap: anywhere;
    font-size:16px;
    line-height: 24px;
  }

.sobre-links .footer-link-like img,
.sobre-links a img,
.sobre-links button img {
  width: 20px;
  height: 20px;
  display: block;
}
}

@media (max-width: 1024px) {
  .header-nav{
    width: 100dvw;
    left: 50%;
    right: 50%;
    margin-left: -50dvw;
    margin-right: -50dvw;
    position: relative;
    overflow-x: clip;
  }
}


img { max-width: 100%; height: auto; }

/* Utility: fluid-svg
   Use this class on an <svg> that SHOULD be responsive.
   Chip icons or fixed-size SVGs should NOT use this class. */
.fluid-svg { max-width: 100%; height: auto; }


/* Mobile-only: LinkedIn chip icon size (scoped to that specific link) */
@media (max-width: 480px) {
  .sobre-links a.footer-link-like[href*="linkedin.com/in/miguelalvarenga"] img,
  a.footer-link-like[href*="linkedin.com/in/miguelalvarenga"] img {
    width: 14px;
    height: 14px;
  }
}


/* Footer chips: ONLY 'Sobre' and 'LinkedIn' icons fixed at 14x14 in ALL viewports */
.footer-links a[href*="sobre"] img,
.footer-links a[href*="sobre"] svg,
.footer-links a[href*="linkedin.com/in/miguelalvarenga"] img,
.footer-links a[href*="linkedin.com/in/miguelalvarenga"] svg {
  width: 14px;
  height: 14px;
  flex: 0 0 14px;
  display: block;
}