/* Production Application — shared styles.
   Tokens and type scale copied from public/index.html. Do not re-derive them
   here; if the site's palette changes, change it there and copy it across. */

:root{
  --gold:#C4A24A; --cream:#EDEAE3; --warm:#B8B0A4; --text:#9B9790;
  --muted:#7A756D; --faint:#6B6560; --dim:#3A3632;
  --line:#2A2A2E; --void:#08080A; --surface:#111113;
  --error:#C45C4A;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}

body{
  background:var(--void); color:var(--cream);
  font-family:'DM Sans',-apple-system,BlinkMacSystemFont,sans-serif;
  font-weight:400; line-height:1.6;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}

/* grain overlay — same tile and opacity as the home page */
body::before{
  content:''; position:fixed; inset:0; z-index:9998; pointer-events:none;
  opacity:.025;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='512' height='512'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

.serif{font-family:'Cormorant Garamond',Georgia,serif}
.mono{font-family:'Space Mono',monospace}

a{color:var(--gold);text-decoration:none;border-bottom:1px solid transparent;transition:border-color .3s}
a:hover{border-bottom-color:var(--gold)}

/* ---------- chrome ---------- */

/* nav — copied verbatim from public/index.html so the two cannot drift */
nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; justify-content:space-between; align-items:center;
  padding:2rem clamp(2rem,5vw,4rem);
  background:linear-gradient(180deg,rgba(8,8,10,.9) 0%,transparent 100%);
}
nav img{height:52px;width:auto;filter:brightness(0) invert(.7) sepia(.1) hue-rotate(10deg)}
.nav-btn{
  background:none; border:1px solid var(--line); color:var(--text);
  padding:.5rem 1.5rem; font-family:'Space Mono',monospace; font-size:.9375rem;
  letter-spacing:.14em; text-transform:uppercase; cursor:pointer;
  transition:border-color .3s,color .3s;
}
.nav-btn:hover{border-color:var(--gold);color:var(--gold)}
@media(max-width:640px){
  nav{padding:1.25rem 1.5rem}
  nav img{height:40px}
  .nav-btn{font-size:.8125rem;padding:.45rem 1.1rem}
}

.wrap{max-width:52rem;margin:0 auto;padding:9rem 2rem 8rem}

.eyebrow{
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.28em; text-transform:uppercase; color:var(--gold);
  margin-bottom:1.75rem;
}
h1.title{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-weight:300; font-size:clamp(2.25rem,6vw,3.5rem);
  line-height:1.08; letter-spacing:-.01em; color:var(--cream);
  margin-bottom:2rem;
}
.intro p{color:var(--warm);font-size:1.3125rem;margin-bottom:1.25rem;max-width:44rem}

/* ---------- callouts and notes ---------- */

.callout{
  border:1px solid var(--line); background:var(--surface);
  padding:1.75rem; margin:2.5rem 0;
}
.callout-title{
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.22em; text-transform:uppercase; color:var(--gold);
  margin-bottom:1rem;
}
.callout p{color:var(--warm);font-size:1.3125rem;margin-bottom:.875rem}
.callout p:last-child{margin-bottom:0}

.note{
  border-left:2px solid var(--dim); padding-left:1rem;
  color:var(--text); font-size:1.1875rem; margin:1.5rem 0;
}
.prose{color:var(--warm);font-size:1.3125rem;margin-bottom:1rem}
.prose.muted{color:var(--text);font-size:1.1875rem;font-style:italic}
ul.plain{list-style:none;margin:0 0 1.25rem}
ul.plain li{
  color:var(--warm); font-size:1.3125rem; padding-left:1.25rem;
  position:relative; margin-bottom:.5rem;
}
ul.plain li::before{content:'—';position:absolute;left:0;color:var(--dim)}

/* ---------- sections ---------- */

.section{
  border-top:1px solid var(--line);
  padding-top:2.5rem; margin-top:3.5rem;
}
.section-num{
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.22em; color:var(--gold); margin-bottom:.75rem;
}
.section h2{
  font-family:'Cormorant Garamond',Georgia,serif;
  font-weight:300; font-size:2rem; color:var(--cream);
  margin-bottom:2rem; letter-spacing:.01em;
}
.subhead{
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.22em; text-transform:uppercase; color:var(--warm);
  margin:2.5rem 0 1.25rem;
}

/* ---------- fields ---------- */

.field{margin-bottom:1.75rem}
.form-label{
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.2em; text-transform:uppercase; color:var(--text);
  display:block; margin-bottom:.5rem;
}
.form-label .req{color:var(--gold);margin-left:.35em}
.hint{font-size:1.1875rem;color:var(--text);margin-top:.4rem}

input,textarea,select{
  font-family:'DM Sans',sans-serif; font-size:1.3125rem; font-weight:400;
  background:transparent; border:none; border-bottom:1px solid var(--line);
  color:var(--cream); padding:.875rem 0; width:100%; outline:none;
  transition:border-color .4s; border-radius:0; -webkit-appearance:none;
}
select{cursor:pointer;background-image:none}
select option{background:var(--surface);color:var(--cream)}
input:focus,textarea:focus,select:focus{border-color:var(--gold)}
input::placeholder,textarea::placeholder{color:var(--muted)}
textarea{resize:vertical;line-height:1.7}
.field.invalid input,.field.invalid textarea,
.field.invalid select{border-color:var(--error)}

.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 2rem}
@media(max-width:640px){.form-grid{grid-template-columns:1fr}}

