/*
Theme Name: Chattington Manor
Theme URI: https://www.chattingtonmanor.com
Author: Optimum Solution
Author URI: https://www.chattingtonmanor.com
Description: Custom premium theme for Chattington Manor, an assisted living facility in Dallas, TX. Built-in branded header and footer, purple and gold design system, fully Elementor-compatible.
Version: 1.0.0
Requires at least: 5.9
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: chattington-manor
*/

:root{
  --cm-deep:#3D1478;
  --cm-violet:#6C2BD9;
  --cm-lavender:#A78BFA;
  --cm-lilac:#F5F1FB;
  --cm-gold:#C6A052;
  --cm-gold-light:#E4C878;
  --cm-ink:#2B2140;
  --cm-body:#5C5470;
  --cm-warm:#FDFCFB;
  --cm-border:#E5DBF4;
  --cm-serif:'Cormorant Garamond',Georgia,serif;
  --cm-sans:'Nunito Sans',-apple-system,Segoe UI,sans-serif;
}

/* ---------- Base ---------- */
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  font-family:var(--cm-sans);
  font-size:17px;
  line-height:1.75;
  color:var(--cm-body);
  background:var(--cm-warm);
}
h1,h2,h3,h4,h5,h6{
  font-family:var(--cm-serif);
  color:var(--cm-ink);
  font-weight:600;
  line-height:1.18;
  margin:0 0 .5em;
}
h1{font-size:48px}h2{font-size:40px}h3{font-size:28px;font-weight:700}h4{font-size:22px;font-weight:700}
a{color:var(--cm-violet);text-decoration:none;transition:color .2s}
a:hover{color:var(--cm-deep)}
img{max-width:100%;height:auto}
.cm-wrap{max-width:1140px;margin:0 auto;padding:0 28px}
.screen-reader-text{position:absolute;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden}

