#intro {
    position: relative;
    overflow: hidden;
}

.hero-video-wrapper {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 0;
}

.hero-video-wrapper video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-video-overlay {
    position: absolute;
    inset: 0;
    background: rgba(0,0,0,0.35);
}

.s-intro__content {
    position: relative;
    z-index: 2;
}




/* ocultar scroll hor ---------------- */

html, body {
    overflow-x: hidden;
}

/* ocultar menu ao sair do hero ----------- */
/* animação do header */
.s-header {
    transition: transform 0.4s ease;
}

/* estado escondido */
.s-header.hide-header {
    transform: translateY(-100%);
}

/* FLAGS -------------- */

.flag-menu{

    width: 20px;
    margin-top: 7px;
    z-index: 9999999999999;
  }

 
  @media screen and (max-width: 1024px){

    .flag-menu{
        margin-bottom:-33px;
            z-index: 9999999999999;
                width: 22px !important;
 

    }

}

/* ajustes GPT 4/6 ----------------------------- */

/* MENU DESKTOP COMO HAMBÚRGUER + LOGO CENTRALIZADO */
/* MENU MOBILE REPLICADO EM TODOS OS DEVICES */

/* Header sempre com comportamento mobile */
.s-header {
    --header-height: 80px;
    top: 0;
}

.s-header__content {
    margin: 0;
    padding: 0;
    border: none;
    box-shadow: none;
    position: relative;
}

.s-header__block {
    width: 100%;
    height: var(--header-height);
    border: none;
    box-shadow: none;
}

/* Logo centralizado */
.header-logo {
    position: fixed;
    left: 50vw;
    top: 25px;
    bottom: 10px;
    transform: translateX(-50%);
    z-index: 1002;

}

/* MOBILE */

@media screen and (max-width: 800px) {

    .header-logo {
        left: 45vw;
    }

}

/* Botão hamburguer no canto direito */
.header-menu-toggle {
    display: block !important;
    right: calc(var(--gutter) * 2) !important;
    left: auto !important;
    z-index: 1003;
}

/* Menu fechado */
.header-nav {
    display: block !important;
    width: 100%;
    transform: scaleY(0);
    transform-origin: center top;
    background-color: var(--color-bg);
    box-shadow: var(--shadow-medium);
    border-bottom: 1px solid var(--color-bg-neutral-dark);
    padding-top: calc(var(--header-height) + var(--vspace-1_25));
    padding-right: calc(var(--gutter) * 2 + 0.2rem);
    padding-left: calc(var(--gutter) * 2 + 0.2rem);
    padding-bottom: var(--vspace-1_5);
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
}

/* Itens escondidos */
.header-nav__links {
    display: block !important;
    padding-left: 0;
    margin: 0 0 var(--vspace-1_5) 0;
    transform: translateY(-2rem);
    opacity: 0;
    visibility: hidden;
}

.header-nav__links a {
    font-size: var(--text-base);
    padding: var(--vspace-0_25) 0;
}

/* Contacto escondido */
.header-contact {
    position: static !important;
    transform: translateY(-2rem);
    opacity: 0;
    visibility: hidden;
}

.header-contact .btn {
    margin: 0;
}

/* Menu aberto */
.menu-is-open .s-header {
    height: auto;
}

.menu-is-open .header-nav {
    transform: scaleY(1);
    transition: transform 0.3s var(--ease-quick-out);
    transition-delay: 0s;
}

.menu-is-open .header-nav__links,
.menu-is-open .header-contact {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    transition: all 0.6s var(--ease-quick-out);
    transition-delay: 0.3s;
}

/* ------------------------------------ */

/* HERO FULL WIDTH ACIMA DE 1200PX */

@media screen and (min-width: 1201px) {

    #intro.container {
        max-width: none;
        width: 100%;
        margin-left: 0;
        margin-right: 0;
    }

    .hero-video-wrapper {
        width: 100vw;
        left: 50%;
        transform: translateX(-50%);
    }

    .hero-video-wrapper video {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}

/* -------------------------------------- */

/* TEXTO HOVER PORTFOLIO */

.gallery-items__item-thumb {
    position: relative;
    overflow: hidden;
}

