/* ============================================================
   265 — Hovedlogo (delt på alle sider)
   Bruk: <link rel="stylesheet" href="logo.css">
         (fra undermappen ringer/: href="../logo.css")

   Markup:
   <a class="logo" href="index.html" aria-label="265 — Est. 2026">
     <svg viewBox="0 0 200 130" preserveAspectRatio="xMidYMid meet" aria-hidden="true">
       <ellipse class="ring-o" cx="100" cy="65" rx="92" ry="55"/>
       <ellipse class="ring-i" cx="100" cy="65" rx="87" ry="50"/>
       <line class="divider" x1="70" y1="83" x2="130" y2="83"/>
       <text class="est" x="100" y="95" text-anchor="middle">EST · 2026</text>
     </svg>
     <span class="num">265</span>
   </a>
   ============================================================ */

.logo {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  user-select: none;
  text-decoration: none;
  color: inherit;
  /* Standardstørrelse — kan overstyres av nav.top .logo / footer .logo */
  width: 108px;
  height: 70px;
}
.logo svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
}
.logo svg .ring-o { fill: none; stroke: var(--gold, #c9a961); stroke-width: 1.2; }
.logo svg .ring-i { fill: none; stroke: var(--gold, #c9a961); stroke-width: 0.4; }
.logo svg .divider { stroke: var(--gold, #c9a961); stroke-width: 0.5; }
.logo svg .est {
  fill: var(--gold, #c9a961);
  font-family: "Inter", system-ui, sans-serif;
  font-weight: 400;
  font-size: 3.2px;
  letter-spacing: 0.5em;
  text-transform: uppercase;
  opacity: 0.8;
}
.logo .num {
  position: relative;
  z-index: 1;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 300;
  font-size: 22px;
  letter-spacing: 0.02em;
  padding-left: 0.02em;
  line-height: 1;
  /* Optisk sentrering — «265» ligger litt under geometrisk midte pga bokstavformene */
  transform: translateY(-0.05em);
  /* Gull-sheen på tallet */
  background-image: linear-gradient(
    100deg,
    var(--ink, #f2ede4) 0%,
    var(--ink, #f2ede4) 38%,
    #E6CFA0 47%,
    #F4E2B5 50%,
    #E6CFA0 53%,
    var(--ink, #f2ede4) 62%,
    var(--ink, #f2ede4) 100%
  );
  background-size: 300% 100%;
  background-position: 100% 50%;
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0 8px rgba(201, 169, 110, 0.12));
  animation: logo-sheen 9s ease-in-out infinite;
}

/* Nav: kompakt */
nav.top .logo,
nav .logo {
  width: 108px;
  height: 70px;
  margin: -14px 0;
}
nav.top .logo svg .est,
nav .logo svg .est { font-size: 3.2px; }
nav.top .logo .num,
nav .logo .num { font-size: 22px; }

/* Footer: skjult — logo i footer fjernet på ønske */
footer .logo {
  display: none !important;
  width: 180px;
  height: 117px;
}
footer .logo svg .est { font-size: 5.5px; }
footer .logo .num { font-size: 40px; letter-spacing: 0.02em; }

@keyframes logo-sheen {
  0%   { background-position: 100% 50%; filter: drop-shadow(0 0 6px rgba(201, 169, 110, 0.10)); }
  50%  { background-position: 0%   50%; filter: drop-shadow(0 0 14px rgba(201, 169, 110, 0.22)); }
  100% { background-position: 100% 50%; filter: drop-shadow(0 0 6px rgba(201, 169, 110, 0.10)); }
}
@media (prefers-reduced-motion: reduce) {
  .logo .num { animation: none; background-position: 50% 50%; }
}

/* Mobil-tilpasning */
@media (max-width: 720px) {
  nav.top .logo,
  nav .logo { width: 92px; height: 60px; }
  nav.top .logo svg .est,
  nav .logo svg .est { font-size: 3px; }
  nav.top .logo .num,
  nav .logo .num { font-size: 19px; }

  footer .logo { width: 140px; height: 91px; margin-bottom: 24px; }
}
