/*
Theme Name: Cal's Driving School
Description: Modern, PHP 8.4 compatible replacement retaining the established Cal's Driving School presentation.
Version: 1.0.1
Author: DSW
Text Domain: cals-driving-school
*/

* { box-sizing: border-box; }
html { overflow-x: hidden; }
body { margin: 0; color: #242b2d; background: #fff; font: 15px/1.55 Verdana, Geneva, Arial, Helvetica, sans-serif; }
a { color: #52646b; }
img { max-width: 100%; height: auto; }

.site-nav { min-height: 70px; padding: 6px 0; position: relative; z-index: 499; background: linear-gradient(#f4f5f6 0, #c4cccf 100%); }
.nav-inner { width: 1012px; max-width: 100%; min-height: 58px; margin: 0 auto; padding: 0 6px; }
.menu-toggle { display: none; }
.primary-menu, .primary-menu ul { margin: 0; padding: 0; list-style: none; }
.primary-menu { display: block; min-height: 58px; padding: 0 6px; }
.primary-menu::after { display: block; clear: both; content: ''; }
.primary-menu > li { position: relative; float: left; height: 29px; margin-left: 9px; }
.primary-menu > li:first-child { margin-left: 4px; }
.primary-menu > li > a { display: block; height: 29px; padding: 0 17px; border: 1px solid transparent; border-radius: 2px; color: #2d431e; text-decoration: none; white-space: nowrap; font: 15px/27px Verdana, Geneva, Arial, Helvetica, sans-serif; }
.primary-menu > li:hover > a, .primary-menu > .current-menu-item > a, .primary-menu > .current-menu-ancestor > a { border-color: #64767d; color: #e9f3e3; background: linear-gradient(#77b14e, #568038); }
.primary-menu .sub-menu { display: none; position: absolute; z-index: 999; top: 100%; left: 0; min-width: 225px; background: #e7eaeb; box-shadow: 0 5px 12px rgba(0,0,0,.22); }
.primary-menu li:hover > .sub-menu, .primary-menu li:focus-within > .sub-menu { display: block; }
.primary-menu .sub-menu .sub-menu { top: 0; left: 100%; }
.primary-menu .sub-menu a { display: block; padding: 10px 14px; color: #323b3e; text-decoration: none; white-space: nowrap; border-bottom: 1px solid #c5ccce; }
.primary-menu .sub-menu a:hover { color: #fff; background: #748052; }

.site-header { height: 150px; background: url('assets/header.jpg') center top no-repeat; }
.header-inner { position: relative; width: 1000px; max-width: calc(100% - 24px); height: 150px; margin: 0 auto; padding: 22px 210px 10px 5px; }
.site-title { margin: 0; color: #30414a; font: bold 44px/1.12 Georgia, 'Times New Roman', serif; }
.site-tagline { margin: 7px 0 0; color: #53666d; font: 28px/1.2 Arial, Helvetica, sans-serif; }
.l-plate { position: absolute; top: 22px; right: 26px; width: 105px; height: auto; }

.site-sheet { position: relative; width: 1000px; max-width: calc(100% - 24px); margin: -20px auto 0; background: #fff; border: 1px solid #ccd3d5; border-radius: 10px 10px 0 0; box-shadow: 0 2px 12px rgba(0,0,0,.22); overflow: hidden; }
.layout { display: grid; grid-template-columns: 200px minmax(0, 1fr); min-height: 520px; }
.sidebar { padding: 22px 15px; background: #f7f7f5; border-right: 1px solid #d9dcda; }
.sidebar .widget { margin: 0 0 28px; }
.sidebar .widget-title { margin: 0 0 14px; color: #464f43; font: bold 19px/1.25 Arial, Helvetica, sans-serif; text-transform: uppercase; }
.search-form { display: flex; flex-wrap: wrap; gap: 8px; }
.search-field { min-width: 0; width: 100%; padding: 8px 9px; border: 1px solid #9ba3a6; font: inherit; }
.search-submit { padding: 7px 13px; border: 1px solid #718047; color: #fff; background: linear-gradient(#9eab7b,#687447); cursor: pointer; }
.content { min-width: 0; padding: 24px 28px 42px; }
.entry-title, .page-title { margin: 0 0 18px; color: #606b70; font: normal 32px/1.2 Georgia, 'Times New Roman', serif; }
.entry-content h1, .entry-content h2, .entry-content h3 { color: #4b595e; font-family: Georgia, 'Times New Roman', serif; line-height: 1.2; }
.entry-content p { margin: 0 0 1em; }
.entry-content blockquote { clear: both; overflow: auto; margin: 10px 10px 10px 50px; padding: 0 0 0 28px; color: #050f14; background: #bbc5c9 url('assets/postquote.png') no-repeat 0 0; font: 15px/1.55 Verdana, Geneva, Arial, Helvetica, sans-serif; text-align: left; }
.entry-content blockquote p { margin: 14px; }
.entry-content blockquote a, .entry-content blockquote a:visited, .entry-content blockquote a:hover { color: #050f14; }
.entry-content table { max-width: 100%; }
.entry-content iframe { max-width: 100%; }
.wp-caption { max-width: 100%; }
.wp-caption-text { color: #667277; font-size: 12px; }

.site-footer { min-height: 38px; color: #c1cacd; background: #546369; font-size: 14px; }
.footer-inner { width: 1000px; max-width: calc(100% - 24px); margin: 0 auto; padding: 8px 12px; text-align: center; }
.site-footer a { color: #f2f4f4; }
.rss-link { float: left; display: block; width: 32px; height: 32px; overflow: hidden; background: url('assets/rss-icon.png') no-repeat 0 50%; text-indent: -9999px; }

@media (max-width: 820px) {
 .site-nav { min-height: 0; padding: 6px 12px; }
 .nav-inner { min-height: 0; padding: 0; }
 .menu-toggle { display: block; width: 100%; padding: 10px 13px; border: 1px solid #9ca7aa; color: #303a3d; background: rgba(255,255,255,.55); text-align: left; font: bold 16px Arial,sans-serif; }
 .primary-menu { display: none; padding-top: 6px; }
 .primary-menu.is-open { display: block; }
 .primary-menu > li { float: none; height: auto; margin-left: 0; }
 .primary-menu > li:first-child { margin-left: 0; }
 .primary-menu > li > a { height: auto; padding: 10px 13px; border: 0; border-top: 1px solid rgba(112,125,130,.32); white-space: normal; line-height: 1.35; }
 .primary-menu .sub-menu { display: block; position: static; min-width: 0; padding-left: 16px; box-shadow: none; background: transparent; }
 .primary-menu .sub-menu a { white-space: normal; }
 .site-header { height: 135px; background-position: center top; }
 .header-inner { height: 135px; padding: 20px 105px 10px 12px; }
 .site-title { font-size: clamp(27px,7vw,38px); }
 .site-tagline { font-size: clamp(17px,4.5vw,23px); }
 .l-plate { right: 8px; width: 80px; }
 .site-sheet { margin-top: -12px; }
 .layout { display: block; }
 .sidebar { border-right: 0; border-bottom: 1px solid #d9dcda; }
 .content { padding: 22px 18px 36px; }
}
