/* =====================================
   COLLIGO — LEGAL PAGES
===================================== */

@import url("./base.css");


.colligo-legal {
  min-height: 100vh;

  background:
    radial-gradient(
      circle at 50% 0%,
      var(--colligo-page-glow),
      transparent 30%
    ),
    var(--colligo-black);
}


/* =====================================
   NAVIGATION
===================================== */

.colligo-legal-nav {
  height: 94px;

  display: grid;
  grid-template-columns:
    1fr
    auto
    1fr;

  align-items: center;

  padding:
    0
    clamp(42px, 4.5vw, 76px);

  border-bottom:
    1px solid
    var(--colligo-gold-hairline);
}


.colligo-legal-mark {
  justify-self: start;

  width: 46px;
  height: 46px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-radius: 50%;

  transition:
    transform 180ms ease,
    opacity 180ms ease;
}


.colligo-legal-mark img {
  width: 36px;
  height: 36px;

  object-fit: cover;

  border-radius: 50%;
}


.colligo-legal-mark:hover {
  transform: scale(1.06);

  opacity: 0.92;
}


.colligo-legal-product {
  color: var(--colligo-cream);

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size: 15px;
  font-weight: 400;

  letter-spacing: 0.16em;
}


.colligo-legal-back {
  justify-self: end;

  color: var(--colligo-nav-text);

  font-size: 10px;
  font-weight: 500;

  letter-spacing: 0.12em;
  text-transform: uppercase;

  transition:
    color 180ms ease;
}


.colligo-legal-back:hover {
  color: var(--colligo-cream);
}


/* =====================================
   PAGE HEADER
===================================== */

.colligo-legal-header {
  width: min(
    calc(100% - 96px),
    920px
  );

  margin: 0 auto;

  padding:
    clamp(92px, 10vw, 150px)
    0
    58px;
}


.colligo-legal-kicker {
  display: block;

  margin-bottom: 20px;

  color: var(--colligo-gold);

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

  letter-spacing: 0.18em;
  text-transform: uppercase;
}


.colligo-legal-header h1 {
  margin: 0;

  color: var(--colligo-cream);

  font-family:
    Georgia,
    "Times New Roman",
    serif;

  font-size:
    clamp(52px, 6vw, 88px);

  font-weight: 400;

  line-height: 1;

  letter-spacing: -0.035em;
}


.colligo-legal-header p {
  max-width: 600px;

  margin:
    25px
    0
    0;

  color: var(--colligo-muted);

  font-size: 14px;

  line-height: 1.75;
}


/* =====================================
   DRAFT NOTICE
===================================== */

.colligo-legal-draft {
  width: min(
    calc(100% - 96px),
    920px
  );

  margin: 0 auto;

  padding:
    22px
    24px;

  border:
    1px solid
    var(--colligo-gold-border);

  border-radius: 12px;

  background:
    var(--colligo-surface);
}


.colligo-legal-draft strong {
  display: block;

  color: var(--colligo-gold);

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

  letter-spacing: 0.15em;
  text-transform: uppercase;
}


.colligo-legal-draft p {
  margin:
    9px
    0
    0;

  color: var(--colligo-muted);

  font-size: 13px;

  line-height: 1.7;
}


/* =====================================
   CONTENT PLACEHOLDER
===================================== */

.colligo-legal-content {
  width: min(
    calc(100% - 96px),
    920px
  );

  margin: 0 auto;

  padding:
    68px
    0
    130px;
}


.colligo-legal-placeholder {
  min-height: 260px;

  display: flex;
  align-items: center;
  justify-content: center;

  border-top:
    1px solid
    var(--colligo-border-faint);

  border-bottom:
    1px solid
    var(--colligo-border-faint);

  color: var(--colligo-faint);

  font-size: 10px;
  font-weight: 500;

  letter-spacing: 0.18em;
  text-transform: uppercase;

  text-align: center;
}


/* =====================================
   FOOTER
===================================== */

.colligo-legal-footer {
  width: min(
    calc(100% - 96px),
    920px
  );

  margin: 0 auto;

  padding:
    30px
    0
    38px;

  border-top:
    1px solid
    var(--colligo-border-faint);

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

  gap: 28px;

  color: var(--colligo-faint);

  font-size: 10px;
}


.colligo-legal-footer-links {
  display: flex;

  gap: 22px;
}


.colligo-legal-footer a {
  transition:
    color 180ms ease;
}


.colligo-legal-footer a:hover {
  color: var(--colligo-cream);
}


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

@media (max-width: 720px) {

  .colligo-legal-nav {
    height: 72px;

    padding:
      0
      20px;
  }


  .colligo-legal-mark {
    width: 32px;
    height: 32px;
  }


  .colligo-legal-mark img {
    width: 25px;
    height: 25px;
  }


  .colligo-legal-header,
  .colligo-legal-draft,
  .colligo-legal-content,
  .colligo-legal-footer {
    width:
      calc(100% - 32px);
  }


  .colligo-legal-header {
    padding:
      78px
      0
      44px;
  }


  .colligo-legal-content {
    padding:
      48px
      0
      92px;
  }


  .colligo-legal-footer {
    flex-direction: column;

    align-items: flex-start;
  }

}