/* ============================================================
   DJ NUNO SILVA — sistema de design (híbrido moderno + 80s)
   Todo o CSS está isolado sob .djns-site-wrap para não colidir
   com a GeneratePress, os blocos do WordPress ou a barra de admin.
   ============================================================ */

body.djns-site { background: #0A0A0F; }

.djns-site-wrap {
  /* Base escura */
  --bg:#0A0A0F; --bg-2:#10101A; --surface:#16161F; --surface-2:#1C1C28;
  --line:rgba(255,255,255,.08); --line-strong:rgba(255,255,255,.14);
  /* Texto */
  --text:#F4F4F8; --muted:#A2A2B4; --muted-2:#71718a;
  /* Acentos neon */
  --magenta:#FF2D9B; --cyan:#00E5FF; --purple:#7A2BFF; --amber:#FFB23E;
  /* Gradientes / brilhos */
  --grad-neon:linear-gradient(100deg,#FF2D9B 0%,#7A2BFF 50%,#00E5FF 100%);
  --grad-sun:linear-gradient(180deg,#FFB23E 0%,#FF2D9B 55%,#7A2BFF 100%);
  --glow-magenta:0 0 40px rgba(255,45,155,.45);
  --glow-cyan:0 0 40px rgba(0,229,255,.35);
  /* Tipografia / layout */
  --font-display:'Space Grotesk',system-ui,sans-serif;
  --font-body:'Inter',system-ui,sans-serif;
  --maxw:1180px; --radius:18px; --radius-sm:12px;

  background:var(--bg); color:var(--text);
  font-family:var(--font-body); line-height:1.6;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}

.djns-site-wrap h1,.djns-site-wrap h2,.djns-site-wrap h3,.djns-site-wrap h4{
  font-family:var(--font-display); font-weight:700; line-height:1.08; letter-spacing:-.02em; color:var(--text); margin:0;
}
.djns-site-wrap a{color:inherit; text-decoration:none}
.djns-site-wrap img{max-width:100%; height:auto; display:block}
.djns-wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px}

.djns-eyebrow{
  font-family:var(--font-display); font-size:.78rem; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--cyan);
  display:inline-flex; align-items:center; gap:10px;
}
.djns-eyebrow::before{content:""; width:26px; height:2px; background:var(--grad-neon); border-radius:2px}

.djns-section{padding:96px 0; position:relative}
.djns-section-head{max-width:640px; margin-bottom:48px}
.djns-section-head h2{font-size:clamp(1.9rem,4vw,2.9rem); margin:16px 0 14px}
.djns-section-head p{color:var(--muted); font-size:1.05rem}

/* Botões */
.djns-btn{
  display:inline-flex; align-items:center; gap:9px;
  font-family:var(--font-display); font-weight:600; font-size:.95rem;
  padding:14px 26px; border-radius:100px; border:1px solid transparent;
  cursor:pointer; transition:transform .2s ease, box-shadow .25s ease;
}
.djns-btn-primary{background:var(--grad-neon); color:#fff; box-shadow:var(--glow-magenta)}
.djns-btn-primary:hover{transform:translateY(-2px); box-shadow:0 0 55px rgba(255,45,155,.6)}
.djns-btn-ghost{background:rgba(255,255,255,.04); border-color:var(--line-strong); color:var(--text)}
.djns-btn-ghost:hover{border-color:var(--cyan); box-shadow:var(--glow-cyan); transform:translateY(-2px)}
.djns-btn-sm{padding:10px 18px; font-size:.85rem}

/* ===================== HEADER ===================== */
.djns-site-header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  transition:background .3s ease, border-color .3s ease, backdrop-filter .3s;
  border-bottom:1px solid transparent;
}
body.admin-bar .djns-site-header{top:32px}
.djns-site-header.is-scrolled{
  background:rgba(10,10,15,.82); backdrop-filter:blur(18px); border-bottom:1px solid var(--line);
}
.djns-nav{display:flex; align-items:center; justify-content:space-between; height:72px}
.djns-brand{display:flex; align-items:center; gap:12px; font-family:var(--font-display); font-weight:700; font-size:1.05rem}
.djns-brand .disc{
  width:34px; height:34px; border-radius:50%; flex:0 0 34px;
  background:radial-gradient(circle at 50% 50%,#0A0A0F 26%,transparent 27%),
    conic-gradient(from 0deg,var(--magenta),var(--purple),var(--cyan),var(--magenta));
  box-shadow:var(--glow-magenta); animation:djns-spin 6s linear infinite;
}
@keyframes djns-spin{to{transform:rotate(360deg)}}
.djns-brand b{color:var(--text)} .djns-brand span{color:var(--cyan)}
/* A folga encolhe sozinha entre ~1100px e ~1500px em vez de o menu partir
   em duas linhas. Sem o clamp, "Próximas datas" e "Somos notícia" quebravam
   ao meio e a última entrada ia parar por baixo do botão Reservar. */
.djns-nav-links{display:flex; align-items:center; gap:clamp(16px,1.9vw,30px); list-style:none; margin:0; padding:0}
.djns-nav-links a{font-size:.92rem; color:var(--muted); font-weight:500; transition:color .2s; position:relative}
/* Entradas de duas palavras mantêm-se numa linha só. */
.djns-nav-links a{white-space:nowrap}
.djns-nav-links a:hover{color:var(--text)}
.djns-nav-links a::after{content:""; position:absolute; left:0; bottom:-6px; height:2px; width:0; background:var(--grad-neon); transition:width .25s}
.djns-nav-links a:hover::after{width:100%}
.djns-nav-cta{display:flex; align-items:center; gap:14px}
.djns-burger{display:none; flex-direction:column; gap:5px; background:none; border:0; cursor:pointer; padding:8px}
.djns-burger span{width:24px; height:2px; background:var(--text); border-radius:2px; transition:.3s}

/* ===================== HERO ===================== */
/* 100svh evita o "salto" causado pela barra de endereço em iOS/Android. */
.djns-hero{position:relative; min-height:100vh; min-height:100svh; display:flex; align-items:center; overflow:hidden; padding-top:72px}
.djns-hero-bg{position:absolute; inset:0; z-index:0}
.djns-hero-bg img{width:100%; height:100%; object-fit:cover; opacity:.32; filter:saturate(1.1) contrast(1.05)}
.djns-hero-bg::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(10,10,15,.55) 0%,rgba(10,10,15,.7) 55%,var(--bg) 100%)}
.djns-sun{
  position:absolute; z-index:1; left:50%; top:18%; transform:translateX(-50%);
  width:440px; height:440px; border-radius:50%; background:var(--grad-sun); filter:blur(2px); opacity:.45;
  -webkit-mask:repeating-linear-gradient(180deg,#000 0 16px,transparent 16px 24px),linear-gradient(180deg,#000 55%,transparent 80%);
          mask:repeating-linear-gradient(180deg,#000 0 16px,transparent 16px 24px),linear-gradient(180deg,#000 55%,transparent 80%);
}
.djns-grid-floor{position:absolute; left:0; right:0; bottom:0; height:42vh; z-index:1; overflow:hidden;
  -webkit-mask:linear-gradient(180deg,transparent,#000 38%); mask:linear-gradient(180deg,transparent,#000 38%)}
.djns-grid-floor::before{
  content:""; position:absolute; left:-50%; right:-50%; bottom:-2px; height:160%;
  background-image:linear-gradient(90deg,rgba(0,229,255,.32) 1px,transparent 1px),linear-gradient(0deg,rgba(255,45,155,.30) 1px,transparent 1px);
  background-size:60px 60px; transform:perspective(420px) rotateX(70deg); transform-origin:bottom center;
  animation:djns-flow 12s linear infinite;
}
@keyframes djns-flow{from{background-position:0 0}to{background-position:0 60px}}
.djns-hero-inner{position:relative; z-index:3; width:100%}
.djns-hero h1{font-size:clamp(2.8rem,8vw,6rem); line-height:.96; margin-bottom:8px}
.djns-hero h1 .chrome{
  background:linear-gradient(180deg,#fff 0%,#cfe9ff 38%,#FF2D9B 39%,#7A2BFF 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  filter:drop-shadow(0 4px 24px rgba(255,45,155,.35));
}
.djns-hero .lede{font-size:clamp(1.05rem,2.4vw,1.35rem); color:var(--muted); max-width:560px; margin:20px 0 34px}
.djns-hero .lede b{color:var(--text); font-weight:600}
.djns-hero-actions{display:flex; flex-wrap:wrap; gap:14px; margin-bottom:48px}
.djns-hero-stats{display:flex; gap:42px; flex-wrap:wrap}
.djns-stat .n{font-family:var(--font-display); font-weight:700; font-size:2rem; background:var(--grad-neon); -webkit-background-clip:text; background-clip:text; color:transparent}
.djns-stat .l{font-size:.82rem; color:var(--muted); text-transform:uppercase; letter-spacing:.1em}

/* ===================== TRUST ===================== */
.djns-trust{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--bg-2); padding:30px 0}
.djns-trust .djns-wrap{display:flex; align-items:center; gap:28px; flex-wrap:wrap; justify-content:center}
.djns-trust .lbl{font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted-2)}
.djns-trust .logos{display:flex; gap:30px; flex-wrap:wrap; justify-content:center}
.djns-trust .logos span{font-family:var(--font-display); font-weight:600; color:var(--muted); opacity:.8; font-size:.95rem; transition:.2s}
.djns-trust .logos span:hover{color:var(--cyan); opacity:1}

/* ===================== CARTÕES (serviços) ===================== */
.djns-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.djns-card{background:linear-gradient(180deg,var(--surface),var(--bg-2)); border:1px solid var(--line); border-radius:var(--radius); padding:32px 28px; position:relative; overflow:hidden; transition:transform .25s, border-color .25s}
.djns-card:hover{transform:translateY(-6px); border-color:var(--line-strong)}
.djns-card::before{content:""; position:absolute; inset:0 0 auto 0; height:3px; background:var(--grad-neon); opacity:0; transition:.25s}
.djns-card:hover::before{opacity:1}
.djns-card .ico{width:54px; height:54px; border-radius:14px; display:grid; place-items:center; margin-bottom:20px; background:rgba(255,45,155,.1); border:1px solid rgba(255,45,155,.25); font-size:1.5rem}
.djns-card:nth-child(2) .ico{background:rgba(0,229,255,.1); border-color:rgba(0,229,255,.25)}
.djns-card:nth-child(3) .ico{background:rgba(122,43,255,.12); border-color:rgba(122,43,255,.28)}
.djns-card h3{font-size:1.3rem; margin-bottom:10px}
.djns-card p{color:var(--muted); font-size:.96rem; margin-bottom:18px}
.djns-card .more{font-family:var(--font-display); font-weight:600; font-size:.88rem; color:var(--cyan); display:inline-flex; gap:7px; align-items:center; transition:gap .2s}
.djns-card:hover .more{gap:12px}

/* ===================== AGENDA ===================== */
.djns-agenda{background:radial-gradient(900px 400px at 85% 0%,rgba(122,43,255,.14),transparent 60%),radial-gradient(700px 360px at 0% 100%,rgba(255,45,155,.1),transparent 55%),var(--bg)}
.djns-agenda-head{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap}
.djns-events{margin-top:42px; display:flex; flex-direction:column; gap:14px}
.djns-event{display:grid; grid-template-columns:96px 1fr auto; align-items:center; gap:26px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius-sm); padding:18px 24px; transition:border-color .2s, transform .2s, background .2s}
.djns-event:hover{border-color:var(--magenta); transform:translateX(4px); background:var(--surface-2)}
.djns-ev-date{text-align:center; border-right:1px solid var(--line); padding-right:18px}
.djns-ev-date .d{font-family:var(--font-display); font-weight:700; font-size:1.8rem; line-height:1}
.djns-ev-date .m{font-size:.74rem; text-transform:uppercase; letter-spacing:.14em; color:var(--cyan)}
.djns-ev-main h4{font-size:1.18rem; margin-bottom:4px}
.djns-ev-main p{color:var(--muted); font-size:.9rem; display:flex; align-items:center; gap:8px; margin:0}
.djns-ev-badge{font-size:.72rem; font-weight:600; font-family:var(--font-display); letter-spacing:.08em; text-transform:uppercase; color:var(--amber); border:1px solid rgba(255,178,62,.35); background:rgba(255,178,62,.08); padding:3px 10px; border-radius:100px; display:inline-block; margin-bottom:8px}
.djns-ev-cta{justify-self:end}
.djns-note{margin-top:20px; font-size:.82rem; color:var(--muted-2); display:flex; gap:8px; align-items:center}
.djns-empty{padding:40px; text-align:center; color:var(--muted); border:1px dashed var(--line-strong); border-radius:var(--radius-sm)}

/* ===================== RUA 80 ===================== */
.djns-rua{overflow:hidden}
.djns-rua-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:center}
.djns-rua-visual{position:relative}
.djns-rua-visual img{border-radius:var(--radius); border:1px solid var(--line-strong); box-shadow:0 30px 80px rgba(0,0,0,.5),var(--glow-magenta)}
.djns-rua-visual .badge-spin{position:absolute; right:-18px; bottom:-18px; width:120px; height:120px; border-radius:50%; background:var(--grad-sun); display:grid; place-items:center; text-align:center; font-family:var(--font-display); font-weight:700; font-size:.82rem; color:#0A0A0F; line-height:1.1; box-shadow:0 12px 40px rgba(255,45,155,.5); transform:rotate(-8deg)}
.djns-rua-copy h2{font-size:clamp(2rem,4.5vw,3.2rem); margin:14px 0 16px}
.djns-rua-copy h2 em{font-style:normal; color:var(--magenta)}
.djns-rua-copy p{color:var(--muted); font-size:1.05rem; margin-bottom:22px}
.djns-rua-meta{display:flex; gap:34px; flex-wrap:wrap; margin-bottom:26px}
.djns-rua-meta .n{font-family:var(--font-display); font-weight:700; font-size:1.7rem; color:var(--text)}
.djns-rua-meta .l{font-size:.8rem; color:var(--muted); text-transform:uppercase; letter-spacing:.1em}

/* ===================== SOBRE ===================== */
.djns-sobre{background:var(--bg-2)}
.djns-sobre-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:52px; align-items:center}
.djns-sobre-photo{position:relative}
.djns-sobre-photo img{border-radius:var(--radius); filter:grayscale(.15) contrast(1.05)}
.djns-sobre-copy h2{font-size:clamp(1.9rem,4vw,2.8rem); margin:14px 0 18px}
.djns-sobre-copy p{color:var(--muted); margin-bottom:16px; font-size:1.02rem}
.djns-sobre-copy .sign{font-family:var(--font-display); color:var(--cyan); font-weight:600; margin-top:8px}

/* ===================== GALERIA ===================== */
.djns-gallery{display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:180px; gap:14px}
.djns-gallery a{position:relative; overflow:hidden; border-radius:14px; border:1px solid var(--line)}
.djns-gallery img{width:100%; height:100%; object-fit:cover; transition:transform .5s ease}
.djns-gallery a::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 55%,rgba(255,45,155,.35)); opacity:0; transition:.3s}
.djns-gallery a:hover img{transform:scale(1.08)}
.djns-gallery a:hover::after{opacity:1}
.djns-g-tall{grid-row:span 2} .djns-g-wide{grid-column:span 2}
/* Ver breakpoint de 460px: em coluna única, o span 2 tem de ser anulado,
   senão o CSS Grid cria uma segunda coluna implícita (~43px) e a galeria
   desalinha-se em telemóvel. */

