/* contact form */
.contact{ margin-top:24px; display:grid; gap:12px }
.grid2{ display:grid; grid-template-columns:1fr 1fr; gap:12px }
.contact input, .contact textarea{
    width:100%; background:#0b0b0b; border:1px solid rgba(255,255,255,.12);
    color:#fff; border-radius:12px; padding:14px 16px;
}
.contact button{
    justify-self:center; background:#fff; color:#000; border:none;
    border-radius:999px; padding:12px 18px; cursor:pointer;
}

/* Blog panel look */
.blog-panel{
    max-width: 1000px;
    width: min(92vw, 1000px);
    margin: 0 auto;
    background: #000;
    border: 1px solid rgba(255,255,255,.14);
    box-shadow: 0 0 0 1px rgba(255,255,255,.06);
    padding: clamp(20px, 3vw, 28px);
}

.blog-title{
    font-family: "Playfair Display", Georgia, serif;
    font-weight: 700;
    letter-spacing: .02em;
    font-size: clamp(26px, 3.2vw, 40px);
    margin: 0 0 16px;
}

/* Subscribe bar */
.subscribe{
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 16px;
}
.subscribe input{
    background:#181a1b; color:#fff;
    border:1px solid rgba(255,255,255,.18);
    padding: 16px 18px;
    border-radius: 2px;
}
.btn{
    display:inline-flex; align-items:center; justify-content:center;
    padding: 14px 24px; border-radius: 2px;
    cursor:pointer; text-decoration:none; white-space:nowrap;
}
.btn--gold{
    background: transparent; color:#fff;
    border:1px solid #bfa400; /* warm gold-ish */
}
.btn--gold:hover{ filter: brightness(1.08); }

/* small helper for a11y label */
.sr-only{
    position:absolute !important; width:1px; height:1px; padding:0; margin:-1px;
    overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* responsive stack on narrow screens */
@media (max-width: 640px){
    .subscribe{ grid-template-columns: 1fr; }
}

/* validation UI */
.input-error{ border-color:#e74c3c !important; }
.error-text{ color:#e74c3c; font-size:12px; margin:6px 2px 0; }
.form__note{ margin-top:10px; font-size:14px; opacity:.92 }
.form__note--ok{ color:#a8e063; }   /* success green */

/* Brand accent */
:root{
    --brand-gold: #BFA400;
    --brand-gold-30: rgba(191, 164, 0, .35);
}

/* Scope to your contact form only */
.contact input, .subscribe input,
.contact textarea, .subscribe textarea{
    caret-color: var(--brand-gold);
}

/* Focus ring + border in warm gold */
.contact input:focus, .subscribe input:focus,
.contact input:focus-visible, .subscribe input:focus-visible,
.contact textarea:focus, .subscribe textarea:focus,
.contact textarea:focus-visible, .subscribe textarea:focus-visible{
    outline: none;
    border-color: var(--brand-gold);
    box-shadow: 0 0 0 3px var(--brand-gold-30);
}

/* Optional: match the submit focus */
.contact button:focus-visible, .subscribe button:focus-visible{
    outline: none;
    box-shadow: 0 0 0 3px var(--brand-gold-30);
}