.gallery-hover-text {
    position: absolute;
    left: 20px;
    bottom: 20px;

    display: flex;
    flex-direction: column;

    opacity: 0;
    visibility: hidden;

    transform: translateY(10px);
    transition: all .3s ease;

    z-index: 10;
}

.gallery-hover-text strong {
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.2;
}

.gallery-hover-text small {
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.2;
    margin-top: 2px;
}

/* aparece apenas no hover */

.gallery-items__item-thumb:hover .gallery-hover-text {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}



 

/* ==========================================
   BUTTONS - HOVER TEXT CONTRAST
========================================== */

.portfolio-button:hover,
.portfolio-button:hover a,
.portfolio-tab:hover,
.portfolio-tab:hover a,
.portfolio-tab.active,
.portfolio-tab.active a,
.s-btn:hover,
.btn:hover,
button:hover {
    color: #E2DBD2 !important;
}

/* mantém ícones brancos também */
.portfolio-button:hover svg,
.portfolio-tab:hover svg,
.s-btn:hover svg,
.btn:hover svg,
button:hover svg {
    fill: #E2DBD2 !important;
}


/* ---------------------------------------------- */

/* IDIOMAS NO MENU */

.lang-item {
    display: inline-block;
    margin-right: 18px;
}

.lang-link {
    color: #E2DBD2;
    font-size: 18px;
    font-weight: 700;
    text-decoration: none;
    transition: opacity .3s ease;
}

.lang-link:hover {
    opacity: .7;
}

/* idioma ativo */
.lang-link.active {
    color: #F1452E;
}

/* manter todos na mesma linha */
.header-nav__links .lang-item {
    margin-top: 20px;
}

/* ------------------------------------------------- */


/* FOOTER SOCIAL FONT AWESOME */

.s-footer__social {
    display: flex;
    gap: 18px;
    align-items: center;
    margin-top: 40px;
}

.s-footer__social li {
    list-style: none;
}

.s-footer__social a {
    color: #E2DBD250;
    font-size: 27px;
    transition: .3s ease;
}

.s-footer__social a:hover {
    color: #E2DBD2;
}


/* ==========================================
   FOOTER FULL WIDTH BACKGROUND
========================================== */

.s-footer {
    position: relative;
    z-index: 1;
}

.s-footer::before {
    content: "";

    position: absolute;
    top: 0;
    bottom: 0;

    left: 50%;
    transform: translateX(-50%);

    width: 100vw;

    background: #090a0a;

    z-index: -1;
}



/* ---------------------------------------------------- */


/* SERVICES */

.services-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:80px 40px;
    margin-top:80px;
 }

.service-card{
    text-align:left;
}

.service-icon{
    font-size:42px;
    color:#E2DBD24a;
    margin-bottom:24px;
}

.service-card h3{
    color:#fff;
    font-size:24px;
    font-weight:600;
    margin-bottom:20px;
}

.service-card p{
    color:#bdbdbd;
    line-height:1.8;
}

@media(max-width:1000px){

    .services-grid{
        grid-template-columns:repeat(2,1fr);
 
    }

}

@media(max-width:700px){

    .services-grid{
        grid-template-columns:1fr;
 
    }

}

/* ----------------------------------------------------- */

/* PORTFOLIO BUTTON */

.portfolio-button-wrap{
    display:flex;
    justify-content:center;
    margin-top:80px;
    margin-bottom: 60px;
}

.portfolio-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    min-width:260px;
    height:60px;

    padding:0 40px;

    border:1px solid rgba(255,255,255,.2);

    color:#fff;
    text-decoration:none;
    font-size:14px;
    font-weight:500;
    letter-spacing:.08em;
    text-transform:uppercase;

    transition:all .3s ease;
}

.portfolio-button:hover{
    background:#F1452E;
    border-color:#F1452E;
    color:#fff;
        margin-bottom: 65px;

    
}


/* -------------------------------------------------- */


/* ==========================================
   ABOUT V2 - FINAL LAYOUT
========================================== */

#about.container {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 140px 0 !important;

    background: #FFFEFD !important;
    color: #111111 !important;

    position: relative;
    overflow: hidden;
}

#about::before,
#about::after {
    display: none !important;
}

