Скрытие/отображение элементов формы при изменение других элементов без Javascript

Исходный код этого примера:

<style type="text/css">
input[type="radio"] + label ~ input[type="checkbox"],
input[type="radio"] + label ~ input[type="checkbox"] + label,
input[type="radio"] + label ~ input[type="checkbox"] + label + br { display: none; }

input[type="radio"]:checked + label ~ input[type="checkbox"],
input[type="radio"]:checked + label ~ input[type="checkbox"] + label,
input[type="radio"]:checked + label ~ input[type="checkbox"] + label + br { display: inline-block; } /* изменение видно при установлении галочки */

input[type="submit"] { padding: 2px 10px; background: yellow; } /* выделенный по умолчанию элемент формы */
</style>

<form>
<input type="radio" name="odin" id="r1"> <label for="r1">пункт 1</label><br>
<input type="checkbox" id="c1"> <label for="c1">подпункт 1.1</label><br>
<input type="checkbox" id="c2"> <label for="c2">подпункт 1.2</label><br>
<input type="radio" name="odin" id="r2"> <label for="r2">пункт 2</label><br>
<input type="reset" value="Сброс">
<input type="submit" value="Отправить">
</form>