Div con bordi interni

[samiel]

Dovrei riprodurre qualcosa di simile a questo:
Schermata_20251122_113234.png
Ora, se cerco di creare un div con bordi non al confine, ma all'interno del div stesso con:

.square{background-color:red; border-top:5px solid black; border-bottom:5px solid black padding:-20px; padding:20px;}

il padding nonfunziona e il bordo scompare.
Se metto il bordo al titolo <h1> esso lascia fuori il logo, che invece dovrebbe anch'esso avere il bordo continuo con il titolo:

.associated{display:flex; align-items:left; background-color:#EFEEE6; padding:20px;}

.associated h1 {padding:20px; font-size:3em; font-weight:normal; border-top: 2px solid grey; border-bottom: 2px solid grey; }

.associated img{max-width:100%; height:auto; top:50%; margin-right:10px; }

e l'immagine risulta di dimensioni e proporzioni anomale:
Schermata del 2025-11-22 13-02-31.png
Dunque sono molte le cose su cui sbaglio...
Qualche spunto su come affrontare il mio problema?
Grazie
m