.about-v2 {
    max-width: 1280px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: 1.1fr .9fr;
    align-items: center;
    gap: 110px;

    padding-left: var(--gutter);
    padding-right: var(--gutter);
}

.about-v2__media {
    position: relative;
}

.about-v2__photo {
    width: 100%;
    display: block;

    filter: grayscale(100%);
    transition: transform .8s ease;
}

.about-v2__media:hover .about-v2__photo {
    transform: scale(1.015);
}

.about-v2__mark {
    position: absolute;

    width: 260px;

    top: -70px;
    left: -70px;

    opacity: .16;

    z-index: 2;

    animation: trendsRotate 80s linear infinite;
    transform-origin: center;
}

.about-v2__content {
    max-width: 580px;
}

.about-v2__eyebrow {
    display: block;

    margin-bottom: 10px;

    color: #111111 !important;

    font-size: 18px;
    font-weight: 500;
}

.about-v2__content h2 {
    color: #111111 !important;

    font-size: clamp(52px, 6vw, 92px);
    line-height: .95;

    margin-bottom: 48px;
}

.about-v2__content p {
    color: #111111 !important;

    font-size: 17px;
    line-height: 1.55;

    margin-bottom: 28px;
}

@keyframes trendsRotate {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Tablet */

@media screen and (max-width: 1100px) {

    #about.container {
        padding: 120px 0 !important;
    }

    .about-v2 {
        grid-template-columns: 1fr;
        gap: 70px;
        max-width: 760px;
    }

    .about-v2__mark {
        width: 230px;
        top: -65px;
        left: -60px;
    }

    .about-v2__content {
        max-width: 100%;
    }

}

/* Mobile */

@media screen and (max-width: 700px) {

    #about.container {
        padding: 90px 0 !important;
    }

    .about-v2 {
        gap: 52px;
        padding-left: 28px;
        padding-right: 28px;
    }

    .about-v2__mark {
        width: 190px;
        top: -52px;
        left: -48px;
        opacity: .14;
    }

    .about-v2__content h2 {
        font-size: 42px;
        margin-bottom: 34px;
    }

    .about-v2__content p {
        font-size: 16px;
        line-height: 1.6;
    }

}





/* ==========================================
   ABOUT V2 - RESPONSIVE IMAGE + STATIC MARK
========================================== */

/* remove rotação do vector */
.about-v2__mark {
    animation: none !important;
    transform: rotate(-8deg) !important;
}

/* garante que o picture respeita o layout */
.about-v2__media picture {
    display: block;
}

.about-v2__media picture img {
    width: 100%;
    display: block;
}

/* Desktop */
@media screen and (min-width: 1101px) {

    .about-v2__mark {
        width: 260px;
        top: -62px;
        left: -74px;
        opacity: .16;
    }

}

/* Tablet */
@media screen and (min-width: 701px) and (max-width: 1100px) {

    .about-v2__mark {
        width: 230px;
        top: -62px;
        left: -62px;
        opacity: .14;
    }

}

/* Mobile */
@media screen and (max-width: 700px) {

    .about-v2__mark {
        width: 185px;
        top: -48px;
        left: -42px;
        opacity: .14;
    }

}



/* --------------------------------------------- */

/* ==========================================
   PORTFOLIO FILTER BUTTONS
========================================== */

.portfolio-tabs{

    display:flex;
    justify-content:center;
    align-items:center;
    flex-wrap:wrap;
    border-radius: 0px;
    gap:16px;
    margin-bottom:70px;
}

.portfolio-tab{

    min-width:220px;
    height:56px;

    padding:0 30px;
    border-radius: 0px;

    background:transparent;

    border:1px solid rgba(255,255,255,.25);

    color:#E2DBD2;

    font-size:13px;
    font-weight:600;

    letter-spacing:.12em;
    text-transform:uppercase;

    cursor:pointer;

    transition:.25s ease;
}

.portfolio-tab:hover{

    border-color:#E2DBD2;

}

/* ativo */

.portfolio-tab.active{

    background:#E2DBD2;
    color:#000000;

    border-color:#E2DBD2;

}

/* remove estilos antigos */

.portfolio-tab.active::after{
    display:none;
}

/* mobile */

@media(max-width:768px){

    .portfolio-tab{

        min-width:160px;
        height:50px;

        font-size:12px;

    }

}

