/* ==========================================================================
   DEFINIÇÃO TERRENA — camada de experiência
   O telemóvel não é o computador encolhido: listas viram faixas de deslize,
   a narrativa vira um baralho de cartões que se empilham, e o passo seguinte
   (visita, WhatsApp) fica sempre ao alcance do polegar.
   Carregar depois de main.css e da folha da página.
   ========================================================================== */

/* ---------------------------------------------------------------------- */
/* Correções gerais (todas as larguras)                                     */
/* ---------------------------------------------------------------------- */

/* A coluna do hero não pode crescer para caber texto em nowrap: era isso que
   empurrava título e lead para fora do ecrã no telemóvel. */
.hero{ grid-template-columns:minmax(0,1fr); }

/* As revelações em escala (scale 1.08) saem uns píxeis para fora do ecrã
   antes de entrarem; no telemóvel isso bastava para o browser afastar o zoom
   da página inteira. clip corta sem criar contentor de scroll (o sticky
   continua a funcionar). */
main{ overflow-x:clip; }

/* Aproximação lenta da imagem do hero: dá vida ao primeiro ecrã sem vídeo */
.hero-media img{ animation:dt-approach 16s cubic-bezier(.2,.7,.2,1) both; }
@keyframes dt-approach{ from{ transform:scale(1.12); } to{ transform:scale(1); } }

/* Texto corrido em secções escuras: nunca grafite sobre preto */
.section-dark .type-body:not(.esm-note), .section-graphite .type-body:not(.esm-note){ color:rgba(246,243,236,.72); }

/* Páginas sem hero escuro: a barra de navegação nasce já com fundo, senão o
   menu (claro) desaparece sobre o fundo creme */
.nav-solid .site-nav::before{ opacity:1; }

/* Barra de ação: escondida fora do telemóvel */
.action-dock{ display:none; }
.snap-ui{ display:none; }
.concept-steps{ display:none; }
.quick-actions{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:2.2rem; }
.qa{
  display:inline-flex; align-items:center; gap:.7rem;
  padding:.95rem 1.3rem; border:1px solid rgba(137,227,210,.28);
  background:rgba(246,243,236,.04); color:var(--stone-100);
  font-family:var(--font-sans); font-size:.76rem; text-transform:uppercase; letter-spacing:.14em;
  transition:background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast);
}
.qa svg{ width:20px; height:20px; color:var(--teal-400); flex:none; transition:color var(--dur-fast); }
.qa:hover{ background:var(--teal-400); border-color:var(--teal-400); color:var(--ink); }
.qa:hover svg{ color:var(--ink); }

/* Menu: rodapé de contactos só existe no menu móvel */
.nav-foot{ display:none; }