/* ===================== MEDIA / DEPOIMENTO ===================== */
.djns-media{background:var(--bg-2)}
.djns-quote{max-width:820px; margin:0 auto; text-align:center}
.djns-quote blockquote{font-family:var(--font-display); font-weight:500; font-size:clamp(1.4rem,3.4vw,2.1rem); line-height:1.35; letter-spacing:-.01em; margin:18px 0 0}
.djns-quote blockquote .hl{color:var(--magenta)}
.djns-quote cite{display:block; margin-top:22px; color:var(--muted); font-style:normal; font-size:.95rem}
.djns-press-logos{display:flex; justify-content:center; gap:34px; flex-wrap:wrap; margin-top:48px; padding-top:34px; border-top:1px solid var(--line)}
.djns-press-logos span{font-family:var(--font-display); font-weight:600; color:var(--muted-2); font-size:.92rem; transition:.2s}
.djns-press-logos span:hover{color:var(--text)}

/* ===================== CTA ===================== */
.djns-cta-band{position:relative; overflow:hidden; border-radius:var(--radius); padding:64px 48px; text-align:center; background:linear-gradient(120deg,rgba(255,45,155,.16),rgba(122,43,255,.16),rgba(0,229,255,.14)); border:1px solid var(--line-strong)}
.djns-cta-band::before{content:""; position:absolute; inset:0; background-image:linear-gradient(90deg,rgba(0,229,255,.18) 1px,transparent 1px),linear-gradient(0deg,rgba(255,45,155,.16) 1px,transparent 1px); background-size:46px 46px; -webkit-mask:radial-gradient(circle at 50% 50%,#000,transparent 70%); mask:radial-gradient(circle at 50% 50%,#000,transparent 70%); opacity:.5}
.djns-cta-band>*{position:relative}
.djns-cta-band h2{font-size:clamp(2rem,5vw,3.2rem); margin-bottom:14px}
.djns-cta-band p{color:var(--text); opacity:.85; max-width:520px; margin:0 auto 30px; font-size:1.08rem}
.djns-cta-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap}

/* ===================== FOOTER ===================== */
.djns-site-footer{background:var(--bg); border-top:1px solid var(--line); padding:64px 0 28px}
.djns-foot-grid{display:grid; grid-template-columns:1.6fr 1fr 1fr 1.2fr; gap:36px; margin-bottom:44px}
.djns-foot-brand p{color:var(--muted); font-size:.94rem; max-width:300px; margin:16px 0}
.djns-foot-col h5{font-family:var(--font-display); font-size:.82rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-2); margin:0 0 16px}
.djns-foot-col a{display:block; color:var(--muted); font-size:.94rem; margin-bottom:11px; transition:color .2s}
.djns-foot-col a:hover{color:var(--cyan)}
.djns-socials{display:flex; gap:12px; margin-top:6px}
.djns-socials a{width:40px; height:40px; border-radius:50%; border:1px solid var(--line-strong); display:grid; place-items:center; color:var(--muted); transition:.2s; font-size:.95rem; font-weight:600; font-family:var(--font-display)}
.djns-socials a:hover{border-color:var(--magenta); color:var(--text); box-shadow:var(--glow-magenta)}
.djns-foot-bottom{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px; padding-top:24px; border-top:1px solid var(--line); color:var(--muted-2); font-size:.85rem}
/* Ligações legais no rodapé (privacidade, cookies, termos). */
.djns-foot-legal{display:flex; flex-wrap:wrap; gap:18px}
.djns-foot-legal a{display:inline-flex; align-items:center; min-height:44px; color:var(--muted-2); font-size:.85rem; transition:color .2s}
.djns-foot-legal a:hover{color:var(--cyan)}