.gallery-items__item.hidden {
    display: none !important;
}

/* ------------------------------------------------------- */

/* PORTFOLIO PAGE - HEADER SUPPORT */

.portfolio-intro {
    min-height: 120px;
    height: 120px;
    background: #000;
    position: relative;
}

.portfolio-intro-spacer {
    width: 100%;
    height: 100%;
}

/* aproxima o portfolio do topo após o mini hero */

.portfolio-intro + #gallery {
    padding-top: 80px;
}

/* gpt v3 ----------------------------------------------- */

/* ==========================================
   GALLERY SPACING
========================================== */

/* cria espaçamento entre os cards */

.gallery-items.grid-cols{
    row-gap: 22px;
}

.gallery-items .gallery-items__item{
    padding-left: 11px;
    padding-right: 11px;
}

/* mantém as imagens alinhadas com o container */
.gallery-items{
    margin-left: -11px;
    margin-right: -11px;
}


/* ---------------------*/

/* ==========================================
   MENU PANEL - RESPONSIVE WIDTH + RIGHT ALIGN
========================================== */

/* base: mobile = full */
.header-nav {
    width: 100% !important;
    left: auto !important;
    right: 0 !important;

    text-align: right;
}

/* itens alinhados à direita */
.header-nav__links {
    text-align: right;
}

.header-nav__links li {
    text-align: right;
}

.header-nav__links a {
    justify-content: flex-end;
    text-align: right;
}

/* idiomas também à direita */
.header-nav__links .lang-item {
    display: inline-block;
    margin-right: 0;
    margin-left: 18px;
    
}
 
/* tablet = 50% da tela */
@media screen and (min-width: 801px) and (max-width: 1200px) {

    .header-nav {
        width: 25vw !important;
    }

}

/* desktop = 33% da tela */
@media screen and (min-width: 1201px) {

    .header-nav {
        width: 25vw !important;
    }

}

/* ----- CSS ADICIONAL YESCOOKIES  ------------------------- */
/* ==========================================
   COOKIEYES - BRAND COLOR OVERRIDE
========================================== */

/* botões principais do CookieYes */
.cky-btn,
.cky-btn-reject,
.cky-btn-accept,
.cky-btn-customize {
    border-color: #f9f9f9 !important;
}

/* remove azul dos botões Reject / Accept */
.cky-btn-reject,
.cky-btn-accept {
    background-color: #f9f9f9 !important;
    color: #000000 !important;
}

/* botão Customize */
.cky-btn-customize {
    background-color: transparent !important;
    color: #f9f9f9 !important;
}

/* hover dos botões */
.cky-btn-reject:hover,
.cky-btn-accept:hover {
    background-color: #E2DBD2 !important;
    color: #000000 !important;
}

/* links e elementos de destaque do CookieYes */
.cky-consent-container a,
.cky-modal a,
.cky-preference-content-wrapper a,
.cky-accordion-header .cky-always-active,
.cky-show-desc-btn {
    color: #f9f9f9 !important;
}

/* switches/toggles internos */
.cky-switch input:checked + .cky-slider {
    background-color: #f9f9f9 !important;
}

.cky-switch input:checked + .cky-slider::before {
    background-color: #000000 !important;
}

/* bordas e foco */
.cky-btn:focus,
.cky-btn:active {
    box-shadow: none !important;
    outline-color: #f9f9f9 !important;
}

/* ==========================================
   COOKIEYES - SAVE MY PREFERENCES
========================================== */

.cky-btn-preferences{
    background-color: #f9f9f9 !important;
    border-color: #f9f9f9 !important;
    color: #000000 !important;
}

.cky-btn-preferences:hover{
    background-color: #E2DBD2 !important;
    border-color: #E2DBD2 !important;
    color: #000000 !important;
}

/* ==========================================
   COOKIEYES - REVISIT BUTTON
========================================== */

.cky-btn-revisit-wrapper {

    /* preto e branco */
    filter: grayscale(100%) !important;

    /* quase invisível */
    opacity: 0.11 !important;

    /* transição suave */
    transition: opacity .3s ease !important;

}

/* melhora um pouco a descoberta ao hover */
.cky-btn-revisit-wrapper:hover {

    opacity: 0.35 !important;

}

