/* ==========================================================================
   BASE — reset, tipografia, header, menu, botões, hero
   ========================================================================== */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: auto; -webkit-text-size-adjust: 100%; }
body {
  margin: 0; background: var(--c-ivory); color: var(--c-graphite);
  font-family: var(--f-sans); font-weight: 400; line-height: 1.55; font-size: 16px;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip;
}
h1, h2, h3, p, ul, dl, dd, figure { margin: 0; padding: 0; }
ul { list-style: none; }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
::selection { background: var(--c-sage); color: var(--c-graphite); }
:focus-visible { outline: 2px solid var(--c-forest); outline-offset: 4px; border-radius: 2px; }
[inert] { pointer-events: none; }
main:focus, section:focus { outline: none; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: fixed; left: 12px; top: -80px; z-index: 100; padding: 10px 16px; background: var(--c-ivory); border: 1px solid var(--c-forest); transition: top .2s; }
.skip:focus { top: 12px; }
.display { font-family: var(--f-serif); font-weight: 500; letter-spacing: -.012em; }
.fg { position: relative; z-index: var(--z-fg); }                    /* plano 3: tipografia e controlos acima da fita */
.wrap { max-width: 1680px; margin-inline: auto; padding-inline: var(--gutter); }
.todo { font-style: italic; color: var(--ink-2); }
.muted { color: var(--ink-2); }
.tag { display: inline-block; padding: 2px 9px; border: 1px solid rgba(var(--rgb-forest), .45); border-radius: 99px; font: 500 10.5px var(--f-sans);
  letter-spacing: .12em; text-transform: uppercase; color: var(--c-forest); vertical-align: middle; white-space: nowrap; }

/* ---------- header ---------- */
.header { position: fixed; inset: 0 0 auto 0; z-index: var(--z-header); }
.header::before { content: ""; position: absolute; inset: 0 0 -26px; z-index: -1; pointer-events: none; opacity: 0; transition: opacity .6s var(--ease-soft);
  background: linear-gradient(180deg, rgba(var(--rgb-ivory), .94) 0%, rgba(var(--rgb-ivory), .7) 55%, rgba(var(--rgb-ivory), 0) 100%); }
.header.is-scrolled::before { opacity: 1; }
.header-in { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-5);
  padding: max(var(--sp-5), env(safe-area-inset-top)) var(--gutter) 0; }
.logo { display: inline-flex; align-items: baseline; gap: 14px; }
.logo-mark { font-family: var(--f-serif); font-size: 34px; line-height: 1; letter-spacing: .06em; }
.logo-sub { display: none; font-size: 12px; font-weight: 300; letter-spacing: .04em; }
.nav { display: none; gap: clamp(22px, 3vw, 44px); font-size: 14px; }
.nav a { position: relative; padding: 6px 0; }
.nav a::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor;
  transform: scaleX(0); transform-origin: left; transition: transform var(--t-fast) var(--ease-out); }
.nav a:hover::after, .nav a[aria-current]::after { transform: scaleX(1); }
.burger { padding: var(--sp-3); margin-right: -12px; }

.menu { position: fixed; inset: 0; z-index: var(--z-menu); display: flex; flex-direction: column; align-items: center; justify-content: center;
  background: rgba(var(--rgb-ivory), .97); transition: opacity .6s var(--ease-soft), visibility 0s; }       /* abre: visível de imediato (foco possível) */
.menu.is-closed { opacity: 0; visibility: hidden; transition: opacity .6s var(--ease-soft), visibility 0s .6s; }
.menu nav { display: flex; flex-direction: column; align-items: center; gap: var(--sp-5); font-family: var(--f-serif); font-size: 40px; }
.menu small { position: absolute; bottom: var(--sp-7); font-size: 12px; letter-spacing: .04em; color: var(--c-forest); }
.menu-close { position: absolute; top: max(var(--sp-4), env(safe-area-inset-top)); right: var(--gutter); padding: var(--sp-3); }

@media (min-width: 768px) {
  .header-in { padding-top: var(--sp-6); }
  .logo-sub { display: inline; }
  .nav { display: flex; }
  .burger { display: none; }
}

/* ---------- botões e ligações ---------- */
.btn { position: relative; display: inline-block; padding-bottom: 6px; font-size: 15px; letter-spacing: .01em; }
.btn::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; opacity: .55; transition: opacity var(--t-fast); }
.btn:hover::after { opacity: 1; }
.btn .arr { display: inline-block; margin-left: 4px; transition: transform var(--t-med) var(--ease-out); }
.btn:hover .arr { transform: translateY(4px); }
.btn--line { padding: 15px 30px; border: 1px solid rgba(var(--rgb-forest), .55); border-radius: 2px; transition: background var(--t-fast), border-color var(--t-fast); }
.btn--line::after { display: none; }
.btn--line:hover { background: var(--c-sage); border-color: var(--c-forest); }
.btn--line[disabled] { opacity: .55; cursor: progress; }
.link { display: inline-block; margin-top: var(--sp-4); padding-bottom: 3px; font-size: 14px; border-bottom: 1px solid rgba(var(--rgb-graphite), .35); transition: border-color var(--t-fast); }
.link:hover { border-color: var(--c-graphite); }

