:root{
    --ink:#150e09;
    --panel:#231409;
    --panel-2:#2c1c10;
    --edge:#4a3117;
    --gold:#c9a24b;
    --gold-bright:#eecf83;
    --cream:#f4ead6;
    --cream-dim:#c9bca4;
    --wine:#7a3b3b;
    --wine-bright:#a85252;
    --ok:#7a9a6b;
    --radius:2px;
  }

  *{box-sizing:border-box;}

  body{
    margin:0;
    min-height:100vh;
    background:
      radial-gradient(ellipse at 20% -10%, #2a1a0e 0%, transparent 55%),
      radial-gradient(ellipse at 100% 110%, #24160c 0%, transparent 55%),
      var(--ink);
  }

  /* ---------- native dialog ---------- */
  dialog.rg-modal{
    width:100%;
    max-width:520px;
    max-height:92vh;
    overflow-y:auto;
    background:linear-gradient(160deg,var(--panel) 0%, var(--panel-2) 100%);
    border:1px solid var(--edge);
    border-radius:6px;
    padding:0;
    position:fixed;
    color:var(--cream);
    box-shadow:0 40px 80px -30px rgba(0,0,0,.7);
    margin:auto;
  }
  dialog.rg-modal::backdrop{
    background:rgba(9,6,3,.72);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);

  }
  dialog.rg-modal[open]{
    animation:rise .38s cubic-bezier(.2,.8,.25,1);
    display:block;
  }
  @keyframes rise{
    from{opacity:0; transform:translateY(18px) scale(.98);}
    to{opacity:1; transform:translateY(0) scale(1);}
  }
  @media (prefers-reduced-motion: reduce){
    dialog.rg-modal[open]{animation:none;}
  }

  .rg-modal-header{
    padding:34px 34px 22px;
    text-align:center;
  }
  .seal{
    font-size:20px;
    color:var(--gold);
    margin-bottom:10px;
    letter-spacing:.1em;
  }
  .rg-modal-eyebrow{
    font-size:10.5px;
    letter-spacing:.22em;
    text-transform:uppercase;
    color:var(--gold);
    margin-bottom:8px;
  }
  .rg-modal-header h2{
    font-family:'Cormorant Garamond', serif;
    font-weight:500;
    font-style:italic;
    font-size:clamp(28px,4.4vw,36px);
    margin:0 0 10px;
    color:var(--cream);
    line-height:1.15;
  }
  .rg-modal-meta{
    color:var(--cream-dim);
    font-size:13px;
    line-height:1.7;
  }
  .rg-modal-meta strong{color:var(--cream);font-weight:600;}

  /* ---------- kintsugi seam divider (signature element) ---------- */
  .seam{
    display:block;
    width:100%;
    height:22px;
  }
  .seam path{
    fill:none;
    stroke:url(#seamGold);
    stroke-width:1.6;
    stroke-linecap:round;
    filter:drop-shadow(0 0 3px rgba(201,162,75,.45));
  }
  .seam .seam-fracture{
    stroke:url(#seamWine);
    stroke-width:1;
    opacity:.55;
  }

  /* ---------- body ---------- */
  .rg-modal-body{
    padding:6px 34px 34px;
  }

  .field{margin-bottom:18px;}
  .field label{
    display:block;
    font-size:11.5px;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--gold);
    margin-bottom:8px;
  }
  .field input[type=text],
  .field input[type=email]{
    width:100%;
    background:rgba(0,0,0,.22);
    border:1px solid var(--edge);
    border-radius:var(--radius);
    padding:13px 14px;
    color:var(--cream);
    font-family:'DM Sans',sans-serif;
    font-size:14.5px;
    transition:border-color .15s;
  }
  .field input::placeholder{color:#7d6c56;}
  .field input:focus{
    outline:none;
    border-color:var(--gold);
    box-shadow:0 0 0 3px rgba(201,162,75,.15);
  }
  .field-error{
    display:none;
    color:var(--wine-bright);
    font-size:12px;
    margin-top:6px;
  }
  .field.invalid input{border-color:var(--wine-bright);}
  .field.invalid .field-error{display:block;}

  fieldset.field{
    border:none;
    padding:0;
    margin:0 0 18px;
  }
  fieldset.field legend{
    font-size:11.5px;
    letter-spacing:.08em;
    text-transform:uppercase;
    color:var(--gold);
    margin-bottom:8px;
    padding:0;
    width:100%;
  }

  .method-btn{
    flex-direction:column;
    gap:6px;
    font-size:12.5px;
    color:var(--cream-dim);
  }
  .method-btn .glyph{
    font-size:16px;
    color:var(--gold);
  }
  .method-btn:has(input:checked), .method-btn.active{
    color:var(--cream);
  }

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

  .method-btn{
    font-family:'DM Sans',sans-serif;
    font-weight:600;
    font-size:14px;
    color:var(--cream);
    background:rgba(255,255,255,.03);
    border:1px solid var(--edge);
    border-radius:var(--radius);
    padding:12px 6px;
    cursor:pointer;
    transition:.15s;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    -webkit-user-select:none;
     user-select:none;
  }
  .method-btn:hover{border-color:var(--gold);}
  .method-btn.active{
    background:rgba(201,162,75,.12);
    border-color:var(--gold);
    color:var(--gold-bright);
  }
  .method-btn:focus-within{
    outline:2px solid var(--gold-bright);
    outline-offset:2px;
  }

  .method-btn{
    flex-direction:column;
    gap:6px;
    font-size:12.5px;
    color:var(--cream-dim);
  }
  .method-btn .glyph{
    font-size:16px;
    color:var(--gold);
  }
  .method-btn:has(input:checked), .method-btn.active{
    color:var(--cream);
  }

  .instructions{
    margin-top:14px;
    padding:14px 16px;
    border:1px dashed var(--edge);
    border-radius:var(--radius);
    background:rgba(0,0,0,.18);
    font-size:12.5px;
    line-height:1.7;
    color:var(--cream-dim);
    display:none;
  }
  .instructions.show{display:block;}
  .instructions strong{color:var(--gold-bright);}

  .submit-btn{
    width:100%;
    margin-top:8px;
    font-family:'DM Sans',sans-serif;
    font-weight:700;
    font-size:14.5px;
    letter-spacing:.02em;
    color:var(--ink);
    background:linear-gradient(135deg,var(--gold-bright),var(--gold));
    border:none;
    padding:16px;
    border-radius:var(--radius);
    cursor:pointer;
    transition:filter .15s, transform .1s;
  }
  .submit-btn:hover{filter:brightness(1.06);}
  .submit-btn:active{transform:translateY(1px);}
  .submit-btn:disabled{opacity:.55; cursor:not-allowed;}
  .submit-btn:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px;}

  .fine{
    text-align:center;
    color:#7d6c56;
    font-size:11.5px;
    margin-top:14px;
    line-height:1.6;
  }

  .status{
    display:none;
    margin-top:14px;
    padding:12px 14px;
    border-radius:var(--radius);
    font-size:13px;
    line-height:1.6;
  }
  .status.show{display:block;}
  .status.success{background:rgba(122,154,107,.12); border:1px solid var(--ok); color:#cfe0c4;}
  .status.error{background:rgba(168,82,82,.12); border:1px solid var(--wine-bright); color:#f0cfcf;}

  @media (max-width:480px){
    .rg-modal-header, .rg-modal-body{padding-left:22px; padding-right:22px;}
    .method-grid{grid-template-columns:repeat(3,1fr);}

    .rg-modal-header h2 {
    font-size: 1.8rem; /* Reduce heading size */
    word-wrap: break-word;
  }
  .rg-modal-meta {
    font-size: 0.85rem; /* Slightly smaller meta text */
    word-wrap: break-word;
  }
  .rg-modal-eyebrow {
    font-size: 0.7rem; /* Smaller eyebrow text */
    word-wrap: break-word;
  }
  .fine {
    font-size: 0.7rem; /* Smaller fine print */
    word-wrap: break-word;
  }
  }