/* ======================================================================== */
/* TABLET E TELEMÓVEL                                                       */
/* ======================================================================== */
@media (max-width:860px){

  /* ---- Menu em ecrã inteiro ------------------------------------------ */
  .site-nav .brand{ position:relative; z-index:202; }
  .nav-links{
    inset:0; width:100%; height:100dvh;
    background:
      linear-gradient(180deg, rgba(12,18,20,.0), rgba(12,18,20,.0)),
      radial-gradient(120% 70% at 100% 0%, rgba(94,207,180,.10), transparent 60%),
      var(--ink);
    padding:6.2rem var(--gutter) calc(2rem + env(safe-area-inset-bottom));
    gap:0; justify-content:flex-start;
    transform:none; clip-path:inset(0 0 100% 0);
    transition:clip-path .7s var(--ease-in-out);
  }
  .nav-links.is-open{ clip-path:inset(0 0 0 0); transform:none; }
  .nav-links > a, .nav-links .nav-top{
    display:block; width:100%;
    font-size:clamp(1.9rem, 9vw, 2.6rem); font-weight:500; letter-spacing:-.005em; line-height:1;
    padding:1.05rem 0; border-bottom:1px solid rgba(246,243,236,.09);
  }
  .nav-links a::after{ display:none; }
  .nav-item.has-sub{ gap:0; border-bottom:1px solid rgba(246,243,236,.09); padding-bottom:1rem; }
  .nav-item.has-sub .nav-top{ border-bottom:0; }
  .nav-sub{ align-self:stretch; border-left:1px solid rgba(137,227,210,.3); padding-left:1rem; gap:.95rem; margin-top:.1rem; }
  .nav-sub a{ flex-direction:row; align-items:baseline; justify-content:space-between; width:100%; padding:0; }
  .nav-sub .p-name{ font-size:1.02rem; letter-spacing:.08em; }
  .nav-sub .p-state{ font-size:.6rem; }

  /* entrada escalonada dos itens */
  .nav-links > *{ opacity:0; transform:translateY(18px); transition:opacity .5s var(--ease-out), transform .6s var(--ease-out); }
  .nav-links.is-open > *{ opacity:1; transform:none; }
  .nav-links.is-open > *:nth-child(1){ transition-delay:.18s; }
  .nav-links.is-open > *:nth-child(2){ transition-delay:.24s; }
  .nav-links.is-open > *:nth-child(3){ transition-delay:.30s; }
  .nav-links.is-open > *:nth-child(4){ transition-delay:.36s; }
  .nav-links.is-open > *:nth-child(5){ transition-delay:.44s; }

  .nav-foot{
    display:flex; flex-direction:column; gap:.75rem; margin-top:auto; padding-top:2rem;
  }
  .nav-foot .nf-label{ font-size:.66rem; text-transform:uppercase; letter-spacing:.18em; color:var(--teal-400); margin-bottom:.2rem; }
  .nav-foot a{ font-size:1rem !important; text-transform:none !important; letter-spacing:.01em !important; color:rgba(246,243,236,.8); padding:0 !important; border:0 !important; }
  .nav-foot .nf-wa{
    display:inline-flex !important; align-items:center; gap:.6rem; align-self:flex-start;
    margin-top:.6rem; padding:.85rem 1.2rem !important; border:1px solid rgba(137,227,210,.35) !important;
    color:var(--teal-300) !important; font-size:.78rem !important; text-transform:uppercase !important; letter-spacing:.14em !important;
  }
  .nav-foot svg{ width:18px; height:18px; }
  body.menu-open{ overflow:hidden; }
  body.menu-open .site-nav::before{ opacity:0; }
  body.menu-open .fab-contact, body.menu-open .action-dock{ opacity:0 !important; pointer-events:none !important; }

  /* ---- Rodapé ---------------------------------------------------------- */
  .footer-grid{ grid-template-columns:1fr 1fr; row-gap:2.4rem; }
  .footer-grid > div:first-child, .footer-grid > div:last-child{ grid-column:1 / -1; }
  .footer-grid > div:last-child li{ margin-bottom:0; }
  .footer-grid > div:last-child a{
    display:flex; align-items:center; justify-content:space-between;
    padding:1rem 0; border-bottom:1px solid rgba(246,243,236,.1); font-size:1rem; color:var(--stone-100);
  }
  .footer-grid > div:last-child a::after{ content:'↗'; color:var(--teal-400); font-size:.9rem; }
  .footer-grid > div:last-child li:last-child{ padding-top:1rem; color:rgba(246,243,236,.55); font-size:.9rem; }
  .footer-bottom{ flex-direction:column; align-items:flex-start; gap:.4rem; }
}

