:root{
      --ink:#1f1e19;
      --cream:#f3ead8;
      --paper:#e7dcc6;
      --gold:#c59a4a;
      --rust:#8f4e35;
      --forest:#394634;
      --shadow:rgba(21,18,13,.35);
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      color:var(--ink);
      background:#171713;
      font-family: Georgia, 'Times New Roman', serif;
      line-height:1.5;
    }
    a{text-decoration:none;color:inherit}
    .hero{
      min-height:92vh;
      display:grid;
      place-items:center;
      position:relative;
      overflow:hidden;
      background:
        linear-gradient(rgba(18,16,12,.42),rgba(18,16,12,.74)),
        radial-gradient(circle at 25% 25%, rgba(197,154,74,.20), transparent 34%),
        linear-gradient(135deg,#53614b 0%,#2f392d 44%,#171713 100%);
    }
    .hero:before{
      content:"";
      position:absolute; inset:0;
      opacity:.16;
      background-image:
        repeating-linear-gradient(0deg, transparent 0 3px, rgba(255,255,255,.05) 4px),
        repeating-linear-gradient(90deg, transparent 0 7px, rgba(255,255,255,.025) 8px);
      mix-blend-mode:screen;
    }
    .hero-inner{
      width:min(980px,92vw);
      color:#fff8ea;
      text-align:center;
      padding:80px 20px;
      position:relative;
      z-index:2;
    }
    .eyebrow{
      font-family: Arial, Helvetica, sans-serif;
      letter-spacing:.24em;
      text-transform:uppercase;
      font-size:.78rem;
      opacity:.9;
      margin-bottom:18px;
    }
    h1{
      font-size:clamp(3rem,8vw,6.8rem);
      margin:.06em 0;
      line-height:.95;
      font-weight:600;
      text-shadow:0 4px 24px var(--shadow);
    }
    .hero .sub{
      font-size:clamp(1.25rem,2.5vw,2rem);
      max-width:760px;
      margin:24px auto 0;
      font-style:italic;
    }
    .date{
      margin:34px auto 22px;
      font-family: Arial, Helvetica, sans-serif;
      font-size:1rem;
      letter-spacing:.08em;
      text-transform:uppercase;
    }
    .cta{
      display:inline-block;
      margin:14px 8px 0;
      padding:15px 24px;
      border:1px solid rgba(255,255,255,.72);
      background:rgba(243,234,216,.08);
      border-radius:999px;
      font-family:Arial, Helvetica, sans-serif;
      font-weight:700;
      letter-spacing:.06em;
      text-transform:uppercase;
      transition:.2s;
    }
    .cta:hover{transform:translateY(-2px);background:rgba(243,234,216,.16)}
    .cta.primary{background:var(--gold);color:#1b1914;border-color:var(--gold)}

    main{
      background:
        linear-gradient(rgba(243,234,216,.97),rgba(243,234,216,.97)),
        repeating-linear-gradient(0deg,#0000 0 28px,rgba(77,63,46,.08) 29px);
    }
    section{padding:88px 20px}
    .wrap{width:min(1100px,92vw);margin:auto}
    .section-title{
      text-align:center;
      font-size:clamp(2.2rem,5vw,4rem);
      margin:0 0 14px;
    }
    .lead{
      max-width:780px;
      margin:0 auto 42px;
      text-align:center;
      font-size:1.15rem;
    }

    .memory-grid{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:22px;
    }
    .card{
      min-height:380px;
      position:relative;
      overflow:hidden;
      border-radius:8px;
      box-shadow:0 14px 35px rgba(31,30,25,.18);
      background:#2e332a;
      color:white;
    }
    .card .bg{
      position:absolute;inset:0;
      background-size:cover;background-position:center;
      filter:saturate(.72) contrast(.96) sepia(.18);
      transform:scale(1.02);
    }
    .card:after{
      content:"";position:absolute;inset:0;
      background:linear-gradient(transparent 35%,rgba(20,18,14,.84));
    }
    .card-body{
      position:absolute;z-index:3;left:22px;right:22px;bottom:22px;
    }
    .card h3{font-size:2rem;margin:0 0 5px}
    .card p{margin:0;opacity:.9}
    .school .bg{
      background:
        linear-gradient(rgba(65,72,62,.12),rgba(43,49,41,.08)),
        url('https://des.rale.k12.wv.us/');
      background-color:#55604f;
    }
    .school .placeholder{
      position:absolute; inset:0; display:grid; place-items:center;
      padding:30px; text-align:center; color:#eee4d1; z-index:1;
      background:
        radial-gradient(circle at 45% 36%,rgba(255,255,255,.08),transparent 22%),
        linear-gradient(140deg,#6c725f,#31352d);
      font-family:Arial,Helvetica,sans-serif;
      letter-spacing:.08em;
      text-transform:uppercase;
      font-size:.88rem;
    }
    .beaver .bg{
      background-image:url('https://l.icdbcdn.com/oh/cfd74b75-24a1-4836-8eef-2976d7adc90e.jpg');
    }
    .rink .bg{
      background:
        radial-gradient(circle at 28% 20%,rgba(235,124,84,.25),transparent 30%),
        radial-gradient(circle at 74% 63%,rgba(98,122,176,.24),transparent 35%),
        repeating-linear-gradient(90deg,#554938 0 24px,#4c4033 25px 48px);
    }

    .story{
      background:#253025;color:#f5eddf;
      text-align:center;
    }
    .story blockquote{
      font-size:clamp(1.7rem,4vw,3.2rem);
      max-width:900px;margin:0 auto 22px;
      line-height:1.25;
    }
    .story p{max-width:760px;margin:auto;font-size:1.08rem;opacity:.92}

    .teachers{
      background:#e7dcc6;
    }
    .chalkboard{
      background:#2d382f;
      color:#f3ead8;
      max-width:920px;
      margin:35px auto 0;
      border:14px solid #8e6945;
      box-shadow:inset 0 0 45px rgba(255,255,255,.04),0 18px 45px rgba(31,30,25,.18);
      padding:38px 32px 34px;
      text-align:center;
      position:relative;
    }
    .chalkboard:after{
      content:"";
      position:absolute;left:8%;right:8%;bottom:-20px;height:8px;
      background:#6c4b31;border-radius:4px;
    }
    .names{
      font-family:"Trebuchet MS",Arial,sans-serif;
      font-size:clamp(1.25rem,3vw,2rem);
      line-height:1.8;
    }
    .names span{white-space:nowrap}
    .help{
      margin-top:26px;
      font-family:Arial,Helvetica,sans-serif;
      font-size:.9rem;
      opacity:.86;
    }

    .reunion{
      background:#f3ead8;
    }
    .ticket{
      max-width:860px;margin:0 auto;
      border:2px dashed #846c49;
      background:#fffaf0;
      padding:42px;
      text-align:center;
      box-shadow:0 14px 35px rgba(31,30,25,.12);
    }
    .ticket .big{font-size:clamp(2.2rem,6vw,4.8rem);margin:4px 0 12px}
    .zoom{
      display:inline-block;
      margin-top:22px;
      padding:16px 28px;
      background:#282b27;
      color:white;
      border-radius:999px;
      font-family:Arial,Helvetica,sans-serif;
      font-weight:700;
      letter-spacing:.05em;
    }
    .zoom small{display:block;font-weight:400;opacity:.65;margin-top:3px}

    .participate{
      background:#dccfb8;
    }
    .actions{
      display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:38px;
    }
    .action{
      background:#f5edde;
      border:1px solid rgba(65,54,37,.16);
      padding:28px;
      min-height:190px;
      box-shadow:0 10px 25px rgba(31,30,25,.08);
    }
    .action h3{margin-top:0;font-size:1.45rem}
    .action a{
      display:inline-block;margin-top:8px;
      font-family:Arial,Helvetica,sans-serif;font-weight:700;
      border-bottom:2px solid var(--rust);
    }

    footer{
      background:#171713;color:#d9ccb3;text-align:center;padding:44px 20px;
      font-size:.95rem;
    }
    footer strong{color:white}
    .note{opacity:.62;font-size:.82rem;margin-top:10px}
    @media(max-width:800px){
      .memory-grid,.actions{grid-template-columns:1fr}
      .card{min-height:330px}
      section{padding:68px 18px}
    }

.story .eyebrow{
  color:#cdbb93;
  margin-bottom:22px;
}

.story-copy{
  max-width:780px;
  margin:34px auto 0;
}

.story-copy p{
  margin:0 auto 22px;
}

.story-emphasis{
  font-size:1.35rem !important;
  font-style:italic;
  color:#e4c987;
}

.story-question{
  margin-top:34px !important;
  font-size:clamp(1.45rem,3vw,2.2rem) !important;
  font-weight:700;
  color:#fff8ea;
}

.became{
  background:#efe4cf;
  text-align:center;
}

.became .eyebrow{
  color:#755f3d;
}

.became-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:22px;
  max-width:920px;
  margin:42px auto 0;
  text-align:left;
}

.became-card{
  background:#fffaf0;
  border:1px solid rgba(65,54,37,.15);
  padding:34px;
  min-height:220px;
  box-shadow:0 12px 28px rgba(31,30,25,.09);
}

.became-card-now{
  background:#2d382f;
  color:#f3ead8;
}

.became-label{
  font-family:Arial,Helvetica,sans-serif;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:.76rem;
  font-weight:700;
  margin-bottom:14px;
  opacity:.72;
}

.became-card h3{
  margin:0 0 14px;
  font-size:1.7rem;
}

.became-card p{
  margin:0;
}

.became-note{
  max-width:720px;
  margin:30px auto 0;
  font-size:.95rem;
  font-style:italic;
  opacity:.72;
}

@media(max-width:800px){
  .became-grid{
    grid-template-columns:1fr;
  }
}

.reconnect{
  background:#f3ead8;
  text-align:center;
}

.reconnect .eyebrow{
  color:#755f3d;
}

.reconnect-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
  margin-top:42px;
  text-align:left;
}

.reconnect-step{
  position:relative;
  background:#e7dcc6;
  padding:32px;
  border-top:4px solid #8f4e35;
}

.step-number{
  font-family:Arial,Helvetica,sans-serif;
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.18em;
  color:#8f4e35;
  margin-bottom:22px;
}

.reconnect-step h3{
  margin:0 0 12px;
  font-size:1.55rem;
}

.reconnect-step p{
  margin:0;
}

.reconnect-callout{
  max-width:780px;
  margin:44px auto 0;
  padding-top:28px;
  border-top:1px solid rgba(65,54,37,.22);
  font-size:1.15rem;
}

.reconnect-callout strong,
.reconnect-callout span{
  display:block;
}

.reconnect-callout span{
  margin-top:5px;
  font-style:italic;
  opacity:.72;
}

@media(max-width:800px){
  .reconnect-grid{
    grid-template-columns:1fr;
  }
}

.contribute{
  background:#dccfb8;
  text-align:center;
}

.contribute .eyebrow{
  color:#755f3d;
}

.memory-form{
  max-width:860px;
  margin:42px auto 0;
  padding:38px;
  background:#fffaf0;
  box-shadow:0 14px 35px rgba(31,30,25,.12);
  text-align:left;
}

.form-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:22px;
}

.memory-form label{
  display:block;
}

.memory-form label span{
  display:block;
  margin-bottom:8px;
  font-family:Arial,Helvetica,sans-serif;
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.memory-form input,
.memory-form textarea{
  width:100%;
  border:1px solid rgba(65,54,37,.28);
  background:#f7f0e3;
  padding:14px 15px;
  font:inherit;
  color:#1f1e19;
  border-radius:2px;
}

.memory-form input:focus,
.memory-form textarea:focus{
  outline:2px solid #c59a4a;
  outline-offset:2px;
}

.form-wide{
  margin-top:24px;
}

.privacy-note{
  margin-top:24px;
  padding:18px 20px;
  background:#eee2cc;
  border-left:4px solid #394634;
  font-size:.92rem;
}

.privacy-note strong{
  display:block;
  margin-bottom:4px;
}

.submit-memory{
  display:block;
  margin:28px auto 0;
  padding:15px 26px;
  border:0;
  border-radius:999px;
  background:#394634;
  color:#fff8ea;
  font-family:Arial,Helvetica,sans-serif;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  cursor:pointer;
}

.prototype-note{
  margin:12px 0 0;
  text-align:center;
  font-family:Arial,Helvetica,sans-serif;
  font-size:.78rem;
  opacity:.55;
}

@media(max-width:800px){
  .memory-form{
    padding:26px 20px;
  }

  .form-grid{
    grid-template-columns:1fr;
  }
}

.form-section{
  margin:28px 0 0;
  padding:0;
  border:0;
}

.form-section legend{
  margin-bottom:12px;
  font-family:Arial,Helvetica,sans-serif;
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.choice-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
}

.choice,
.consent{
  display:flex !important;
  align-items:flex-start;
  gap:10px;
  padding:14px;
  background:#f1e7d5;
  border:1px solid rgba(65,54,37,.16);
  cursor:pointer;
}

.choice input,
.consent input{
  width:auto;
  margin-top:3px;
}

.choice span,
.consent span{
  margin:0 !important;
  text-transform:none !important;
  letter-spacing:0 !important;
  font-family:Georgia,"Times New Roman",serif !important;
  font-weight:400 !important;
  font-size:1rem !important;
}

.consent-section{
  display:grid;
  gap:12px;
}

@media(max-width:800px){
  .choice-grid{
    grid-template-columns:1fr;
  }
}

/* Reunion form compact pass */
.memory-form textarea {
  min-height: 110px;
}

.memory-form textarea[name="memory"],
.memory-form textarea[name="life-story"] {
  min-height: 140px;
}