*{box-sizing:border-box;}
  body{ margin:0; min-height:100vh; background:var(--ivory); color:var(--text-dark); font-family:'Jost','Helvetica Neue',Arial,sans-serif; -webkit-font-smoothing:antialiased; }
  h1,h2,h3{ font-family:'Fraunces','Georgia',serif; font-weight:500; margin:0; }
  .eyebrow{ font-family:'Jost',sans-serif; text-transform:uppercase; letter-spacing:0.26em; font-size:11.5px; font-weight:500; }
  button{ font-family:inherit; }
  :focus-visible{ outline:2px solid var(--highlight-color); outline-offset:3px; }

  .spacer {padding: 50px 0}

  /*.shell{ display:grid; grid-template-columns: 42% 58%; min-height:100vh; }*/
  .shell{width: 100%; height: 100svh;}

  /* ---- brand panel ---- */
  .brand-panel{
    position:relative; overflow:hidden;
    background: radial-gradient(120% 90% at 15% 10%, rgba(201,162,75,0.3), transparent 55%), linear-gradient(160deg, #6b2440, #3a0f21 60%, #200712);
    color:var(--text-light);
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    padding:60px 8%; text-align:center;
    width: var(--col-split2);
    height: 100svh;
    position: fixed;
    z-index: 1;

  }
  .brand-panel::before{
    content:""; position:absolute; inset:0;
    background-image: linear-gradient(135deg, transparent 48%, var(--highlight-color-line) 48%, var(--highlight-color-line) 52%, transparent 52%);
    background-size:50px 50px; opacity:0.06;
  }
  .monogram{ font-family:'Fraunces',serif; font-style:italic; font-size:80px; color:var(--highlight-color-soft); line-height:1; position:relative; z-index:1; }
  .monogram img{max-height: 180px}
  .brand-panel .names{ margin-top:14px; font-size: clamp(26px, 3vw, 34px); position:relative; z-index:1; }
  .brand-panel .names .amp{ color:var(--highlight-color); font-style:italic; padding:0 6px; }
  .brand-panel .tagline{ margin-top:14px; font-size:14px; color:var(--text-muted); max-width:36ch; line-height:1.7; position:relative; z-index:1; }

  .ornament{ display:flex; align-items:center; justify-content:center; gap:10px; margin:26px 0; position:relative; z-index:1; }
  .ornament .oline{ width:36px; height:1px; background:var(--highlight-color-line); }
  .ornament .odiamond{ width:6px; height:6px; background:var(--highlight-color); transform:rotate(45deg); }

  .meta-stack{ position:relative; z-index:1; display:flex; flex-direction:column; gap:10px; }
  .meta-chip{ display:inline-flex; align-items:center; gap:8px; justify-content:center; font-size:13px; color:var(--text-light); background: rgba(0,0,0,0.2); border:1px solid var(--highlight-color-line); padding:9px 16px; border-radius:999px; }
  .meta-chip svg{ width:14px; height:14px; stroke:var(--highlight-color); flex-shrink:0; }

  /* ---- form panel ---- */
  .form-panel{ display:flex; align-items:center; justify-content:center; padding:60px 8%; position: relative; min-height: 100svh; margin-left: var(--col-split2); width: calc(100% - var(--col-split2)); scroll-behavior: smooth;}
  .form-card{ width:100%; max-width:460px;}
  .form-card .eyebrow{ color:var(--primary-color); }
  .form-card h1{ margin-top:12px; font-size: clamp(28px, 3vw, 36px); color:var(--ink); }
  .form-card .lead{ margin-top:12px; font-size:14.5px; color:var(--text-dark-muted); line-height:1.7; }
  .rule{ width:50px; height:2px; background:var(--highlight-color); margin:22px 0 28px; }

  .lookup-form{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:26px; align-items:end; }
  .lookup-form .field{ display:flex; flex-direction:column; gap:7px; }
  .lookup-form .field label{ font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-dark-muted); }
  .lookup-form .field input{ border:none; border-bottom:1px solid var(--highlight-color-line); background:transparent; padding:9px 2px; font-size:14.5px; color:var(--text-dark); outline:none; }
  .lookup-form .field input:focus{ border-color:var(--primary-color); }
  .lookup-form .lookup-btn{ grid-column:1/-1; margin-top:6px; background:var(--primary-color); color:var(--text-light); border:1px solid var(--primary-color); padding:14px 30px; font-size:11.5px; letter-spacing:0.18em; text-transform:uppercase; cursor:pointer; transition: background 0.25s ease, transform 0.2s ease; justify-self:start; }
  .lookup-form .lookup-btn:hover{ background:var(--primary-color-deep); transform:translateY(-1px); }
  .lookup-result{ margin-top:22px; display:none; }
  .lookup-result.show{ display:block; }
  .lookup-card{ padding:20px 22px; border:1px solid rgba(92,26,52,0.18); background: rgba(92,26,52,0.04); }
  .lookup-card .name{ font-family:'Fraunces',serif; font-size:18px; color:var(--ink); }
  .lookup-badge{ display:inline-block; margin-top:9px; padding:5px 13px; border-radius:999px; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; }
  .lookup-badge.going{ background: rgba(31,77,62,0.12); color:var(--emerald); }
  .lookup-badge.not{ background: rgba(92,26,52,0.12); color:var(--primary-color); }
  .lookup-badge.maybe{ background: rgba(201,162,75,0.2); color:#8a6a1f; }
  .lookup-card p{ margin-top:10px; font-size:13.5px; color:var(--text-dark-muted); }
  .lookup-card .mini-btn{ margin-top:12px; background:none; border:1px solid var(--primary-color); color:var(--primary-color); padding:8px 16px; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; cursor:pointer; border-radius:999px; }

  .rsvp-hint{ display:flex; align-items:center; gap:7px; font-size:11px; letter-spacing:0.12em; text-transform:uppercase; color:var(--primary-color); margin-bottom:12px; }
  .rsvp-hint.hidden{ display:none; }
  .rsvp-hint svg{ width:12px; height:12px; stroke:var(--highlight-color); animation: bounceDown 1.4s ease-in-out infinite; }
  @keyframes bounceDown{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(4px); } }

  .rsvp-toggle{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; margin-bottom:26px; }
  .rsvp-toggle button{ padding:12px 6px; background:transparent; border:1px solid rgba(92,26,52,0.3); color:var(--text-dark); font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; cursor:pointer; transition: border-color 0.25s ease, background 0.25s ease, box-shadow 0.25s ease; }
  .rsvp-toggle button.active{ background:var(--primary-color); border-color:var(--primary-color); color:var(--text-light); }
  .rsvp-toggle.attn button{ animation: pulseBorder 1.8s ease-in-out infinite; }
  @keyframes pulseBorder{ 0%,100%{ border-color: rgba(92,26,52,0.3); box-shadow:none; } 50%{ border-color: var(--highlight-color); box-shadow: 0 0 0 4px rgba(201,162,75,0.16); } }
  .rsvp-toggle.shake{ animation: shakeX 0.45s ease; }
  @keyframes shakeX{ 0%,100%{ transform:translateX(0); } 20%{ transform:translateX(-6px); } 40%{ transform:translateX(6px); } 60%{ transform:translateX(-4px); } 80%{ transform:translateX(4px); } }
  .rsvp-toggle.small{ grid-template-columns:repeat(4,1fr); margin-bottom:0; }
  .rsvp-toggle.small button{ font-size:10.5px; padding:11px 4px; }

  .group-label{ display:block; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-dark-muted); margin-bottom:12px; }
  .sub-group{ margin-bottom:26px; }
  .sub-group.hidden{ display:none; }
  .info-box{ display:none; margin-top:16px; padding:16px 18px; background: rgba(92,26,52,0.06); border-left:3px solid var(--highlight-color); font-size:13.5px; line-height:1.65; color:var(--text-dark-muted); }
  .info-box.show{ display:block; }

  .field-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:14px; }
  .field{ display:flex; flex-direction:column; gap:7px; }
  .field.full{ grid-column:1/-1; }
  .field label{ font-size:10.5px; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-dark-muted); }
  .field input, .field select{ border:none; border-bottom:1px solid rgba(92,26,52,0.35); background:transparent; padding:9px 2px; font-size:14.5px; color:var(--text-dark); outline:none; }
  .field textarea{ border:1px solid rgba(92,26,52,0.3); background:transparent; padding:10px 12px; font-size:14px; color:var(--text-dark); outline:none; font-family:inherit; resize:vertical; }
  .field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--primary-color); }

  .upload-wrapper{display:inline-block;position:relative;overflow:hidden}
  .upload-btn{background:var(--highlight-color-soft);color:var(--text-dark-muted);padding:10px 20px;margin:0 auto 10px;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-family:sans-serif;transition:background 0.3s ease}
  .upload-btn:hover{background:var(--highlight-color)}
  .upload-input{position:absolute;left:0;top:0;opacity:0;cursor:pointer;height:100%;width:100%}
  .upload-photo-preview{display:none;max-width:200px;margin-top:10px;border-radius:6px;cursor:pointer}
  .remove-btn{position:absolute;top:5px;right:5px;background:red;color:#fff;border:none;border-radius:50%;width:24px;height:24px;font-weight:700;cursor:pointer;padding:0;font-size:small;display:none}

  .submit-btn{ margin-top:12px; width:100%; background:var(--primary-color); color:var(--text-light); border:1px solid var(--primary-color); padding:15px 30px; font-size:12px; letter-spacing:0.18em; text-transform:uppercase; cursor:pointer; transition: background 0.25s ease, transform 0.2s ease; }
  .submit-btn:hover{ background:var(--primary-color-deep); transform:translateY(-1px); }

  .login-btn{
    width:100%; margin-top:10px;
    background:var(--primary-color); color:var(--ivory); border:1px solid var(--primary-color);
    padding:15px 30px; font-size:12px; letter-spacing:0.2em; text-transform:uppercase;
    cursor:pointer; transition: background 0.25s ease, transform 0.2s ease;
  }
  .login-btn:hover{ background:var(--primary-color-deep); transform:translateY(-1px); }

  .rsvp-form.hidden{ display:none; }

  .home-link{
    display:inline-block; margin-top:38px; font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
    color:var(--primary-color); text-decoration:none; border-bottom:1px solid var(--highlight-color); padding-bottom:3px;
    position:relative; z-index:1;
  }

  .success{ display:none; text-align:center; padding:20px 0; }
  .success.left{ text-align:left; }
  .success.show{ display:block; }
  .success .seal-mini{ width:60px; height:60px; border-radius:50%; margin:0 auto 20px; background: radial-gradient(circle at 35% 30%, #d8b56a, var(--highlight-color) 55%, #93712c 100%); display:flex; align-items:center; justify-content:center; font-family:'Fraunces',serif; font-weight:600; color:#3a2408; font-size:20px; }
  .success h2{ font-size:26px; color:var(--ink); }
  .success.no h3{color:red; }
  .success p{ margin-top:10px; font-size:14.5px; color:var(--text-dark-muted); line-height:1.7; }
  .success .rsvp-summary{ margin-top:18px; font-size:13px; letter-spacing:0.06em; color:var(--primary-color); text-transform:uppercase; }
  .success .home-link{ display:inline-block; margin-top:26px; font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--primary-color); text-decoration:none; border-bottom:1px solid var(--highlight-color-line); padding-bottom:3px; }

  .success.show.error { margin-top:10px; display: block; font-size:12px; color:var(--text-dark-muted); line-height:1.6; padding:12px 14px; background: rgba(92,26,52,0.06); border-left:3px solid var(--highlight-color); text-align:left;}
  
  .rsvp-toggle.error-border::before,
  .require-event-session-selection.error-border::before {content: 'Please select an option'; position: absolute; color: red; margin: 45px 0; font-size: smaller;}
  .require-event-session-selection.error-border::before {margin: 70px 0;}

  .confetto{ position:fixed; top:-12px; width:8px; height:16px; z-index:999; pointer-events:none; animation: fall linear forwards; }
  @keyframes fall{ to{ transform: translateY(108vh) rotate(400deg); opacity:0.9; } }
  
    .iv_wrap_small { width: 400px; margin: 50px 0; }
    .iv_wrap img,
    .iv_wrap_small img{ width: 100%; }

  footer{ position:absolute; bottom: 0; padding:20px 0; color:var(--text-dark-muted); font-size:12.5px; }
  footer .mono-foot{ font-family:'Fraunces',serif; font-style:italic; font-size:19px; color:var(--primary-color); margin-bottom:6px; }
  .foot_link {padding: 30px 0;}
  .foot_link a { font-size: 14px; color: var(--highlight-color); text-decoration: none; transition: .3s all ease-in-out; letter-spacing: 2px; text-transform: uppercase; border-bottom: 1px solid var(--highlight-color-line); padding-bottom: 3px; }
  .foot_link a:hover { color: var(--highlight-color); text-decoration: none }
  .foot_link span { margin: auto 7px; }

  @media (max-width: 1199px){
    .monogram img{max-height: 130px}
  }

  @media (max-width: 991px){
    .brand-panel{ padding:50px 8%; width: 100%; height: auto; position: relative; }
    .form-panel {margin-left: 0; width: 100%;}
  }

  @media (max-width: 860px){
    .brand-panel{ padding:50px 8% 40px; }
    .monogram{ font-size:60px; }
    .monogram img{max-height: 130px}
    .meta-chip{ gap:4px; background: rgba(0,0,0,0.3); }
    .form-panel{ padding:44px 7%; }
    .field-row{ grid-template-columns:1fr; }
    .rsvp-toggle{ grid-template-columns:1fr 1fr; }
    .rsvp-toggle button:last-child{ grid-column:1/-1; }
    .rsvp-toggle.small{ grid-template-columns:1fr 1fr; }
    .rsvp-toggle.small button:last-child{ grid-column:auto; }
  }
  @media (max-width: 399px){
    .monogram img{max-height: 100px}
    .form-card { max-width: 300px; }
    .lookup-form { grid-template-columns: none; }
    
    .iv_wrap_small { width: 300px; }
  }
  @media (prefers-reduced-motion: reduce){ *{ animation-duration:0.01ms !important; transition-duration:0.01ms !important; } }