/* ===========================================================
   Localised landing pages (/de/ /es/ /fr/ /it/ /hr/)
   Reuses the site palette; everything here is scoped to .loc-*
   so it cannot leak into the English pages.
   =========================================================== */

.loc-head{
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem;
  max-width: 60rem; margin: 0 auto; padding: 1.1rem 1.25rem;
}
.loc-brand{ display: inline-flex; align-items: center; gap: .65rem; font-family: "Space Grotesk", sans-serif;
  font-size: 1.15rem; font-weight: 700; color: #103b27; letter-spacing: -.01em; }
.loc-brand img{ width: 38px; height: 38px; }
.loc-brand span span{ color: #2fa362; }
.loc-head-right{ display: flex; align-items: center; gap: .6rem; }

/* language picker */
.lang-pick{ position: relative; }
.lang-btn{
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .5rem .8rem; border-radius: 999px;
  border: 1px solid rgba(24,78,51,.18); background: rgba(255,255,255,.65);
  font-size: .88rem; font-weight: 600; color: #2f6b48; cursor: pointer;
  font-family: inherit;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.lang-btn:hover{ background: #fff; border-color: rgba(24,78,51,.34); color: #1c4a31; }
.lang-btn svg{ width: 1rem; height: 1rem; flex: none; }
.lang-menu{
  position: absolute; top: calc(100% + 10px); right: 0; z-index: 60;
  min-width: 11rem; padding: .4rem;
  border-radius: .9rem; background: rgba(255,255,255,.97);
  border: 1px solid rgba(24,78,51,.12);
  box-shadow: 0 20px 54px -24px rgba(16,68,44,.45);
}
.lang-menu[hidden]{ display: none; }
.lang-menu a{
  display: block; padding: .55rem .7rem; border-radius: .6rem;
  font-size: .9rem; color: #1c4d36; text-decoration: none;
  transition: background .16s ease, color .16s ease;
}
.lang-menu a:hover{ background: rgba(47,163,98,.1); color: #12442c; }
.lang-menu a.is-here{ font-weight: 700; color: #1a6e41; background: rgba(47,163,98,.08); }

/* layout */
main#main{ max-width: 60rem; margin: 0 auto; padding: 0 1.25rem; }
.loc-hero{ padding: 2.5rem 0 3rem; text-align: center; }
.loc-badge{
  display: inline-flex; align-items: center; gap: .45rem;
  padding: .35rem .85rem; border-radius: 999px;
  font-family: "Space Grotesk", sans-serif; font-size: .74rem;
  font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  color: #1a6e41; background: rgba(47,163,98,.12); border: 1px solid rgba(47,163,98,.22);
}
.loc-hero h1{
  margin: 1.1rem 0 0; font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(2.1rem, 5.2vw, 3.4rem); font-weight: 700;
  line-height: 1.08; letter-spacing: -.02em; color: #0d3322;
}
.loc-lead{ margin: 1.1rem auto 0; max-width: 46rem; font-size: 1.1rem; line-height: 1.7; color: rgba(18,68,44,.9); }

.loc-cta-row{ display: flex; flex-wrap: wrap; gap: .7rem; justify-content: center; margin-top: 1.6rem; }
.loc-btn{
  display: inline-flex; align-items: center; justify-content: center;
  padding: .8rem 1.5rem; border-radius: 999px;
  font-family: "Space Grotesk", sans-serif; font-size: .95rem; font-weight: 700;
  text-decoration: none; transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.loc-btn:hover{ transform: translateY(-1px); }
.loc-btn--gold{ background: linear-gradient(135deg, #edc14e, #e9ad2a); color: #3c2b06;
  box-shadow: 0 14px 34px -18px rgba(233,173,42,.9); }
.loc-btn--ghost{ background: rgba(47,163,98,.09); color: #1a6e41; border: 1px solid rgba(47,163,98,.24); }

.loc-stats{ display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: .8rem; margin: 2.2rem 0 0; }
.loc-stats > div{ padding: .9rem 1rem; border-radius: 1rem; background: rgba(255,255,255,.62);
  border: 1px solid rgba(47,163,98,.16); }
.loc-stats dt{ font-family: "Space Grotesk", sans-serif; font-size: 1.5rem; font-weight: 700; color: #1a6e41; }
.loc-stats dd{ margin: .2rem 0 0; font-size: .84rem; line-height: 1.4; color: rgba(18,68,44,.78); }

.loc-sec{ padding: 2.6rem 0; border-top: 1px solid rgba(47,163,98,.14); }
.loc-eyebrow{
  display: inline-block; font-family: "Space Grotesk", sans-serif; font-size: .74rem;
  font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #1a6e41;
}
.loc-sec h2{
  margin: .6rem 0 .9rem; font-family: 'Playfair Display', Georgia, serif;
  font-size: clamp(1.6rem, 3.4vw, 2.3rem); font-weight: 700; line-height: 1.18;
  letter-spacing: -.015em; color: #103b27;
}
.loc-sec h3{ margin: 0 0 .25rem; font-family: "Space Grotesk", sans-serif; font-size: 1rem; font-weight: 700; color: #1a6e41; }
.loc-sec p{ margin: .7rem 0; line-height: 1.75; color: rgba(18,68,44,.9); }
.loc-small{ font-size: .9rem; color: rgba(18,68,44,.72) !important; }

.loc-steps{ list-style: none; margin: 1.4rem 0 0; padding: 0; display: grid; gap: .9rem; }
.loc-steps li{ display: flex; gap: .9rem; padding: 1.1rem 1.2rem; border-radius: 1rem;
  background: #fff; border: 1px solid rgba(47,163,98,.18); box-shadow: 0 10px 30px -24px rgba(16,68,44,.5); }
.loc-num{ flex: none; width: 2rem; height: 2rem; border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  font-family: "Space Grotesk", sans-serif; font-weight: 700; font-size: .95rem;
  color: #1a6e41; background: rgba(47,163,98,.13); }
.loc-steps p{ margin: 0; font-size: .95rem; }

.loc-table{ width: 100%; border-collapse: collapse; margin: 1.2rem 0; font-size: .96rem; }
.loc-table th, .loc-table td{ padding: .7rem .9rem; text-align: left; border-bottom: 1px solid rgba(47,163,98,.16); }
.loc-table th{ font-family: "Space Grotesk", sans-serif; font-size: .8rem; letter-spacing: .04em;
  text-transform: uppercase; color: #1a6e41; }
.loc-table td{ color: rgba(18,68,44,.9); }
.loc-table tbody tr:last-child td{ border-bottom: 0; font-weight: 700; color: #12442c; }

.loc-facts{ list-style: none; margin: 1.2rem 0 0; padding: 0; display: grid; gap: .55rem; }
.loc-facts li{ padding: .8rem 1rem; border-radius: .8rem; background: rgba(47,163,98,.07);
  border: 1px solid rgba(47,163,98,.16); line-height: 1.6; color: rgba(18,68,44,.9); }
.loc-facts strong{ color: #12442c; }

.loc-sec--dark{
  margin: 2.6rem -1.25rem; padding: 2.6rem 1.6rem; border-radius: 1.4rem; border-top: 0;
  background: linear-gradient(160deg, #082a1b, #0f3d28);
  color: rgba(226,247,235,.9);
}
.loc-sec--dark h2{ color: #eaf6ee; }
.loc-sec--dark h3{ color: #9fdcbb; }
.loc-sec--dark p{ color: rgba(226,247,235,.86); }
.loc-sec--dark .loc-eyebrow{ color: #9fdcbb; }
.loc-grid{ display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: .8rem; margin: 1.3rem 0; }
.loc-card{ padding: 1rem 1.1rem; border-radius: 1rem; background: rgba(255,255,255,.06);
  border: 1px solid rgba(127,212,160,.2); }
.loc-card p{ margin: 0; font-size: .92rem; }
.loc-mint{ font-size: .88rem; color: rgba(226,247,235,.76) !important; word-break: break-all; }
.loc-mint .addr{ color: #9fdcbb; }

.loc-faq{ display: grid; gap: .6rem; margin-top: 1.2rem; }
.loc-faq details{ border: 1px solid rgba(47,163,98,.18); border-radius: 1rem; background: #fff; overflow: hidden; }
.loc-faq summary{
  cursor: pointer; list-style: none; position: relative;
  padding: 1rem 3rem 1rem 1.2rem;
  font-family: "Space Grotesk", sans-serif; font-weight: 700; color: #103b27;
}
.loc-faq summary::-webkit-details-marker{ display: none; }
.loc-faq summary::after{
  content: "+"; position: absolute; right: 1.2rem; top: 50%; transform: translateY(-50%);
  font-size: 1.35rem; font-weight: 400; color: #2fa362; transition: transform .25s ease;
}
.loc-faq details[open] summary::after{ transform: translateY(-50%) rotate(45deg); color: #d4900f; }
.loc-faq p{ margin: 0; padding: 0 1.2rem 1.1rem; font-size: .96rem; color: rgba(24,87,55,.85); }

.loc-sec--cta{ text-align: center; }
.loc-sec--cta p{ max-width: 42rem; margin-inline: auto; }

.loc-foot{ max-width: 60rem; margin: 0 auto; padding: 2rem 1.25rem 3rem; font-size: .88rem; }
.loc-foot nav{ display: flex; flex-wrap: wrap; gap: .35rem 1rem; margin-bottom: .9rem; }
.loc-foot nav a{ color: rgba(18,68,44,.82); text-decoration: none; }
.loc-foot nav a:hover{ color: #0d3322; text-decoration: underline; }
.loc-foot p{ margin: .35rem 0; color: rgba(18,68,44,.7); }

/* ---------------- dark theme ---------------- */
html[data-theme="dark"] .loc-brand{ color: #eaf6ee; }
html[data-theme="dark"] .lang-btn{ border-color: rgba(127,212,160,.26); background: rgba(255,255,255,.06); color: #9fdcbb; }
html[data-theme="dark"] .lang-btn:hover{ background: rgba(255,255,255,.1); color: #d6f5e4; }
html[data-theme="dark"] .lang-menu{ background: rgba(12,40,28,.97); border-color: rgba(127,212,160,.18);
  box-shadow: 0 20px 54px -22px rgba(0,0,0,.7); }
html[data-theme="dark"] .lang-menu a{ color: rgba(226,247,235,.88); }
html[data-theme="dark"] .lang-menu a:hover{ background: rgba(127,212,160,.14); color: #eaf6ee; }
html[data-theme="dark"] .lang-menu a.is-here{ color: #9fdcbb; background: rgba(127,212,160,.12); }

html[data-theme="dark"] .loc-hero h1{ color: #eaf6ee; }
html[data-theme="dark"] .loc-lead{ color: rgba(214,236,222,.9); }
html[data-theme="dark"] .loc-badge{ color: #9fdcbb; background: rgba(127,212,160,.12); border-color: rgba(127,212,160,.24); }
html[data-theme="dark"] .loc-stats > div{ background: rgba(255,255,255,.05); border-color: rgba(127,212,160,.18); }
html[data-theme="dark"] .loc-stats dt{ color: #9fdcbb; }
html[data-theme="dark"] .loc-stats dd{ color: rgba(214,236,222,.82); }
html[data-theme="dark"] .loc-sec{ border-top-color: rgba(127,212,160,.14); }
html[data-theme="dark"] .loc-sec h2{ color: #eaf6ee; }
html[data-theme="dark"] .loc-sec h3{ color: #9fdcbb; }
html[data-theme="dark"] .loc-sec p{ color: rgba(214,236,222,.88); }
html[data-theme="dark"] .loc-small{ color: rgba(214,236,222,.75) !important; }
html[data-theme="dark"] .loc-eyebrow{ color: #9fdcbb; }
html[data-theme="dark"] .loc-steps li{ background: #0f2b1e; border-color: rgba(127,212,160,.18); }
html[data-theme="dark"] .loc-num{ color: #9fdcbb; background: rgba(127,212,160,.16); }
html[data-theme="dark"] .loc-table th{ color: #9fdcbb; }
html[data-theme="dark"] .loc-table th, html[data-theme="dark"] .loc-table td{ border-bottom-color: rgba(127,212,160,.16); }
html[data-theme="dark"] .loc-table td{ color: rgba(214,236,222,.9); }
html[data-theme="dark"] .loc-table tbody tr:last-child td{ color: #eaf6ee; }
html[data-theme="dark"] .loc-facts li{ background: rgba(127,212,160,.09); border-color: rgba(127,212,160,.18);
  color: rgba(214,236,222,.9); }
html[data-theme="dark"] .loc-facts strong{ color: #eaf6ee; }
html[data-theme="dark"] .loc-faq details{ background: #0f2b1e; border-color: rgba(127,212,160,.18); }
html[data-theme="dark"] .loc-faq summary{ color: #eaf6ee; }
html[data-theme="dark"] .loc-faq summary::after{ color: #7fd4a0; }
html[data-theme="dark"] .loc-faq details[open] summary::after{ color: #f0c65e; }
html[data-theme="dark"] .loc-faq p{ color: rgba(214,236,222,.86); }
html[data-theme="dark"] .loc-foot nav a{ color: rgba(214,236,222,.82); }
html[data-theme="dark"] .loc-foot nav a:hover{ color: #eaf6ee; }
html[data-theme="dark"] .loc-foot p{ color: rgba(214,236,222,.7); }

@media (max-width: 560px){
  .loc-sec--dark{ margin-inline: -.6rem; padding-inline: 1.1rem; }
  .loc-head{ padding-inline: .9rem; }
}

/* ---- contrast corrections found by measurement ---- */
/* the ghost button had no dark variant: dark-green ink on a dark panel (2.27:1) */
html[data-theme="dark"] .loc-btn--ghost{
  background: rgba(127, 212, 160, .14);
  color: #cdf0dd;
  border-color: rgba(127, 212, 160, .32);
}
html[data-theme="dark"] .loc-btn--ghost:hover{ background: rgba(127, 212, 160, .2); color: #eaf6ee; }
/* footer small print sat at 4.40:1, just under AA */
.loc-foot p{ color: rgba(18, 68, 44, .8); }
html[data-theme="dark"] .loc-foot p{ color: rgba(214, 236, 222, .8); }
/* the brand dot is small bold text, so it needs the 4.5 threshold too */
.loc-brand span span{ color: #1a6e41; }
html[data-theme="dark"] .loc-brand span span{ color: #7fd4a0; }