/* ===================== PÁGINA GENÉRICA / SINGLE ===================== */
.djns-page{padding:140px 0 80px}
.djns-page .djns-page-title{font-size:clamp(2rem,5vw,3.2rem); margin-bottom:24px}
.djns-prose{max-width:760px; color:var(--text)}
.djns-prose p{color:var(--text); margin:0 0 18px; line-height:1.75}
.djns-prose a{color:var(--cyan); text-decoration:underline}
.djns-prose h2,.djns-prose h3{margin:34px 0 14px}
.djns-back{color:var(--cyan); font-family:var(--font-display); font-weight:600; font-size:.9rem}

/* --- Conformidade de conteúdo legado (Spectra/UAGB + blocos nativos) ---
   As páginas antigas (Sobre, Serviços, Rua 80, Contactos, Identidade
   visual) têm blocos criados antes do redesenho escuro. Estas regras
   corrigem contrastes e estilos que ficaram desalinhados sem editar
   o conteúdo em si. */

/* Blocos "Group" nativos com fundo claro (ex.: cartão "Sobre") ficavam
   com texto quase invisível porque herdam var(--text), claro por
   omissão. Em vez de forçar texto escuro (frágil), troca-se o fundo
   para a superfície escura do tema — o texto já claro passa a ler-se. */
