:root{
      --dc-bg: #ded5cc;         /* fondo */
      --dc-primary: #1f1f1d;    /* negro/oscuro */
      --dc-secondary: #e9e8e2;  /* crema claro */
      --dc-text: #101010;       /* texto */
      --dc-line: rgba(16,16,16,.55); /* separadores */
    }

    html, body{ height: 100%; }
    body{
      background: var(--dc-bg);
      color: var(--dc-text);
      font-family: "Roboto", system-ui, -apple-system, Segoe UI, Arial, sans-serif;
    }

    /* Quitar esquinas redondas en TODOS los controles */
    .btn,
    .form-control,
    .form-select,
    .form-check-input{
      border-radius: 0 !important;
    }

    /* Inputs con look “plano” como screenshot */
    .form-control, .form-select{
      border: 1px solid rgba(16,16,16,.18);
      background: #fff;
      box-shadow: none !important;
    }
    .form-control:focus, .form-select:focus{
      border-color: rgba(16,16,16,.45);
      box-shadow: none !important;
    }

    /* Hero oscuro pegado al navbar */
    .dc-hero{
      background: var(--dc-primary);
      color: #fff;
      min-height: 40vh;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      padding: 3.5rem 1.25rem;
    }
    .dc-hero h1{
      margin: 0;
      font-family: "Patua One", serif;
      font-weight: 400;
      letter-spacing: .02em;
      text-transform: uppercase;
      font-size: clamp(1.8rem, 2.2vw + 1rem, 3.2rem);
      line-height: 1.1;
    }

    /* Sección formulario: padding como el layout que ya tenías */
    .dc-form-section{
      padding: 4rem;
      background: transparent;
    }
    @media (max-width: 991.98px){
      .dc-form-section{ padding: 4rem 2rem; }
    }
    @media (max-width: 575.98px){
      .dc-form-section{ padding: 3rem 1.25rem; }
    }

    /* Separadores negros finos */
    .dc-hr{
      border: 0;
      border-top: 1px solid var(--dc-line);
      opacity: 1;
      margin: 1.75rem 0;
    }

    /* Layout “título a la izquierda / campos a la derecha” (30/70) */
    @media (min-width: 992px){
      .dc-col-30{ flex: 0 0 30%; max-width: 30%; }
      .dc-col-70{ flex: 0 0 70%; max-width: 70%; }
    }

    /* Títulos de sección (DATOS DE CONTACTO / MENSAJE) */
    .dc-section-title{
      font-family: "Patua One", serif;
      font-weight: 400;
      text-transform: uppercase;
      letter-spacing: .03em;
      color: var(--dc-primary);
      font-size: clamp(1.8rem, 1.1vw + 1.4rem, 2.6rem);
      line-height: 1.05;
      margin: 0;
    }

    /* Texto intro */
    .dc-intro{
      margin-bottom: .75rem;
      font-size: 1rem;
    }

    /* Botón como screenshot: negro, rectangular */
    .dc-btn{
      background: var(--dc-primary);
      border-color: var(--dc-primary);
      color: #fff;
      padding: .95rem 3.2rem;
      font-size: 1rem;
      font-weight: 500;
    }
    .dc-btn:hover, .dc-btn:focus{
      background: #141413;
      border-color: #141413;
      color: #fff;
    }

    /* Labels similares (compactos) */
    .form-label{
      font-size: .95rem;
      margin-bottom: .35rem;
    }