/* ---------- Buttons ---------- */
.cm-btn{
  display:inline-block;border-radius:999px;font-weight:700;font-size:14px;
  padding:12px 26px;transition:all .25s;font-family:var(--cm-sans);white-space:nowrap;
}
.cm-btn-gold{background:var(--cm-gold);color:var(--cm-ink)}
.cm-btn-gold:hover{background:var(--cm-deep);color:#fff}

/* ---------- Header: top bar ---------- */
.cm-topbar{background:var(--cm-deep);padding:10px 0;font-size:13px;font-weight:600}
.cm-topbar .cm-wrap{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px}
.cm-topbar span{color:#fff;margin-right:26px;white-space:nowrap}
.cm-topbar span:last-child{margin-right:0}
.cm-topbar i{color:var(--cm-gold-light);margin-right:8px}
.cm-topbar a{color:#fff}
.cm-topbar a:hover{color:var(--cm-gold-light)}

/* ---------- Header: main bar ---------- */
.cm-mainbar{
  background:var(--cm-warm);
  border-bottom:1px solid var(--cm-border);
  box-shadow:0 6px 24px -12px rgba(61,20,120,.18);
  padding:12px 0;
  position:sticky;top:0;z-index:999;
}
.cm-mainbar .cm-wrap{display:flex;align-items:center;justify-content:space-between;gap:24px}
.cm-logo img{height:64px;width:auto;display:block}

.cm-nav{display:flex;align-items:center;gap:2px;margin:0;padding:0;list-style:none}
.cm-nav li{position:relative;margin:0}
.cm-nav a{
  display:block;color:var(--cm-ink);font-weight:700;font-size:15px;
  padding:10px 14px;position:relative;
}
.cm-nav a:hover{color:var(--cm-violet)}
.cm-nav li.current-menu-item > a,
.cm-nav li.current_page_item > a{color:var(--cm-deep)}
.cm-nav a::after{
  content:'';position:absolute;left:14px;right:14px;bottom:2px;height:3px;
  background:var(--cm-gold);border-radius:2px;transform:scaleX(0);transition:transform .2s;
}
.cm-nav a:hover::after,
.cm-nav li.current-menu-item > a::after,
.cm-nav li.current_page_item > a::after{transform:scaleX(1)}

/* sub-menus */
.cm-nav .sub-menu{
  position:absolute;top:100%;left:0;min-width:220px;background:#fff;
  border:1px solid var(--cm-border);border-radius:14px;padding:10px 0;margin:0;
  list-style:none;box-shadow:0 18px 40px -18px rgba(61,20,120,.35);
  opacity:0;visibility:hidden;transform:translateY(8px);transition:all .2s;z-index:998;
}
.cm-nav li:hover > .sub-menu{opacity:1;visibility:visible;transform:translateY(0)}
.cm-nav .sub-menu a{padding:9px 20px;font-size:14px}
.cm-nav .sub-menu a::after{display:none}

/* hamburger */
.cm-toggle{
  display:none;background:none;border:none;cursor:pointer;padding:8px;
  color:var(--cm-deep);font-size:24px;line-height:1;
}

/* ---------- Content area ---------- */
.cm-content{min-height:40vh}
.cm-page-default .cm-content{max-width:840px;margin:0 auto;padding:64px 28px}
.cm-page-default .entry-title{margin-bottom:24px}

/* ---------- Footer ---------- */
.cm-footer-main{
  background:var(--cm-lilac);
  border-top:1px solid var(--cm-border);
  padding:70px 0 56px;
}
.cm-footer-grid{display:grid;grid-template-columns:28% 24% 20% 28%;gap:36px}
.cm-footer-logo img{height:96px;width:auto;margin-bottom:14px}
.cm-footer-tagline{font-size:14px;line-height:1.7;margin:0}
.cm-footer-main h4{
  font-family:var(--cm-serif);font-size:22px;font-weight:700;
  color:var(--cm-deep);margin:0 0 16px;
}
.cm-footer-main ul{list-style:none;margin:0;padding:0}
.cm-footer-main li{margin-bottom:12px;font-size:15px;font-weight:600}
.cm-footer-main li a{color:var(--cm-body)}
.cm-footer-main li a:hover{color:var(--cm-violet)}
.cm-footer-main li i.cm-chev{color:var(--cm-gold);font-size:10px;margin-right:10px}
.cm-footer-contact li{color:var(--cm-ink);font-size:14px;display:flex;align-items:flex-start}
.cm-footer-contact i{color:var(--cm-violet);margin-right:12px;width:16px;text-align:center;margin-top:5px}
.cm-footer-contact a{color:var(--cm-ink)}
.cm-footer-bottom{background:var(--cm-deep);padding:18px 0;text-align:center;font-size:13px;color:#DCCEF5}
.cm-footer-bottom a{color:var(--cm-gold-light)}

/* ---------- Responsive ---------- */
@media (max-width:1024px){
  .cm-nav a{padding:10px 10px;font-size:14px}
}
@media (max-width:900px){
  .cm-topbar{display:none}
  .cm-toggle{display:block}
  .cm-header-cta{display:none}
  .cm-menu-wrap{
    position:fixed;inset:0;top:89px;background:var(--cm-warm);
    padding:24px 28px;overflow-y:auto;display:none;z-index:997;
  }
  .cm-menu-wrap.open{display:block}
  .cm-nav{flex-direction:column;align-items:stretch;gap:0}
  .cm-nav a{font-size:17px;padding:14px 4px;border-bottom:1px solid var(--cm-border)}
  .cm-nav a::after{display:none}
  .cm-nav .sub-menu{
    position:static;opacity:1;visibility:visible;transform:none;
    box-shadow:none;border:none;background:transparent;padding:0 0 0 18px;
  }
  .cm-footer-grid{grid-template-columns:1fr 1fr}
  h1{font-size:36px}h2{font-size:30px}
}
@media (max-width:560px){
  .cm-footer-grid{grid-template-columns:1fr}
  .cm-logo img{height:52px}
}