/* ---------- hero ---------- */
.hero { position: relative; height: 100vh; height: 100svh; min-height: 600px; overflow: hidden; }
.hero-media { position: absolute; inset: -4% 0 0; z-index: -1; will-change: transform; }
.hero-media > .media-real { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-media.has-media .scene { display: none; }
.scene, .scene > * { position: absolute; }
.scene { inset: 0; }
.sky { inset: 0; background:
  radial-gradient(ellipse 38% 46% at 3% 24%, rgba(255,250,235,.95) 0%, rgba(255,244,214,.55) 38%, rgba(255,244,214,0) 72%),
  linear-gradient(180deg, #f2e9d6 0%, #f1e4c8 30%, #ead9b6 52%, #e2cfa8 60%); }
.rays { inset: -10% 0 30% -20%; opacity: .32;
  background: conic-gradient(from 105deg at 4% 18%, transparent 0deg, rgba(255,255,255,.95) 8deg, transparent 16deg, rgba(255,255,255,.7) 24deg, transparent 34deg, rgba(255,255,255,.85) 44deg, transparent 56deg);
  animation: rays 18s var(--ease-inout) infinite alternate; will-change: transform; }
.hills { left: -5%; width: 70%; top: 24%; height: 28%; filter: blur(7px); opacity: .85; }
.mist { left: 0; right: 0; top: 34%; height: 24%; filter: blur(10px); background: linear-gradient(180deg, rgba(246,238,220,0), rgba(246,238,220,.85) 55%, rgba(246,238,220,0)); }
.sea { left: 0; right: 0; top: 49%; bottom: 0; -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 9%); mask-image: linear-gradient(180deg, transparent 0, #000 9%);
  background: linear-gradient(180deg, #dccfb0 0%, #c9c2a4 16%, #b6b59b 40%, #d4cbb0 78%, #eadfc6 100%); }
.glint { left: -4%; top: 49%; width: 46%; height: 30%; background: radial-gradient(ellipse at 20% 0%, rgba(255,250,232,.85), rgba(255,250,232,0) 65%); }
.wave { left: -10%; width: 120%; will-change: transform; }
.wave svg { display: block; width: 100%; height: 100%; }
.wave.w1 { top: 52%; height: 14%; opacity: .55; animation: sway 14s var(--ease-inout) infinite alternate; }
.wave.w2 { top: 60%; height: 18%; opacity: .7;  animation: sway 11s var(--ease-inout) infinite alternate-reverse; }
.wave.w3 { top: 71%; height: 20%; opacity: .9;  animation: sway 9s var(--ease-inout) infinite alternate; }
.wave.w4 { top: 82%; height: 22%;               animation: sway 7s var(--ease-inout) infinite alternate-reverse; }
@keyframes rays { from { transform: rotate(-1.2deg) scale(1) } to { transform: rotate(1.4deg) scale(1.04) } }
@keyframes sway { from { transform: translate3d(-2.5%,0,0) } to { transform: translate3d(2.5%,0,0) } }
.grain { inset: 0; opacity: .07; pointer-events: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .4  0 0 0 0 .35  0 0 0 0 .25  0 0 0 1 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); }
.hero-fade { position: absolute; left: 0; right: 0; bottom: 0; height: 22%; pointer-events: none;
  background: linear-gradient(180deg, rgba(var(--rgb-ivory),0), rgba(var(--rgb-ivory),.6) 55%, var(--c-ivory)); }

/* hero editorial assimétrico: título ancorado à esquerda, fita a sair pelo canto superior direito */
.hero-copy { display: flex; flex-direction: column; align-items: flex-start; height: 100%;
  padding: clamp(112px, 21vh, 220px) var(--gutter) 0; pointer-events: none; }
.hero-copy > * { pointer-events: auto; }
.hero-title { font-size: clamp(2.7rem, 7.2vw, 6.4rem); line-height: 1.01; text-shadow: 0 1px 28px rgba(246,238,220,.65); }
.hero-sub { max-width: 27rem; margin-top: clamp(20px, 3.2vh, 34px); font-size: clamp(15px, 1.25vw, 17px); font-weight: 300; line-height: 1.65; color: rgba(var(--rgb-graphite), .86); }
.hero-copy .btn { margin-top: clamp(26px, 4.4vh, 46px); }
.cue { position: absolute; left: var(--gutter); bottom: clamp(20px, 4vh, 40px); display: flex; align-items: center; gap: 14px; font-size: 11.5px; letter-spacing: .14em; text-transform: uppercase; color: rgba(var(--rgb-graphite), .8); }
.cue-line { position: relative; width: 1px; height: 52px; background: rgba(var(--rgb-graphite), .25); overflow: hidden; }
.cue-line::after { content: ""; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--c-graphite); animation: cue 2.8s var(--ease-inout) infinite; }
@keyframes cue { 0% { top: -40%; } 70%, 100% { top: 100%; } }

#ribbon { position: fixed; left: 0; top: 0; z-index: var(--z-ribbon); pointer-events: none; }
#bg { position: fixed; left: 0; top: 0; z-index: -1; display: none; }
.gl #bg { display: block; }
.gl .hero-media, .gl .hero-fade { display: none; }