/* Shared header and footer for the static pages: terms.html, ring-care.html and
   design-your-ring.html. It mirrors the homepage's header and footer, which are
   styled inline inside index.html because the homepage runs through dc-runtime.
   If you change one, change the other. Kept at the site root, not in /assets/, so
   it is revalidated on every visit and header edits are not stuck behind the
   7-day asset cache. */

.lc-skip{position:absolute;left:-9999px;top:0;z-index:100;background:#182742;color:#fff;padding:12px 20px;font:400 13px/1 'Jost',sans-serif;letter-spacing:.12em;text-transform:uppercase;border:0;border-radius:0 0 2px 0}
.lc-skip:focus{left:0;color:#fff}

.lc-announce{background:#182742;color:#EFD9CB;text-align:center;font:400 12px/normal 'Jost',sans-serif;letter-spacing:.28em;text-transform:uppercase;padding:11px 20px}

.lc-header,.lc-footer{line-height:normal}
.lc-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid #efe9dd;font-family:'Jost',sans-serif;-webkit-font-smoothing:antialiased}
/* The ring studio has its own sticky preview, which a sticky header would slide over. */
.lc-header--static{position:relative}
.lc-header-inner{max-width:1240px;margin:0 auto;padding:16px 40px;display:flex;align-items:center;justify-content:space-between;gap:24px}

.lc-nav{display:flex;gap:34px;flex:1;font-size:12.5px;letter-spacing:.18em;text-transform:uppercase}
.lc-nav a,.lc-header-right .lc-link{color:#3a4257;border:0;white-space:nowrap;padding-bottom:5px;background-image:linear-gradient(#AC6E4E,#AC6E4E);background-repeat:no-repeat;background-size:0% 1px;background-position:left bottom;transition:background-size .45s cubic-bezier(.4,0,.2,1),color .45s ease}
.lc-nav a:hover,.lc-nav a[aria-current="page"],.lc-header-right .lc-link:hover{color:#182742;background-size:100% 1px}

.lc-logo{display:flex;align-items:center;border:0}
.lc-logo img{height:25px;width:auto;display:block}

.lc-header-right{flex:1;display:flex;justify-content:flex-end;align-items:center;gap:28px}
.lc-header-right .lc-link{font-size:12.5px;letter-spacing:.18em;text-transform:uppercase}
.lc-header .lc-cta{display:inline-flex;align-items:center;border:1px solid #182742;color:#182742;padding:10px 24px;font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;border-radius:2px;white-space:nowrap;background-image:linear-gradient(#182742,#182742);background-repeat:no-repeat;background-position:left center;background-size:0% 100%;transition:background-size .5s cubic-bezier(.4,0,.2,1),color .45s ease}
.lc-header .lc-cta:hover{color:#fff;background-size:100% 100%}

.lc-footer{background:#0f1a2e;color:#9aa6bd;font-family:'Jost',sans-serif;-webkit-font-smoothing:antialiased}
.lc-footer-inner{max-width:1240px;margin:0 auto;padding:70px 40px 40px;text-align:center}
.lc-footer img{width:min(330px,72vw);height:auto;margin:0 auto 30px;display:block}
.lc-footer nav{display:flex;justify-content:center;gap:32px;flex-wrap:wrap;font-size:12px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:36px}
.lc-footer nav a{color:#9aa6bd;border:0;transition:color .25s ease}
.lc-footer nav a:hover{color:#fff}
.lc-footer-legal{border-top:1px solid rgba(255,255,255,.08);padding-top:26px;font-size:12px;letter-spacing:.08em;color:#8d99b1}

/* The four nav links plus the logo and buttons do not fit on one line below about 1360px. */
@media (max-width:1360px) and (min-width:1101px){
  .lc-header-inner{gap:18px}
  .lc-nav{gap:22px;letter-spacing:.14em}
}
@media (max-width:1100px) and (min-width:901px){
  .lc-header-inner{padding:16px 24px;gap:16px}
  .lc-nav{gap:20px}
  .lc-nav a{font-size:11px;letter-spacing:.1em}
  .lc-logo img{height:21px}
  .lc-header-right .lc-link{display:none}
  .lc-header .lc-cta{padding:10px 16px;font-size:10.5px;letter-spacing:.12em}
}
@media (max-width:900px){
  .lc-announce{display:none}
  .lc-nav{display:none}
  .lc-header-inner{padding:14px 20px}
  .lc-logo{flex:1}
  .lc-logo img{height:17px}
  .lc-header-right{flex:0 0 auto}
  .lc-header-right .lc-link{display:none}
  .lc-header .lc-cta{padding:12px 18px;font-size:0;letter-spacing:0;line-height:1}
  .lc-header .lc-cta::after{content:"Enquire";font-size:11.5px;letter-spacing:.18em;text-transform:uppercase}
  .lc-footer-inner{padding-left:14px;padding-right:14px}
  .lc-footer nav{gap:14px 22px}
}