/*
Theme Name: Clever Home CMS 4.0
Theme URI: https://cleverhome.ie
Author: Clever Home Solutions
Author URI: https://cleverhome.ie
Description: A flexible WordPress website and homepage builder created for Clever Home Solutions.
Version: 4.0.4
Text Domain: clever-home-cms
*/

:root {
  --sv-blue: #2563eb;
  --sv-blue-dark: #1d4ed8;
  --sv-ink: #111827;
  --sv-muted: #5f6b7a;
  --sv-bg: #f7f9fc;
  --sv-white: #ffffff;
  --sv-border: #e7ebf2;
  --sv-radius: 24px;
  --sv-shadow: 0 20px 60px rgba(15, 23, 42, .10);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--sv-ink);
  background: var(--sv-white);
  line-height: 1.65;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
.container { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }
.section { padding: 92px 0; }
.section-soft { background: var(--sv-bg); }
.eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 12px; border-radius: 999px;
  background: #eef4ff; color: var(--sv-blue-dark);
  font-size: 14px; font-weight: 700;
}
h1,h2,h3 { line-height: 1.1; letter-spacing: -.035em; margin-top: 0; }
h1 { font-size: clamp(48px, 7vw, 84px); margin-bottom: 24px; }
h2 { font-size: clamp(36px, 5vw, 58px); margin-bottom: 18px; }
h3 { font-size: 24px; margin-bottom: 12px; }
.lead { font-size: clamp(18px, 2vw, 22px); color: var(--sv-muted); max-width: 760px; }
.muted { color: var(--sv-muted); }