.djns-prose .wp-block-group[class*="has-white-background"],
.djns-prose .wp-block-group[class*="has-light"][class*="-background"],
.djns-prose .wp-block-group[class*="has-pale"][class*="-background"]{
  background-color:var(--surface) !important;
  border-radius:16px;
}

/* Botões dentro do conteúdo (bloco nativo "Button" e CTA do Spectra
   Info Box) — normaliza para o sistema de botões em pílula com
   gradiente da marca, em vez do cinzento/azul por omissão. */
.djns-prose .wp-block-button__link{
  background:linear-gradient(135deg,var(--magenta),var(--purple)) !important;
  color:#fff !important;
  border:none !important;
  border-radius:999px !important;
  padding:12px 28px !important;
  font-weight:600;
  text-decoration:none !important;
  display:inline-block;
  transition:transform .2s ease, box-shadow .2s ease;
}
.djns-prose .wp-block-button__link:hover{
  transform:translateY(-2px);
  box-shadow:var(--glow-magenta);
}
.djns-prose .uagb-infobox-cta-link{border-color:transparent !important}

/* Títulos e listas com ícone do Spectra (Contactos) herdavam uma cor
   cinzenta escura pensada para fundo branco — invisível no tema
   escuro. Força a cor de texto do tema. As regras geradas pelo Spectra
   (ex.: .uagb-block-XXXX .uagb-icon-list__label) usam 3 classes
   encadeadas + !important, por isso precisamos de igual ou maior
   especificidade para as vencer de forma fiável. */