/* garante que o ícone interno também fique monocromático */
.cky-btn-revisit-wrapper img,
.cky-btn-revisit-wrapper svg {

    filter: grayscale(100%) !important;

}

/* ------------------------ */

/* ==========================================
   FAQ SECTION
========================================== */

.s-faq {
    padding-top: var(--vspace-5);
    padding-bottom: var(--vspace-5);
}

.faq-intro {
    max-width: 680px;
    margin-top: 24px;
    color: rgba(255,255,255,.65);
}

.faq-list {
    max-width: 980px;
    margin: 80px auto 0;
    border-top: 1px solid rgba(255,255,255,.16);
}

.faq-item {
    border-bottom: 1px solid rgba(255,255,255,.16);
}

.faq-question {
    width: 100%;
    min-height: 86px;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 40px;

    background: transparent;
    border: none;
    padding: 0;

    color: #fff;
    text-align: left;
    padding-left: 25px;
    padding-right: 25px;

    cursor: pointer;
}

.faq-question span:first-child {
    font-size: 17px;
    font-weight: 600;
    line-height: 1.5;
}

/* ícone animado estilo menu/X */

.faq-icon {
    width: 26px;
    height: 26px;
    position: relative;
    flex: 0 0 26px;
}

.faq-icon::before,
.faq-icon::after {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;

    width: 100%;
    height: 1px;

    background: #fff;
    transition: transform .4s ease, opacity .3s ease;
}

.faq-icon::after {
    transform: rotate(90deg);
}

.faq-item.active .faq-icon::before {
    transform: rotate(45deg);
}

.faq-item.active .faq-icon::after {
    transform: rotate(-45deg);
}

/* resposta */

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height .45s ease;
    padding-left: 25px;
    padding-right: 35px;
}

.faq-answer p {
    max-width: 760px;
    padding-bottom: 34px;
    margin: 0;

    color: rgba(171, 171, 171, 0.568);
    line-height: 1.8;
}


/* ==========================================
   FAQ - HOVER LIGHT
========================================== */

.faq-question:hover,
.faq-question:focus {
    background-color: #c9c9c9 !important;
}

.faq-question:hover span,
.faq-question:focus span {
    color: #111111 !important;
}

/* mantém o ícone + visível */
.faq-question:hover .faq-icon::before,
.faq-question:hover .faq-icon::after,
.faq-question:focus .faq-icon::before,
.faq-question:focus .faq-icon::after {
    background-color: #111111 !important;
}


/* mobile */

@media screen and (max-width: 700px) {

    .faq-list {
        margin-top: 56px;
    }

    .faq-question {
        min-height: 78px;
        gap: 24px;
    }

    .faq-question span:first-child {
        font-size: 15px;
    }

    .faq-answer p {
        font-size: 14px;
    }

}

/* ==========================================
   FAQ - 2 COLUMNS DESKTOP
========================================== */

@media screen and (min-width: 960px) {

    .faq-list {

        display: grid;
        grid-template-columns: repeat(2, 1fr);

        column-gap: 60px;
        row-gap: 0;

        max-width: 1400px;
        margin: 80px auto 0;

        border-top: none;
    }

    .faq-item {

        border-top: 1px solid rgba(255,255,255,.16);
        border-bottom: 1px solid rgba(255,255,255,.16);

    }

}


/* ==========================================
   FAQ - FIX TEXT WRAP IN 2 COLUMNS
========================================== */

.faq-question {
    overflow: visible;
}

.faq-question span:first-child {
    min-width: 0;
    max-width: 100%;
    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
}

.faq-icon {
    flex-shrink: 0;
}

/* troca de cor do BG com scroll ----------------------------- */

 
/* ==========================================
   HEADER / MENU ALWAYS DARK
========================================== */

.s-header,
.header-nav,
body.theme-light .s-header,
body.theme-light .header-nav {
    background-color: #090a0a !important;
    color: #f7f3ed !important;
}

/* textos do menu sempre claros */

.s-header *,
.header-nav *,
body.theme-light .s-header *,
body.theme-light .header-nav * {
    color: #f7f3ed !important;
}

/* idioma ativo mantém destaque */