.site-header {
  position: sticky; top: 0; z-index: 100;
  background: rgba(255,255,255,.88);
  border-bottom: 1px solid rgba(231,235,242,.9);
  backdrop-filter: blur(18px);
}
.header-inner {
  min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 28px;
}
.brand { display: inline-flex; align-items: center; font-size: 26px; font-weight: 850; letter-spacing: -.04em; text-decoration: none; }
.brand-image { display: block; max-width: 100%; height: auto; }
.brand-text { color: inherit; }
.brand-dot { color: var(--sv-blue); }
.nav { display: flex; align-items: center; gap: 28px; font-weight: 650; }
.nav a:hover { color: var(--sv-blue); }
.menu-toggle { display: none; border: 0; background: transparent; font-size: 28px; cursor: pointer; }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 52px; padding: 0 22px; border-radius: 14px;
  font-weight: 750; border: 1px solid transparent; transition: .2s ease;
}
.btn-primary { background: var(--sv-blue); color: white; box-shadow: 0 12px 30px rgba(37,99,235,.24); }
.btn-primary:hover { background: var(--sv-blue-dark); transform: translateY(-2px); }
.btn-secondary { border-color: var(--sv-border); background: white; }
.btn-secondary:hover { border-color: #cbd5e1; transform: translateY(-2px); }

.hero { padding: 80px 0 64px; overflow: hidden; }
.hero-grid { display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 56px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 32px; }
.hero-notes { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 30px; color: var(--sv-muted); font-size: 14px; }
.hero-card {
  position: relative; border-radius: 34px; overflow: hidden;
  background: #dce8f7; box-shadow: var(--sv-shadow);
}
.hero-card img { width: 100%; aspect-ratio: 4/5; object-fit: cover; }
.hero-float {
  position: absolute; left: 24px; right: 24px; bottom: 24px;
  padding: 18px; border-radius: 18px;
  background: rgba(255,255,255,.88); backdrop-filter: blur(14px);
  display: flex; justify-content: space-between; gap: 16px; align-items: center;
}
.status-dot { width: 10px; height: 10px; border-radius: 50%; background: #22c55e; display: inline-block; margin-right: 8px; }

.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.card {
  padding: 28px; border: 1px solid var(--sv-border); border-radius: var(--sv-radius);
  background: white; box-shadow: 0 12px 40px rgba(15,23,42,.05);
}
.icon {
  width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center;
  background: #eef4ff; color: var(--sv-blue); font-size: 24px; margin-bottom: 24px;
}
.steps { counter-reset: step; }
.step { position: relative; padding-left: 76px; }
.step::before {
  counter-increment: step; content: counter(step);
  position: absolute; left: 0; top: 0; width: 52px; height: 52px; border-radius: 16px;
  display: grid; place-items: center; background: var(--sv-blue); color: white; font-weight: 800;
}
.project-card { overflow: hidden; padding: 0; }
.project-card img { aspect-ratio: 16/10; object-fit: cover; width: 100%; }
.project-body { padding: 24px; }
.meta { font-size: 14px; color: var(--sv-muted); margin-bottom: 10px; }
.post-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.post-card { border: 1px solid var(--sv-border); border-radius: 20px; overflow: hidden; background: white; }
.post-card img { aspect-ratio: 16/10; width: 100%; object-fit: cover; }
.post-card-content { padding: 22px; }
.post-card h3 { font-size: 22px; }
.cta {
  border-radius: 34px; padding: 58px;
  background: linear-gradient(135deg, #0f172a, #1e3a8a);
  color: white; display: flex; justify-content: space-between; gap: 30px; align-items: center;
}
.cta p { color: #dbeafe; max-width: 650px; }

.site-footer { padding: 44px 0; border-top: 1px solid var(--sv-border); }
.footer-inner { display: flex; justify-content: space-between; gap: 30px; flex-wrap: wrap; }
.socials { display: flex; gap: 16px; color: var(--sv-muted); }

.content-wrap { width: min(820px, calc(100% - 40px)); margin: 0 auto; padding: 72px 0; }
.entry-title { font-size: clamp(42px, 6vw, 68px); }
.entry-content > * { max-width: 100%; }
.entry-content p, .entry-content li { font-size: 18px; color: #374151; }
.entry-content img { border-radius: 20px; margin: 34px 0; }
.pagination { display: flex; gap: 12px; margin-top: 40px; }

@media (max-width: 900px) {
  .hero-grid, .grid-3, .grid-2, .post-grid { grid-template-columns: 1fr; }
  .hero-card img { aspect-ratio: 16/11; }
  .nav { display: none; position: absolute; top: 76px; left: 0; right: 0; padding: 24px; background: white; border-bottom: 1px solid var(--sv-border); flex-direction: column; align-items: flex-start; }
  .nav.is-open { display: flex; }
  .menu-toggle { display: block; }
  .header-cta { display: none; }
  .cta { padding: 38px 28px; flex-direction: column; align-items: flex-start; }
}
@media (max-width: 600px) {
  .container { width: min(100% - 26px, 1160px); }
  .section { padding: 68px 0; }
  .hero { padding-top: 48px; }
  .hero-float { position: static; border-radius: 0; }
}


/* Contact page */
.contact-hero { padding-top: 78px; }
.contact-hero-grid { display:grid; grid-template-columns:.92fr 1.08fr; gap:64px; align-items:start; }
.contact-title { font-size:clamp(46px,6vw,72px); margin-top:18px; }
.contact-details { display:grid; gap:14px; margin-top:38px; }
.contact-detail { display:flex; align-items:center; gap:16px; max-width:520px; padding:16px 18px; background:rgba(255,255,255,.8); border:1px solid var(--sv-border); border-radius:16px; }
a.contact-detail:hover { border-color:var(--sv-blue); transform:translateY(-1px); }
.contact-detail-icon { flex:0 0 44px; width:44px; height:44px; display:grid; place-items:center; border-radius:13px; background:#eef4ff; color:var(--sv-blue); font-size:21px; }
.contact-detail small,.contact-detail strong { display:block; }
.contact-detail small { color:var(--sv-muted); margin-bottom:2px; }
.contact-form-card { padding:34px; background:white; border:1px solid var(--sv-border); border-radius:28px; box-shadow:var(--sv-shadow); }
.clever-home-contact-form { display:grid; gap:18px; margin-top:26px; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.clever-home-contact-form label { display:grid; gap:7px; font-weight:700; }
.clever-home-contact-form input,.clever-home-contact-form textarea { width:100%; border:1px solid #d5dce6; border-radius:12px; padding:13px 14px; font:inherit; color:var(--sv-ink); background:#fff; }
.clever-home-contact-form input:focus,.clever-home-contact-form textarea:focus { outline:3px solid rgba(37,99,235,.14); border-color:var(--sv-blue); }
.form-privacy { font-size:13px; color:var(--sv-muted); margin:0; }
.form-honeypot { position:absolute!important; left:-9999px!important; }
.form-notice { margin-top:20px; padding:14px 16px; border-radius:12px; font-weight:650; }
.form-notice.success { background:#ecfdf5; color:#166534; border:1px solid #bbf7d0; }
.form-notice.error { background:#fef2f2; color:#991b1b; border:1px solid #fecaca; }
.map-section { height:460px; border-top:1px solid var(--sv-border); }
.map-section iframe { width:100%; height:100%; border:0; display:block; }
@media(max-width:900px){.contact-hero-grid{grid-template-columns:1fr;gap:38px}}
@media(max-width:600px){.contact-form-card{padding:25px 20px}.form-row{grid-template-columns:1fr}.map-section{height:360px}}


/* WhatsApp */
.btn-whatsapp {
  background: #25d366;
  color: #fff;
  border-color: #25d366;
}
.btn-whatsapp:hover {
  background: #1ebe5d;
  border-color: #1ebe5d;
  color: #fff;
  transform: translateY(-2px);
}
.contact-whatsapp {
  display: inline-flex;
  margin-top: 24px;
}
.whatsapp-mark {
  display: inline-grid;
  place-items: center;
  width: 27px;
  height: 27px;
  margin-right: 9px;
  border: 2px solid currentColor;
  border-radius: 50%;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: -.3px;
}


/* CMS-controlled navigation */
.mobile-toggle {
  display:none;
  width:44px;
  height:44px;
  padding:10px;
  border:0;
  border-radius:10px;
  background:transparent;
  cursor:pointer;
}
.mobile-toggle span {
  display:block;
  height:2px;
  margin:5px 0;
  background:var(--sv-ink);
  border-radius:2px;
}
.primary-nav {
  display:flex;
  align-items:center;
  gap:25px;
}
.primary-nav > a:not(.btn) {
  font-weight:650;
  color:var(--sv-ink);
}
.primary-nav > a:not(.btn):hover {
  color:var(--sv-blue);
}
.header-cta { margin-left:4px; }

@media(max-width:900px) {
  .mobile-toggle { display:block; margin-left:auto; }
  .primary-nav {
    display:none;
    position:absolute;
    left:18px;
    right:18px;
    top:76px;
    padding:18px;
    flex-direction:column;
    align-items:stretch;
    gap:4px;
    background:#fff;
    border:1px solid var(--sv-border);
    border-radius:18px;
    box-shadow:var(--sv-shadow);
    z-index:1000;
  }
  .primary-nav.is-open { display:flex; }
  .primary-nav > a { padding:11px 12px; }
  .header-cta { margin:8px 0 0; text-align:center; justify-content:center; }
  .site-header .header-inner { position:relative; }
}


/* Clever Home Solutions CMS 4.0 section builder */
.sv-builder-section.section-dark{background:#0f172a;color:#fff}
.section-dark h1,.section-dark h2,.section-dark h3,.section-dark .lead{color:#fff}
.section-dark .muted{color:#cbd5e1}
.sv-card-grid,.gallery-grid{display:grid;gap:24px;margin-top:38px}
.columns-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.columns-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card-image{width:calc(100% + 48px);height:190px;object-fit:cover;margin:-24px -24px 22px}
.card-link{display:inline-flex;margin-top:14px;font-weight:750;color:var(--sv-blue)}
.sv-steps-grid{margin-top:38px}
.step-number{display:block;margin-bottom:14px;font-weight:800;color:var(--sv-blue);font-size:13px;letter-spacing:.08em}
.image-text-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.image-text-grid.image-left .image-text-copy{order:2}
.image-text-grid.image-left .image-text-media{order:1}
.image-text-media img{width:100%;max-height:560px;object-fit:cover;border-radius:24px;box-shadow:var(--sv-shadow)}
.rich-copy p{margin:0 0 1em}
.rich-copy p:last-child{margin-bottom:0}
.post-grid{margin-top:38px}
.section-button{margin-top:30px}
.gallery-item{margin:0;overflow:hidden;border-radius:20px;background:#fff;box-shadow:var(--sv-shadow)}
.gallery-item img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.gallery-item figcaption{display:flex;flex-direction:column;gap:6px;padding:18px}
.gallery-item figcaption span{color:var(--sv-muted)}
.cta-actions{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.cta-small{color:#dbeafe}
.eyebrow-light{color:#bfdbfe}
.text-section{max-width:900px}
.text-section.align-center{text-align:center;margin-inline:auto}
.text-section.align-center .section-button{display:flex;justify-content:center}
.placeholder-card{min-height:240px;display:flex;align-items:center}
@media(max-width:900px){
 .columns-3,.columns-4{grid-template-columns:repeat(2,minmax(0,1fr))}
 .image-text-grid{grid-template-columns:1fr;gap:30px}
 .image-text-grid.image-left .image-text-copy,.image-text-grid.image-left .image-text-media{order:initial}
}
@media(max-width:620px){
 .columns-2,.columns-3,.columns-4{grid-template-columns:1fr}
}


/* Clever Home contact showcase – v4.0.3 */
.contact-showcase{display:grid;grid-template-columns:1fr 1.05fr;min-height:620px;background:#fff;border:1px solid #e7ebf2;border-radius:28px;overflow:hidden;box-shadow:0 24px 70px rgba(15,23,42,.12)}
.contact-showcase-copy{padding:72px 64px;display:flex;flex-direction:column;justify-content:center}
.contact-showcase-copy h2{font-size:clamp(44px,5vw,74px);line-height:1.03;letter-spacing:-.045em;max-width:760px;margin:24px 0 28px;color:#0b1730}
.contact-showcase-copy h2::after{content:"";display:block;width:84px;height:4px;border-radius:9px;background:var(--sv-blue);margin-top:30px}
.contact-eyebrow{background:#eef4ff;border-radius:999px;padding:11px 18px;width:max-content}
.contact-lead{font-size:20px;line-height:1.65;color:#53627a;max-width:700px}
.contact-features{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:44px}
.contact-feature{min-width:0;padding:0 20px;border-left:1px solid #e5eaf2;display:flex;flex-direction:column;gap:6px}
.contact-feature:first-child{padding-left:0;border-left:0}
.contact-feature-icon{display:grid;place-items:center;width:42px;height:42px;border:2px solid var(--sv-blue);border-radius:13px;color:var(--sv-blue);font-weight:800;margin-bottom:8px}
.contact-feature strong{font-size:15px;color:#101d36}
.contact-feature small{font-size:13px;color:#6b7890;line-height:1.35}
.contact-showcase-media{position:relative;min-height:620px;background-size:cover;background-position:center}
.contact-showcase-media::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,23,42,.08),rgba(15,23,42,.02))}
.contact-card{position:absolute;right:32px;top:50%;transform:translateY(-50%);width:min(360px,calc(100% - 64px));padding:34px;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-radius:24px;box-shadow:0 20px 60px rgba(3,12,28,.28);color:#101d36}
.contact-card-brand{font-size:25px;font-weight:900;line-height:.95;letter-spacing:.04em}.contact-card-brand span{display:block;color:var(--sv-blue);font-size:30px}.contact-card-brand small{display:block;margin-top:8px;font-size:11px;letter-spacing:.34em}
.contact-card hr{border:0;border-top:1px solid #e1e7f0;margin:24px 0}
.contact-card h3{font-size:21px;color:var(--sv-blue);margin:0 0 20px}
.contact-card>a,.contact-card-line{display:flex;align-items:center;gap:13px;padding:9px 0;color:#26344d;text-decoration:none;font-size:15px}
.contact-card>a:hover{color:var(--sv-blue)}
.contact-card-buttons{display:flex;flex-direction:column;gap:10px}.contact-card-buttons .btn{width:100%;justify-content:center;text-align:center}
@media(max-width:1100px){.contact-showcase{grid-template-columns:1fr}.contact-showcase-copy{padding:56px 42px}.contact-showcase-media{min-height:520px}.contact-features{grid-template-columns:repeat(2,1fr);gap:26px}.contact-feature:nth-child(3){border-left:0;padding-left:0}}
@media(max-width:620px){.contact-showcase{border-radius:22px}.contact-showcase-copy{padding:42px 26px}.contact-showcase-copy h2{font-size:42px}.contact-features{grid-template-columns:1fr 1fr}.contact-feature{padding:0 10px}.contact-showcase-media{min-height:540px}.contact-card{right:18px;width:calc(100% - 36px);padding:26px}.contact-lead{font-size:17px}}