body.djns-site .djns-prose .uagb-heading-text,
body.djns-site .djns-prose .uagb-icon-list__label,
body.djns-site .djns-prose [class*="uagb-icon-list"] *{
  color:var(--text) !important;
}

/* Logótipo "Rua 80" (PNG com texto preto sobre fundo transparente),
   usado em /rua-80/ e /identidade-visual/ — ilegível sobre fundo
   escuro. Um fundo claro por trás devolve a legibilidade sem
   reprocessar a imagem. */
.djns-prose img.wp-image-1373{
  background:rgba(255,255,255,.94);
  border-radius:18px;
  padding:18px;
}

/* ===================== RESPONSIVE ===================== */

/* O menu horizontal deixa de caber bem antes dos 760px onde o hambúrguer
   entrava: com 7 entradas, logótipo e o botão Reservar são precisos cerca
   de 1030px. Passámos o limiar para 1080px — abaixo disso vai tudo para o
   painel do hambúrguer, que é sempre mais legível do que um menu apertado. */
@media(max-width:1080px){
  .djns-nav-links{position:fixed; inset:72px 0 auto 0; flex-direction:column; gap:0; background:rgba(10,10,15,.97); backdrop-filter:blur(20px); border-bottom:1px solid var(--line); padding:10px 0; transform:translateY(-130%); transition:transform .35s ease}
  body.admin-bar .djns-nav-links{inset:104px 0 auto 0}
  .djns-nav-links.is-open{transform:translateY(0)}
  .djns-nav-links a{padding:15px 24px; width:100%; font-size:1rem}
  .djns-nav-links a::after{display:none}
  .djns-burger{display:flex}
}
@media(max-width:960px){
  .djns-cards{grid-template-columns:1fr 1fr}
  .djns-rua-grid,.djns-sobre-grid{grid-template-columns:1fr; gap:36px}
  .djns-gallery{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  /* As regras do painel do hambúrguer subiram para o bloco dos 1080px. */
  /* O CTA principal NUNCA desaparece em móvel — é a ação de conversão. */
  .djns-nav-cta .djns-btn{padding:9px 14px; font-size:.8rem}
  .djns-cards{grid-template-columns:1fr}
  .djns-event{grid-template-columns:64px 1fr; gap:16px}
  .djns-ev-cta{grid-column:1/-1; justify-self:stretch; margin-top:4px}
  .djns-ev-cta .djns-btn{width:100%; justify-content:center}
  .djns-agenda-head{flex-direction:column; align-items:flex-start}
  .djns-section{padding:64px 0}
  .djns-foot-grid{grid-template-columns:1fr 1fr; gap:28px}
  .djns-foot-brand{grid-column:1/-1}
}
@media(max-width:460px){
  .djns-gallery{grid-template-columns:1fr}
  /* Sem isto, o span 2 herdado força uma coluna implícita e parte a grelha. */
  .djns-g-wide{grid-column:auto}
  .djns-hero-stats{gap:26px}
}

/* ============================================================
   ACESSIBILIDADE E NAVEGAÇÃO
   ============================================================ */

/* O cabeçalho é fixo: sem isto, os links âncora (#servicos, #agenda…)
   deixam o título escondido por baixo da barra. */
html{scroll-behavior:smooth}
.djns-site-wrap [id]{scroll-margin-top:92px}

/* Foco visível para navegação por teclado (obrigatório em WCAG 2.4.7). */
.djns-site-wrap a:focus-visible,
.djns-site-wrap button:focus-visible{
  outline:2px solid var(--cyan); outline-offset:3px; border-radius:4px;
}

/* Link "saltar para o conteúdo" — visível apenas ao navegar por teclado. */
.djns-skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--surface); color:var(--text); padding:12px 20px;
  border:1px solid var(--cyan); border-radius:0 0 var(--radius-sm) 0;
  font-family:var(--font-display); font-weight:600;
}
.djns-skip:focus{left:0}