body.theme-light .lang-link.active,
.lang-link.active {
    color: #F1452E !important;
}

/* linhas do hamburger/X sempre claras */

.header-menu-toggle span,
.header-menu-toggle span::before,
.header-menu-toggle span::after,
body.theme-light .header-menu-toggle span,
body.theme-light .header-menu-toggle span::before,
body.theme-light .header-menu-toggle span::after {
    background-color: #f7f3ed !important;
}

/* footer permanece escuro */

.s-footer,
body.theme-light .s-footer {
    background-color: #090a0a !important;
    color: #f7f3ed !important;
}

.s-footer *,
body.theme-light .s-footer * {
    color: #f7f3ed !important;
}


 /* ==========================================
   MENU WIDTH - MOBILE + TABLET FINAL
========================================== */

/* Mobile = 65% do ecrã */
@media screen and (max-width: 700px) {

    .header-nav {
        width: 65vw !important;
        max-width: 65vw !important;
        min-width: 65vw !important;
        right: 0 !important;
        left: auto !important;
    }

}

/* Tablet = 35% do ecrã */
@media screen and (min-width: 701px) and (max-width: 1200px) {

    .header-nav {
        width: 35vw !important;
        max-width: 35vw !important;
        min-width: 35vw !important;
        right: 0 !important;
        left: auto !important;
    }

}

/* Desktop mantém como está */
@media screen and (min-width: 1201px) {

    .header-nav {
        width: 25vw !important;
        max-width: 25vw !important;
        min-width: 25vw !important;
        right: 0 !important;
        left: auto !important;
    }

}

/* ----------------- animacaos ----------------- */
/* ==========================================
   SCROLL REVEAL ANIMATIONS
========================================== */

.reveal-section .reveal-item {
    opacity: 0;
    transform: translateY(38px);
    filter: blur(8px);

    transition:
        opacity .9s ease,
        transform .9s cubic-bezier(.22, .61, .36, 1),
        filter .9s ease;

    transition-delay: var(--reveal-delay, 0s);
    will-change: opacity, transform, filter;
}

/* estado visível */

.reveal-section.is-visible .reveal-item {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

/* saída suave quando a secção deixa o ecrã */

.reveal-section:not(.is-visible) .reveal-item {
    opacity: 0;
}

/* About - imagem entra pela esquerda */

#about.reveal-section .about-v2__media.reveal-item {
    transform: translateX(-42px);
}

#about.reveal-section.is-visible .about-v2__media.reveal-item {
    transform: translateX(0);
}

/* About - texto entra pela direita */

#about.reveal-section .about-v2__content.reveal-item {
    transform: translateX(42px);
}

#about.reveal-section.is-visible .about-v2__content.reveal-item {
    transform: translateX(0);
}

/* Services - cards com entrada mais editorial */

#services.reveal-section .service-card.reveal-item {
    transform: translateY(52px);
}

#services.reveal-section.is-visible .service-card.reveal-item {
    transform: translateY(0);
}

/* Portfolio - imagens com leve zoom */

#gallery.reveal-section .gallery-items__item.reveal-item {
    transform: translateY(40px) scale(.97);
}

#gallery.reveal-section.is-visible .gallery-items__item.reveal-item {
    transform: translateY(0) scale(1);
}

/* FAQ - entrada mais limpa */

#faq.reveal-section .faq-item.reveal-item {
    transform: translateY(28px);
}

#faq.reveal-section.is-visible .faq-item.reveal-item {
    transform: translateY(0);
}

/* Footer */

#footer.reveal-section .reveal-item {
    transform: translateY(34px);
}

#footer.reveal-section.is-visible .reveal-item {
    transform: translateY(0);
}

/* reduz animações para utilizadores com preferência de acessibilidade */

@media (prefers-reduced-motion: reduce) {

    .reveal-section .reveal-item {
        opacity: 1 !important;
        transform: none !important;
        filter: none !important;
        transition: none !important;
    }

}

/* ==========================================
   PORTFOLIO TAB ACTIVE - DARK TEXT
========================================== */

.portfolio-tab.active,
.portfolio-tab.active a,
.portfolio-tab.active span {
    color: #111111 !important;
}