/* ---------- yes / no ---------- */

.yesno-header{
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.22em; text-transform:uppercase; color:var(--gold);
  border-bottom:1px solid var(--line); padding-bottom:.75rem;
  margin:2.5rem 0 0;
}
.qrow{
  display:flex; gap:1.5rem; align-items:flex-start;
  border-bottom:1px solid var(--line); padding:1.5rem 0;
}
.qrow.invalid{border-bottom-color:var(--error)}
.qnum{
  font-family:'Space Mono',monospace; font-size:.875rem;
  color:var(--gold); flex:0 0 2.5rem; padding-top:.15rem;
}
.qtext{flex:1;color:var(--warm);font-size:1.3125rem;line-height:1.65}
.qopts{display:flex;gap:.5rem;flex:0 0 auto;padding-top:.1rem}
@media(max-width:640px){
  .qrow{flex-wrap:wrap}
  .qopts{width:100%;padding-top:.75rem}
}

.opt{position:relative}
.opt input{position:absolute;opacity:0;width:0;height:0}
.opt span{
  display:block; cursor:pointer; user-select:none;
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--text); border:1px solid var(--line);
  padding:.5rem .85rem; transition:all .3s;
}
.opt span:hover{border-color:var(--dim);color:var(--warm)}
.opt input:checked+span{border-color:var(--gold);color:var(--gold)}
.opt input:focus-visible+span{border-color:var(--gold)}

/* ---------- checkboxes ---------- */

.check{
  display:flex; gap:1rem; align-items:flex-start;
  padding:1rem 0; border-bottom:1px solid var(--line);
  cursor:pointer;
}
.check input{
  position:absolute; opacity:0; width:0; height:0;
}
.box{
  flex:0 0 18px; width:18px; height:18px; margin-top:.45rem;
  border:1px solid var(--muted); transition:all .3s; position:relative;
}
.check input:checked+.box{border-color:var(--gold);background:var(--gold)}
.check input:checked+.box::after{
  content:''; position:absolute; left:6px; top:2px;
  width:5px; height:10px; border:solid var(--void);
  border-width:0 1.5px 1.5px 0; transform:rotate(45deg);
}
.check input:focus-visible+.box{border-color:var(--gold)}
.check-body{flex:1}
.check-title{color:var(--cream);font-size:1.3125rem}
.check-sub{color:var(--text);font-size:1.1875rem;margin-top:.2rem}
.check.invalid .box{border-color:var(--error)}

/* ---------- covered persons table ---------- */

.persons{margin-top:.5rem}
.person{
  border:1px solid var(--line); padding:1.5rem;
  margin-bottom:1rem; position:relative;
}
.person-num{
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.22em; color:var(--gold); margin-bottom:1rem;
}
.person-remove{
  position:absolute; top:1.25rem; right:1.25rem;
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.16em; text-transform:uppercase;
  color:var(--text); background:none; border:none; cursor:pointer;
  transition:color .3s;
}
.person-remove:hover{color:var(--error)}

/* ---------- buttons ---------- */

.btn{
  background:var(--gold); color:var(--void); border:none;
  padding:.875rem 2.75rem;
  font-family:'DM Sans',sans-serif; font-size:1.125rem; font-weight:500;
  letter-spacing:.08em; text-transform:uppercase;
  cursor:pointer; display:inline-block;
  transition:transform .2s,box-shadow .3s,opacity .3s;
}
.btn:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 12px 40px rgba(196,162,74,.2)}
.btn:disabled{opacity:.4;cursor:not-allowed}
.btn.ghost{
  background:none; border:1px solid var(--line); color:var(--text);
  font-family:'Space Mono',monospace; font-size:.9375rem; font-weight:400;
  letter-spacing:.14em; padding:.5rem 1.5rem;
}
.btn.ghost:hover{transform:none;box-shadow:none;border-color:var(--gold);color:var(--gold)}

.actions{
  display:flex; gap:1rem; align-items:center;
  margin-top:3.5rem; padding-top:2.5rem;
  border-top:1px solid var(--line); flex-wrap:wrap;
}
.actions .spacer{flex:1}
.saved{
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.18em; text-transform:uppercase; color:var(--text);
}

/* ---------- states ---------- */

.form-error{
  color:var(--error); font-size:1.0625rem;
  border-left:2px solid var(--error); padding-left:1rem; margin:1.5rem 0;
}
.form-success{padding:4rem 0}
.form-success h2{
  font-family:'Cormorant Garamond',Georgia,serif; font-weight:300;
  font-size:2.25rem; color:var(--cream); margin-bottom:1.5rem;
}
.form-success p{color:var(--warm);margin-bottom:1rem;max-width:38rem}

.gate{padding:4rem 0;text-align:left}
.gate h2{
  font-family:'Cormorant Garamond',Georgia,serif; font-weight:300;
  font-size:2rem; color:var(--cream); margin-bottom:1.25rem;
}
.gate p{color:var(--warm);max-width:38rem;margin-bottom:1rem}

.foot{
  border-top:1px solid var(--line); margin-top:6rem;
  padding:2.5rem 2rem; text-align:center;
}
.foot span{
  font-family:'Space Mono',monospace; font-size:.875rem;
  letter-spacing:.22em; text-transform:uppercase; color:var(--text);
}