/* --- Áreas clicáveis (WCAG 2.5.8 exige 24px; usamos 44px, o alvo
   confortável para o polegar recomendado pelas guidelines móveis). --- */

/* Os links do cabeçalho medem só ~18px de altura (texto sem padding).
   Em vez de lhes dar padding — que empurraria o sublinhado animado e
   partiria o alinhamento do menu — expandimos apenas a área clicável
   com um pseudo-elemento. O layout mantém-se exatamente igual. */
.djns-nav-links a::before{
  content:"";
  position:absolute;
  left:0; right:0;
  top:50%;
  transform:translateY(-50%);
  height:44px;
}

/* Botões: o padding base dá ~43px; garantimos o mínimo em todas as
   variantes, incluindo .djns-btn-sm e o CTA reduzido em telemóvel. */
.djns-btn{min-height:44px; justify-content:center}

/* Hambúrguer: 24px de traço + 8px de padding davam ~40x32. */
.djns-burger{
  min-width:44px; min-height:44px;
  align-items:center; justify-content:center;
}

/* Ícones dos cartões de serviço (SVG inline, consistentes em todos os sistemas). */
.djns-card .ico svg{width:26px; height:26px; stroke:var(--magenta); fill:none; stroke-width:1.6}
.djns-card:nth-child(2) .ico svg{stroke:var(--cyan)}
.djns-card:nth-child(3) .ico svg{stroke:var(--purple)}

/* Respeita quem desativou animações no sistema operativo. */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .djns-site-wrap *,
  .djns-site-wrap *::before,
  .djns-site-wrap *::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
  }
  .djns-brand .disc{animation:none}
  .djns-grid-floor::before{animation:none}
}

/* Impressão: fundo branco e sem elementos decorativos. */
@media print{
  body.djns-site,.djns-site-wrap{background:#fff; color:#000}
  .djns-site-header,.djns-sun,.djns-grid-floor,.djns-hero-bg,.djns-socials{display:none}
  .djns-site-wrap h1,.djns-site-wrap h2,.djns-site-wrap h3{color:#000}
}