@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&family=Manrope:wght@500;600;700;800&display=swap');

:root{
  --cream:#f4eee1;
  --cream-2:#ece3d1;
  --ink:#241f12;
  --gold:#a8890f;
  --gold-deep:#8a710c;
  --line:#ddd2b6;
}

*{margin:0;padding:0;box-sizing:border-box;}

html{min-height:100%;}

body{
  background:var(--cream);
  background-image:radial-gradient(ellipse 900px 500px at 50% 0%, var(--cream-2), var(--cream) 70%);
  color:var(--ink);
  font-family:'Manrope',sans-serif;
  min-height:100vh;
  min-height:100dvh;
  padding:max(24px, env(safe-area-inset-top)) 20px max(40px, env(safe-area-inset-bottom));
}

.legal-header{
  max-width:680px;
  margin:0 auto 28px;
}

.legal-topbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:28px;
}

.lang-toggle{
  display:inline-flex;
  align-items:center;
  gap:3px;
  padding:3px;
  background:#fff;
  border:1px solid var(--line);
  border-radius:99px;
  flex-shrink:0;
  box-shadow:0 2px 8px -4px rgba(36,31,18,0.12);
}

.lang-btn{
  border:none;
  background:transparent;
  color:#7a7158;
  font-family:'Manrope',sans-serif;
  font-size:0.68rem;
  font-weight:800;
  letter-spacing:0.06em;
  padding:5px 10px;
  border-radius:99px;
  cursor:pointer;
  transition:background 0.18s ease, color 0.18s ease;
  min-width:36px;
}

.lang-btn:hover{color:var(--gold-deep);}

.lang-btn.active{
  background:var(--gold);
  color:#fff;
}

.back-link{
  display:inline-flex;
  align-items:center;
  font-size:0.82rem;
  font-weight:700;
  color:var(--gold-deep);
  text-decoration:none;
  white-space:nowrap;
}

.back-link:hover{text-decoration:underline;}

.legal-brand{
  text-align:center;
}

.legal-brand img{
  width:96px;
  height:auto;
  margin-bottom:14px;
  filter:drop-shadow(0 4px 12px rgba(168,137,15,0.18));
}

.legal-brand h1{
  font-family:'Fraunces',serif;
  font-weight:600;
  font-size:clamp(1.35rem, 4vw, 1.75rem);
  line-height:1.25;
  margin-bottom:6px;
}

.legal-meta{
  font-size:0.8rem;
  color:#9a8f72;
  font-weight:600;
}

.legal-main{
  max-width:680px;
  margin:0 auto;
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  padding:28px 24px 32px;
  box-shadow:0 12px 32px -16px rgba(36,31,18,0.12);
}

.legal-loading,
.legal-error{
  text-align:center;
  padding:40px 16px;
  color:#7a7158;
  font-weight:600;
}

.legal-error a{
  color:var(--gold-deep);
  font-weight:700;
}

.legal-section{
  margin-bottom:28px;
}

.legal-section:last-child{margin-bottom:0;}

.legal-section h2{
  font-family:'Fraunces',serif;
  font-weight:600;
  font-size:1.12rem;
  color:var(--gold-deep);
  margin-bottom:10px;
  line-height:1.3;
}

.legal-section p{
  font-size:0.92rem;
  line-height:1.65;
  color:#3d3828;
  margin-bottom:10px;
}

.legal-section p:last-child{margin-bottom:0;}

.legal-items{
  list-style:none;
  margin-top:12px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.legal-items li{
  padding:12px 14px;
  background:var(--cream);
  border:1px solid var(--line);
  border-radius:12px;
}

.legal-item-row{
  display:flex;
  align-items:center;
  gap:14px;
}

.legal-item-icon{
  flex-shrink:0;
  width:32px;
  height:32px;
  color:var(--gold);
}

.legal-item-icon svg{
  display:block;
  width:32px;
  height:32px;
}

.legal-item-text{
  flex:1;
  min-width:0;
}

.legal-items strong{
  display:block;
  font-size:0.88rem;
  font-weight:700;
  color:var(--ink);
  margin-bottom:4px;
}

.legal-items span{
  display:block;
  font-size:0.86rem;
  line-height:1.55;
  color:#5c5644;
}

.legal-email{
  display:inline-block;
  margin-top:6px;
  font-weight:700;
  color:var(--gold-deep);
  text-decoration:none;
}

.legal-email:hover{text-decoration:underline;}

.legal-footer{
  max-width:680px;
  margin:28px auto 0;
  text-align:center;
  font-size:0.78rem;
  color:#a89c7c;
}

.legal-footer a{
  color:var(--gold-deep);
  text-decoration:none;
  font-weight:600;
}

.legal-footer a:hover{text-decoration:underline;}

@media (min-width:481px){
  .legal-main{padding:36px 40px 40px;}
}
