/*
Path of Light Yoga Studio
Author: Enrique Rannow
Date: April 28, 2026
Assignment: Chapters 8-10 Case Study
*/

/* Base page styling */
* { box-sizing: border-box; }
body {
    margin: 0;
    background-color: #F5F5F5;
    color: #3F2860;
    font-family: Verdana, Arial, sans-serif;
    line-height: 1.6;
}

/* Centered page wrapper */
#wrapper {
    background-color: #FFFFFF;
    min-width: 320px;
    max-width: 1200px;
    margin: 0 auto;
    box-shadow: 0 0 15px rgba(0,0,0,.15);
}

/* Header and site title */
header {
    background: #40407A;
    color: #FFFFFF;
    padding: 1.2em;
    text-align: center;
}
header h1 { margin: 0; font-size: 2em; }
header a { color: #FFFFFF; text-decoration: none; }

/* Navigation links */
nav {
    background-color: #E6E6FA;
    text-align: center;
    padding: .8em;
}
nav a {
    display: inline-block;
    color: #40407A;
    font-weight: bold;
    text-decoration: none;
    padding: .5em 1em;
}
nav a:hover, nav a.active { background-color: #40407A; color: #FFFFFF; border-radius: 4px; }

/* Main content area */
main { padding: 1.5em; }
h2 { color: #40407A; }
h3 { color: #2b2b62; }
.studio { font-style: italic; font-weight: bold; }

/* Hero sections */
.hero {
    min-height: 230px;
    background: linear-gradient(rgba(64,64,122,.45), rgba(64,64,122,.45)), url('https://images.unsplash.com/photo-1545205597-3d9d02c29597?auto=format&fit=crop&w=1200&q=80');
    background-size: cover;
    background-position: center;
    color: white;
    padding: 4em 2em;
    text-shadow: 1px 1px 3px #000;
}
.hero h2 { color: white; }

/* Content cards */
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1em; }
.card { background-color: #F5F5FF; border-left: 5px solid #40407A; padding: 1em; }


/* Schedule table styles */
table { border-collapse: collapse; margin: 1em 0; width: 100%; background: #fff; }
th, td { border: 1px solid #40407A; padding: .75em; text-align: left; }
th { background: #40407A; color: #fff; }
caption { font-weight: bold; font-size: 1.2em; margin-bottom: .5em; }
tr:nth-of-type(even) { background: #F5F5FF; }


/* Contact form layout */
form { display: flex; flex-direction: column; gap: .75em; max-width: 720px; }
label { font-weight: bold; }
input, select, textarea { padding: .65em; border: 1px solid #8F92B2; border-radius: 4px; font: inherit; }
textarea { min-height: 120px; }
#submit { width: 10em; background: #2b2b62; color: #fff; border: 0; cursor: pointer; }
#submit:hover { background: #40407A; }
.required { color: #9b1c31; font-weight: bold; }

/* Footer information */
footer {
    background-color: #40407A;
    color: #FFFFFF;
    text-align: center;
    font-size: .9em;
    padding: 1em;
}
footer a { color: #FFFFFF; }

/* Medium viewport layout */
@media (max-width: 900px) {
    .grid { grid-template-columns: 1fr 1fr; }
    header h1 { font-size: 1.7em; }
}

/* Small viewport layout */
@media (max-width: 600px) {
    nav a { display: block; margin: .25em 0; }
    .grid { grid-template-columns: 1fr; }
    main { padding: 1em; }
    .hero { padding: 2em 1em; min-height: 180px; }
}