* {
   box-sizing: border-box;
}

body {
   margin: 0;
   font-family: Arial, Helvetica, sans-serif;
   background-color: #fff7f3;
   color: #3f2f2f;
   line-height: 1.6;
}

header {
   background-color: #d8a7a7;
   color: white;
   text-align: center;
   padding: 35px 20px;
}

header h1 {
   margin: 0;
   font-size: 2.5em;
}

nav {
   background-color: #8f5f5f;
   text-align: center;
   padding: 12px;
}

nav a {
   color: white;
   text-decoration: none;
   padding: 12px 22px;
   display: inline-block;
   font-weight: bold;
}

nav a:hover {
   background-color: #f3d4d4;
   color: #5a3333;
   border-radius: 5px;
}

main {
   max-width: 1100px;
   margin: auto;
   padding: 25px;
}

.hero {
   background-color: #f7dddd;
   padding: 30px;
   border-radius: 10px;
   text-align: center;
}

.columns {
   display: flex;
   gap: 20px;
   margin: 25px 0;
}

.columns article {
   flex: 1;
   background-color: white;
   padding: 20px;
   border-radius: 10px;
   box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}

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

.gallery img {
   width: 100%;
   height: 220px;
   object-fit: cover;
   border-radius: 10px;
}

table {
   width: 100%;
   border-collapse: collapse;
   background-color: white;
   margin-top: 20px;
}

th, td {
   border: 1px solid #c9a3a3;
   padding: 12px;
   text-align: left;
}

th {
   background-color: #d8a7a7;
   color: white;
}

.video {
   margin-top: 30px;
   text-align: center;
}

iframe {
   width: 100%;
   max-width: 700px;
   height: 390px;
   border: none;
   border-radius: 10px;
}

form {
   background-color: white;
   padding: 25px;
   border-radius: 10px;
   box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
}

fieldset {
   border: 2px solid #d8a7a7;
   margin-bottom: 20px;
   padding: 20px;
}

legend {
   font-weight: bold;
   color: #8f5f5f;
}

label {
   display: block;
   margin-top: 12px;
   font-weight: bold;
}

input, select, textarea {
   width: 100%;
   padding: 10px;
   margin-top: 5px;
   border: 1px solid #b98d8d;
   border-radius: 5px;
}

input[type="radio"] {
   width: auto;
   margin-right: 6px;
}

button {
   background-color: #8f5f5f;
   color: white;
   border: none;
   padding: 12px 20px;
   margin-right: 10px;
   border-radius: 5px;
   cursor: pointer;
   font-weight: bold;
}

button:hover {
   background-color: #d8a7a7;
   color: #3f2f2f;
}

footer {
   background-color: #8f5f5f;
   color: white;
   text-align: center;
   padding: 15px;
   margin-top: 30px;
}

@media screen and (max-width: 768px) {
   nav a {
      display: block;
      padding: 10px;
   }

   .columns {
      flex-direction: column;
   }

   .gallery {
      grid-template-columns: 1fr;
   }

   iframe {
      height: 250px;
   }
}