/* ======================================================================== */
/* TELEMÓVEL                                                                */
/* ======================================================================== */
@media (max-width:760px){

  :root{ --section-pad:4.5rem; }

  /* ---- Tipografia mais afirmativa ------------------------------------ */
  .type-display{ font-size:clamp(2.6rem, 12vw, 4.4rem); line-height:.9; }
  .type-h2{ font-size:clamp(2rem, 9.4vw, 3rem); line-height:.95; }
  .type-editorial{ font-size:clamp(1.55rem, 6.6vw, 2.2rem); }
  .type-body{ font-size:1rem; }

  /* ---- Hero ----------------------------------------------------------- */
  .hero{ min-height:100svh; }
  .hero-ruler .pill, .hero-ruler .line{ display:none; }
  .hero-ruler .tag{ white-space:normal; line-height:1.6; }
  .hero-top{ padding-top:5.4rem; }
  .hero-kicker{ align-items:center; gap:.7rem; }
  .hero-kicker .idx{ padding:.25em .5em; background:rgba(12,18,20,.35); }
  .hero-kicker .type-label{ font-size:.64rem; letter-spacing:.16em; }
  .hero-title .accent{ font-size:.5em; margin-top:.35em; line-height:1.12; }
  .hero-sub{ margin-top:1.2rem; font-size:1.06rem; }
  .hero-actions{ flex-direction:column; align-items:stretch; gap:.7rem; margin-top:1.8rem; }
  .hero-actions .btn{ justify-content:space-between; padding:1.15em 1.4em; }
  .hero-grid-lines{ opacity:.18; }
  .hero-bottom{ display:none; }
  .page-hero{ min-height:88svh; }

  /* números do Oliveira Plaza: faixa de vidro */
  .op-hero-facts{
    grid-template-columns:repeat(2,1fr); gap:0; row-gap:0;
    margin-inline:var(--gutter); padding:0; margin-bottom:1.4rem;
    border:1px solid rgba(246,243,236,.14);
    background:rgba(12,18,20,.42); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px);
  }
  .op-hero-facts > div{ padding:1rem 1.1rem; }
  .op-hero-facts > div::before{ display:none; }
  .op-hero-facts > div:nth-child(odd){ border-right:1px solid rgba(246,243,236,.12); }
  .op-hero-facts > div:nth-child(-n+2){ border-bottom:1px solid rgba(246,243,236,.12); }
  .op-hero-facts .num{ font-size:1.5rem; }
  .op-hero-facts .cap{ font-size:.6rem; }
  .op-hero .hero-content{ padding-bottom:1.4rem; }

  /* ---- Etiqueta de secção --------------------------------------------- */
  .section-tag{ margin-bottom:1.6rem; }
  .section-tag .line{ flex-basis:1.6rem; }
  .section-tag .label{ font-size:.64rem; letter-spacing:.18em; }

  /* ---- Faixas de deslize ---------------------------------------------- */
  .m-snap{
    display:grid !important;
    grid-template-columns:none !important; grid-template-rows:none !important;
    grid-auto-flow:column; grid-auto-columns:84%; grid-auto-rows:auto !important;
    gap:.8rem !important; row-gap:0 !important;
    overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory; scroll-padding-inline:var(--gutter);
    margin-inline:calc(var(--gutter) * -1); padding:.25rem var(--gutter) .4rem;
    scrollbar-width:none; -webkit-overflow-scrolling:touch;
  }
  .m-snap::-webkit-scrollbar{ display:none; }
  .m-snap > *{ scroll-snap-align:start; min-width:0; margin:0 !important; }
  /* dentro da faixa a entrada é da faixa inteira, não de cada cartão */
  .m-snap > [data-reveal]{ opacity:1; transform:none; }
  .m-snap > *{ animation:none; }
  .m-snap:not(.is-in) > *{ opacity:0; }
  /* ... mas o is-in vem do script. Sem ele, as faixas horizontais ficavam
     todas vazias, que era o pior caso de todos: a página parece carregada e
     tem secções em branco. */
  .no-js .m-snap:not(.is-in) > *,
  .js-falhou .m-snap:not(.is-in) > *{ opacity:1; }
  .m-snap.is-in > *{ animation:dt-snap-in .9s var(--ease-out) both; }
  .m-snap.is-in > *:nth-child(2){ animation-delay:.08s; }
  .m-snap.is-in > *:nth-child(3){ animation-delay:.16s; }
  .m-snap.is-in > *:nth-child(n+4){ animation-delay:.24s; }
  @keyframes dt-snap-in{ from{ opacity:0; transform:translateX(42px); } to{ opacity:1; transform:none; } }

  .snap-ui{
    display:flex; align-items:center; gap:1rem; margin-top:1.1rem;
    font-family:var(--font-sans); font-size:.66rem; text-transform:uppercase; letter-spacing:.16em;
    color:var(--graphite-600);
  }
  .snap-count{ font-variant-numeric:tabular-nums; flex:none; }
  .snap-count b{ font-weight:600; color:var(--teal-700); }
  .snap-bar{ position:relative; flex:1; height:1px; background:rgba(38,74,90,.2); overflow:hidden; }
  .snap-bar i{ position:absolute; left:0; top:-1px; height:3px; background:var(--teal-500); transition:transform .25s var(--ease-out); }
  .snap-hint{ display:inline-flex; align-items:center; gap:.5rem; flex:none; transition:opacity .4s; }
  .snap-hint svg{ width:18px; height:9px; animation:dt-nudge 1.8s ease-in-out infinite; }
  .snap-ui.is-used .snap-hint{ opacity:0; }
  @keyframes dt-nudge{ 0%,100%{ transform:none; } 50%{ transform:translateX(5px); } }
  .section-dark .snap-ui, .section-graphite .snap-ui{ color:rgba(246,243,236,.5); }
  .section-dark .snap-count b, .section-graphite .snap-count b{ color:var(--teal-400); }
  .section-dark .snap-bar, .section-graphite .snap-bar{ background:rgba(246,243,236,.16); }

  /* Cartões de argumento: cartaz com o número em grande */
  .m-snap > .usp-card, .m-snap > .pillar, .m-snap > .method-card{
    display:flex; flex-direction:column;
    min-height:19rem; padding:1.4rem 1.35rem 1.5rem;
    background:rgba(255,255,255,.55);
    border:1px solid rgba(38,74,90,.13); border-top:2px solid var(--teal-500);
  }
  .m-snap > * .usp-num, .m-snap > * .pillar-num{
    font-size:3.4rem; font-weight:600; line-height:.9; letter-spacing:-.03em;
    color:var(--teal-500); margin:0 0 auto; padding-bottom:2rem;
  }
  .m-snap > .method-card h3, .m-snap > .usp-card h3, .m-snap > .pillar h3{ margin:0 0 .7rem; font-size:1.35rem; }
  .m-snap > * .type-body{ font-size:.95rem; line-height:1.6; }

  /* Perfis */
  .m-snap > .profile{ padding:1.6rem 1.4rem; min-height:15rem; display:flex; flex-direction:column; justify-content:flex-end; }
  .m-snap > .profile h3{ font-size:1.3rem; }

  /* Tipologias */
  .typ-grid.m-snap{ grid-auto-columns:86%; padding-top:.35rem; }
  .typ-card{ background:var(--stone-200); }
  .typ-card .typ-media, .typ-card--feature .typ-media{ aspect-ratio:4/5; }
  .typ-card .typ-body, .typ-card--wide .typ-body{ padding:1.2rem 1.25rem 1.4rem; background:transparent; }
  .typ-tag{ font-size:2.4rem; font-weight:600; line-height:1; letter-spacing:-.02em; color:var(--teal-500); }
  .typ-body h3{ font-size:1.2rem; }
  .plan-block{ gap:1.4rem; }

  /* Galeria */
  .gallery-grid.m-snap{ grid-auto-columns:80%; }
  .gallery-grid.m-snap .g-item{ grid-column:auto !important; grid-row:auto !important; aspect-ratio:4/5; }
  .gallery-grid.m-snap .g-item figcaption{ opacity:1; transform:none; padding:1.2rem 1.1rem; font-size:.72rem; }

  /* ---- Processo: linha do tempo vertical ----------------------------- */
  .process-steps{
    grid-template-columns:1fr !important; gap:0 !important; row-gap:0 !important;
    position:relative; padding-left:3.6rem;
  }
  .process-steps::before{
    content:''; position:absolute; left:1.2rem; top:1.2rem; bottom:1.6rem; width:1px;
    background:rgba(38,74,90,.18);
  }
  .process-steps::after{
    content:''; position:absolute; left:1.2rem; top:1.2rem; bottom:1.6rem; width:1px;
    background:var(--teal-500); transform-origin:top; transform:scaleY(1);
  }
  @supports (animation-timeline: view()){
    .process-steps::after{
      transform:scaleY(0);
      animation:dt-grow linear both; animation-timeline:view(); animation-range:entry 40% cover 65%;
    }
    @keyframes dt-grow{ to{ transform:scaleY(1); } }
  }
  .process-step{ border-top:0 !important; padding:0 0 2.4rem !important; }
  .process-step:last-child{ padding-bottom:0 !important; }
  .process-num{
    position:absolute; left:-3.6rem; top:-.2rem;
    width:2.4rem; height:2.4rem; border-radius:50%; z-index:1;
    display:grid; place-items:center;
    font-size:.82rem !important; font-weight:600; color:var(--teal-700) !important;
    border:1px solid var(--teal-500); background:var(--stone-100);
    margin:0 !important;
  }
  .section-stone .process-num{ background:var(--stone-200); }
  .process-step h3{ font-size:1.25rem; margin-bottom:.5rem; }

  /* ---- Conceito (página inicial): os quatro estados em grelha -------- */
  .concept-diagram{ display:none; }
  .concept-steps{
    display:grid; grid-template-columns:1fr 1fr; gap:.7rem;
    margin:2.6rem 0 0; padding:0; list-style:none; counter-reset:cs;
  }
  .concept-steps li{
    position:relative; aspect-ratio:1/1.08;
    display:flex; flex-direction:column; justify-content:flex-end;
    padding:1rem; background:rgba(255,255,255,.55); border:1px solid rgba(38,74,90,.13);
  }
  .concept-steps svg{ position:absolute; inset:14% 18% 30%; width:64%; height:56%; overflow:visible; }
  .concept-steps .n{ font-size:.66rem; letter-spacing:.14em; color:var(--teal-700); }
  .concept-steps b{ font-weight:600; text-transform:uppercase; letter-spacing:.04em; font-size:1.05rem; }
  .concept-steps li:last-child{ background:var(--ink); color:var(--stone-100); border-color:var(--ink); }
  .concept-steps li:last-child .n{ color:var(--teal-400); }
  /* desenho progressivo */
  .concept-steps .draw{ stroke-dasharray:400; stroke-dashoffset:400; transition:stroke-dashoffset 1.6s var(--ease-out); }
  .concept-steps .fill{ opacity:0; transform:translateY(8px); transition:opacity .9s var(--ease-out), transform .9s var(--ease-out); transform-box:fill-box; }
  .concept-steps.is-visible .draw{ stroke-dashoffset:0; }
  .concept-steps.is-visible .fill{ opacity:1; transform:none; }
  .concept-steps.is-visible li:nth-child(2) *{ transition-delay:.25s; }
  .concept-steps.is-visible li:nth-child(3) *{ transition-delay:.5s; }
  .concept-steps.is-visible li:nth-child(4) *{ transition-delay:.75s; }

  /* ---- Antes / depois: mais alto, para ter peso no ecrã --------------- */
  .compare{ aspect-ratio:4/5; }
  .compare .handle .grip{ width:52px; height:52px; }

  /* ---- Oliveira Plaza: a narrativa como baralho de cartões ------------ */
  .narrative-film{ margin-bottom:2.4rem; }
  .narrative-film figcaption{ font-size:.64rem; line-height:1.6; }
  .narrative-steps{ padding-inline:var(--gutter); }
  .n-step{
    position:sticky; top:4.4rem;
    height:min(64svh, 560px); margin-bottom:1rem;
    overflow:hidden; background:var(--ink);
    box-shadow:0 -24px 48px -24px rgba(0,0,0,.9);
    opacity:1 !important; transform:none !important;
  }
  .n-step:nth-child(2){ top:4.9rem; }
  .n-step:nth-child(3){ top:5.4rem; }
  .n-step:nth-child(4){ top:5.9rem; }
  .n-step:nth-child(5){ top:6.4rem; }
  .n-step:nth-child(6){ top:6.9rem; }
  .n-step .n-media{ position:absolute; inset:0; height:100%; min-height:0; max-height:none; clip-path:none !important; }
  .n-step .n-media img{ transform:scale(1.08); }
  .n-step .n-media.is-visible img{ transform:scale(1); }
  /* o texto vive no topo do cartão: quando o cartão seguinte sobe e o tapa
     por baixo, o que se está a ler é a última coisa a desaparecer */
  .n-step::after{
    content:''; position:absolute; inset:0; z-index:1; pointer-events:none;
    background:linear-gradient(180deg, rgba(9,14,16,.95) 0%, rgba(9,14,16,.72) 34%, rgba(9,14,16,0) 66%);
  }
  .n-step .n-copy{
    position:absolute; left:0; right:0; top:0; z-index:2;
    margin:0; max-width:none; padding:1.4rem 1.35rem;
  }
  .n-num{ font-size:.72rem; letter-spacing:.14em; margin-bottom:.5rem; }
  .n-num::after{ content:' / 05'; color:rgba(246,243,236,.4); }
  .n-copy h3{ font-size:1.7rem; margin-bottom:.6rem; }
  .n-copy p{
    background:none; backdrop-filter:none; -webkit-backdrop-filter:none;
    padding:0; border:0; max-width:none;
    font-size:.95rem; line-height:1.55; color:rgba(246,243,236,.8);
  }
  .n-step:last-child{ margin-bottom:0; }

  /* ---- Especificações -------------------------------------------------- */
  .specs-list li{ font-size:.95rem; padding:.95rem 0; }
  .specs-gallery{ gap:.6rem; }

  /* ---- Localização ---------------------------------------------------- */
  .section-video-strip{ height:auto; min-height:76svh; align-items:flex-end; padding-bottom:3rem; }
  .vs-scrim{ background:linear-gradient(180deg, rgba(12,18,20,.25), rgba(12,18,20,.35) 35%, rgba(12,18,20,.92)); }
  .marquee span{ padding:1rem 1.6rem; font-size:.74rem; gap:1.2rem; }
  .map-embed{ aspect-ratio:1/1; }

  /* ---- Filme ---------------------------------------------------------- */
  .film-player{ aspect-ratio:4/5; }
  .film-poster img{ object-position:50% 50%; }
  .film-meta{ font-size:.62rem; }

  /* ---- CTA final ------------------------------------------------------ */
  .op-cta{ min-height:92svh; align-items:flex-end; padding-bottom:3.2rem; }
  .op-cta .type-display{ font-size:clamp(2.4rem, 11vw, 3.6rem); }

  /* ---- Projetos -------------------------------------------------------- */
  .proj-media img{ aspect-ratio:4/5; }
  .proj-facts li{ font-size:.62rem; }
  .flagship-head{ margin-bottom:2rem; }

  /* ---- Investir: destaque ---------------------------------------------- */
  .flagship-media{ aspect-ratio:4/5; margin-inline:0; }
  .flagship-overlay{ bottom:1.6rem; }
  .flagship-overlay .type-lede{ font-size:1.02rem; }

  /* ---- A Definição: números ------------------------------------------- */
  .flagship-stats--light{ grid-template-columns:1fr !important; row-gap:1.4rem; }
  .flagship-stats--light .stat .num{ font-size:clamp(1.8rem, 8vw, 2.6rem); }

  /* ---- Contactos ------------------------------------------------------ */
  .contact-hero{ padding-top:7.5rem; }
  .contact-logo-anim{ display:none; }
  .quick-actions{ display:grid; grid-template-columns:repeat(3,1fr); gap:.5rem; margin-top:2rem; }
  .qa{ flex-direction:column; justify-content:center; gap:.65rem; padding:1.15rem .4rem; font-size:.64rem; letter-spacing:.12em; }
  .qa svg{ width:24px; height:24px; }
  .ci-link.type-h3{ font-size:1.15rem; overflow-wrap:anywhere; }
  .contact-form input, .contact-form select, .contact-form textarea{ font-size:16px; padding:1em 1em; }
  .contact-form .btn{ width:100%; justify-content:space-between; }

  /* ---- Ação flutuante -------------------------------------------------- */
  .fab-btn{ padding:0; width:54px; height:54px; justify-content:center; }
  .fab-contact{ bottom:calc(1.1rem + var(--selo, 0px)); }
  .fab-btn .fab-label{ display:none; }
  .fab-btn svg{ width:22px; height:22px; }
  .has-dock .fab-contact{ display:none; }

  .action-dock{
    position:fixed; z-index:250;
    left:.6rem; right:.6rem; bottom:calc(.6rem + env(safe-area-inset-bottom) + var(--selo, 0px));
    display:flex; align-items:center; gap:.5rem;
    padding:.45rem .45rem .45rem 1rem;
    background:rgba(12,18,20,.86);
    backdrop-filter:blur(16px) saturate(150%); -webkit-backdrop-filter:blur(16px) saturate(150%);
    border:1px solid rgba(137,227,210,.2);
    box-shadow:0 18px 40px -16px rgba(0,0,0,.6);
    opacity:0; transform:translateY(130%); pointer-events:none;
    transition:opacity .45s var(--ease-out), transform .55s var(--ease-out);
  }
  .action-dock.is-visible{ opacity:1; transform:none; pointer-events:auto; }
  .ad-id{ display:flex; flex-direction:column; min-width:0; flex:1; }
  .ad-title{ font-family:var(--font-sans); font-weight:600; font-size:.86rem; text-transform:uppercase; letter-spacing:.04em; color:var(--stone-100); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .ad-sub{ font-size:.62rem; text-transform:uppercase; letter-spacing:.12em; color:var(--teal-400); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .ad-cta{
    display:inline-flex; align-items:center; gap:.55rem; flex:none;
    height:46px; padding:0 1rem;
    background:var(--teal-400); color:var(--ink);
    font-family:var(--font-sans); font-weight:500; font-size:.7rem; text-transform:uppercase; letter-spacing:.1em;
  }
  .ad-cta svg{ width:16px; height:8px; }
  .ad-wa{ display:grid; place-items:center; flex:none; width:46px; height:46px; border:1px solid rgba(137,227,210,.35); color:var(--teal-400); }
  .ad-wa svg{ width:21px; height:21px; }
  .page-esmeralda .ad-cta{ background:var(--esm-400); }
  .page-esmeralda .ad-sub, .page-esmeralda .ad-wa{ color:var(--esm-400); }
  .page-esmeralda .ad-wa{ border-color:rgba(49,200,149,.4); }

  /* ---- Esmeralda ------------------------------------------------------ */
  /* No telemóvel a cena abstrata ficava um ponto pequeno num ecrã preto: o
     hero mostra o próprio edifício (a cena continua na secção Proximidade). */
  /* o hero deixou de ser um iframe; a imagem é a mesma em todas as larguras,
     só muda o enquadramento, porque aqui o ecrã é alto e estreito */
  .esm-hero-bg img{ object-position:50% 30%; }
  .esm-hero .hero-scrim{ background:linear-gradient(0deg, rgba(0,0,0,.95) 0%, rgba(0,0,0,.6) 38%, rgba(0,0,0,.12) 66%, rgba(0,0,0,.7) 100%); }
  .esm-hero .hero-content{ padding-bottom:2.8rem; }
  .prox-lista{ grid-template-columns:1fr !important; }
  .prox-item{ padding:1.1rem 0; gap:.9rem; }
  .prox-item .time{ font-size:1.15rem; }
  .esm-facts li{ grid-template-columns:1fr; gap:.3rem; }
  .esm-identity{ gap:1rem; }
}

@media (prefers-reduced-motion:reduce){
  .hero-media img{ animation:none; }
  .m-snap.is-in > *{ animation:none; }
}

/* Destino das ligações "Marcar visita" / "Ser avisado": não fica por baixo da barra */
#contactForm{ scroll-margin-top:6rem; }