.portfolio-tab.active * {
    color: #111111 !important;
}

 

 /* ==========================================
   CONTACT FORM V2 - FINAL COMPACT LAYOUT
========================================== */

/* section geral */
.s-contact {
    background: #00000000 !important;
    padding-top: 90px !important;
    padding-bottom: 90px !important;
}

/* centraliza o bloco todo */
.contact-v2 {
    max-width: 1040px !important;
    margin: 0 auto !important;

    display: block !important;

    padding-left: var(--gutter) !important;
    padding-right: var(--gutter) !important;
}

/* cabeçalho centralizado */
.contact-v2__header {
    max-width: 720px;
    margin: 0 auto 72px auto;

    text-align: left;
}

.contact-v2__eyebrow {
    display: block;
    margin-bottom: 5px;
    color: #e2dbd279 !important;

    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: 21px;
    font-weight: 300;
}

.contact-v2__header h2 {
    color: #fff7ec !important;
    font-family: 'Zalando Sans Expanded', sans-serif;
    font-size: clamp(52px, 7vw, 78px);
    font-weight: 500;
    line-height: .98;
    margin-bottom: 28px;
}

.contact-v2__header p {
    max-width: 620px;
    margin: 0 auto;

    color: rgba(233, 229, 224, 0.87) !important;

    font-size: 18px;
    line-height: 1.75;
}

/* formulário centralizado e compacto */
.contact-form-v2 {
    max-width: 880px !important;
    margin: 0 auto !important;

    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;

    column-gap: 24px !important;
    row-gap: 24px !important;
}

/* campos */
.contact-form-v2__field {
    display: flex;
    flex-direction: column;
}

.contact-form-v2__field--full {
    grid-column: 1 / -1 !important;
}

/* labels maiores e mais legíveis */
.contact-form-v2 label {
    margin-bottom: 10px !important;

    color: #E2DBD2 !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    letter-spacing: .04em !important;
    text-transform: none !important;

    line-height: 1.3;
}

/* inputs mais baixos e compactos */
.contact-form-v2 input,
.contact-form-v2 select,
.contact-form-v2 textarea {
    width: 100% !important;

    background: rgba(255, 255, 255, .025) !important;

    border: 1px solid rgba(226, 219, 210, .34) !important;
    border-radius: 0 !important;

    color: #F7F3ED !important;

    font-family: inherit;
    font-size: 15px !important;
    line-height: 1.4;

    padding: 14px 15px !important;

    min-height: 52px !important;

    outline: none !important;
    box-shadow: none !important;

    transition:
        border-color .3s ease,
        background-color .3s ease;
}

/* textarea menor para reduzir scroll */
.contact-form-v2 textarea {
    min-height: 138px !important;
    resize: vertical;
}

/* foco */
.contact-form-v2 input:focus,
.contact-form-v2 select:focus,
.contact-form-v2 textarea:focus {
    background: rgba(255, 255, 255, .045) !important;
    border-color: #E2DBD2 !important;
}

/* select */
.contact-form-v2 select {
    appearance: none;
    cursor: pointer;

    background-image:
        linear-gradient(45deg, transparent 50%, #E2DBD2 50%),
        linear-gradient(135deg, #E2DBD2 50%, transparent 50%) !important;
    background-position:
        calc(100% - 21px) 50%,
        calc(100% - 15px) 50% !important;
    background-size:
        6px 6px,
        6px 6px !important;
    background-repeat: no-repeat !important;
}

.contact-form-v2 select option {
    background: #090a0a !important;
    color: #F7F3ED !important;
}

/* upload compacto */
.contact-form-v2 input[type="file"] {
    min-height: 54px !important;

    border-style: dashed !important;
    border-color: rgba(226, 219, 210, .38) !important;

    cursor: pointer;
}

.contact-form-v2 input[type="file"]::file-selector-button {
    margin-right: 14px;

    background: #E2DBD2 !important;
    border: 1px solid #E2DBD2 !important;

    color: #090a0a !important;

    padding: 8px 13px;

    font-size: 11px;
    font-weight: 800;
    letter-spacing: .06em;
    text-transform: uppercase;

    cursor: pointer;
}

/* texto de ajuda */
.contact-form-v2 small {
    margin-top: 10px !important;

    color: rgba(226, 219, 210, .58) !important;

    font-size: 12px !important;
    line-height: 1.5;
}

/* lista de ficheiros */
.contact-form-v2__file-list {
    margin-top: 14px !important;
    gap: 8px !important;
}

.contact-form-v2__file-item {
    min-height: 44px;

    padding: 9px 12px !important;

    background: rgba(255, 255, 255, .035) !important;
    border: 1px solid rgba(226, 219, 210, .22) !important;

    color: rgba(247, 243, 237, .86) !important;

    font-size: 12px !important;
}

.contact-form-v2__file-name {
    color: rgba(247, 243, 237, .86) !important;
}

.contact-form-v2__file-remove {
    width: 26px !important;
    height: 26px !important;
    flex: 0 0 26px !important;

    border-color: rgba(226, 219, 210, .34) !important;

    color: #E2DBD2 !important;
    font-size: 16px !important;
}

.contact-form-v2__file-remove:hover {
    background: #E2DBD2 !important;
    border-color: #E2DBD2 !important;
    color: #090a0a !important;
}

.contact-form-v2__file-counter {
    margin-top: 8px !important;

    color: rgba(226, 219, 210, .58) !important;

    font-size: 12px !important;
}

/* botão centralizado */
.contact-form-v2__actions {
    grid-column: 1 / -1 !important;

    display: flex;
    justify-content: center;

    margin-top: 18px !important;
}

.contact-form-v2__button {
    min-width: 230px !important;
    height: 56px !important;

    display: inline-flex !important;
    align-items: center;
    justify-content: center;

    background: transparent !important;
    border: 1px solid rgba(226, 219, 210, .42) !important;

    color: #E2DBD2 !important;

    font-size: 12px !important;
    font-weight: 800 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase;

    cursor: pointer;

    transition:
        background-color .3s ease,
        border-color .3s ease,
        color .3s ease,
        opacity .3s ease;
}

.contact-form-v2__button:hover {
    background: #E2DBD2 !important;
    border-color: #E2DBD2 !important;
    color: #090a0a !important;
}

.contact-form-v2__button.is-loading {
    background: rgba(226, 219, 210, .10) !important;
    color: #E2DBD2 !important;
}

/* status centralizado */
.contact-form-v2__status {
    grid-column: 1 / -1 !important;

    min-height: 22px;

    margin-top: 4px;

    text-align: center;

    font-size: 14px !important;
    font-weight: 600 !important;
    line-height: 1.5;
}

.contact-form-v2__status.is-success {
    color: #53D878 !important;
}

.contact-form-v2__status.is-error {
    color: #F1452E !important;
}

/* honeypot */
.contact-form-v2__honeypot {
    display: none !important;
}

/* tablet: ainda mantém 2 colunas para reduzir scroll */
@media screen and (min-width: 701px) and (max-width: 1100px) {

    .s-contact {
        padding-top: 120px !important;
        padding-bottom: 120px !important;
    }

    .contact-v2 {
        max-width: 860px !important;
    }

    .contact-form-v2 {
        max-width: 760px !important;
        column-gap: 20px !important;
        row-gap: 22px !important;
    }

}

/* mobile: 1 coluna */
@media screen and (max-width: 700px) {

    .s-contact {
        padding-top: 90px !important;
        padding-bottom: 90px !important;
    }

    .contact-v2 {
        padding-left: 28px !important;
        padding-right: 28px !important;
    }

    .contact-v2__header {
        margin-bottom: 52px;
        text-align: left;
    }

    .contact-v2__header p {
        margin-left: 0;
        margin-right: 0;
    }

    .contact-form-v2 {
        grid-template-columns: 1fr !important;
        max-width: 100% !important;

        row-gap: 24px !important;
    }

    .contact-form-v2 label {
        font-size: 14px !important;
    }

    .contact-form-v2 input,
    .contact-form-v2 select,
    .contact-form-v2 textarea {
        min-height: 52px !important;
        font-size: 15px !important;
    }

    .contact-form-v2 textarea {
        min-height: 150px !important;
    }

    .contact-form-v2__actions {
        justify-content: stretch;
    }

    .contact-form-v2__button {
        width: 100% !important;
        min-width: 100% !important;
    }

    .contact-form-v2__status {
        text-align: left;
    }

}