/* =========================================================
   John Kingston Estate Agents: site styles
   Replica of johnkingston.co.uk (28 Oct 2026) on the HIVE platform.
   Brand: claude/jk-brand.md. Colours come from the Kadence palette:
     1/3 green #06532A · 2 red #BF1622 · 4 body #666 · 8 panel grey #ECECEA
   ========================================================= */

:root{
  --jk-green:var(--global-palette1,#06532A);
  --jk-red:var(--global-palette2,#BF1622);
  --jk-lime:#9DB847;
  --jk-text:var(--global-palette4,#666);
  --jk-panel:var(--global-palette8,#ECECEA);
  --jk-footer:#4D4E4D;
  --site-radius:0px;
  --site-radius-lg:0px;
  --site-on-accent:#FFFFFF;
  --ps-on-brand:#FFFFFF;
  --hive-cc-ink:#06532A;
  --hive-cc-line:#ECECEA;
}

body{color:var(--jk-text)}
.entry-content > *:first-child{margin-top:0}
h1,h2,h3,h4,.wp-block-heading{color:var(--jk-green);text-transform:uppercase}

/* ---------- buttons (square, green, uppercase) ---------- */
.wp-block-button__link,.jk-btn{border-radius:0;border:1px solid var(--jk-green);background:var(--jk-green);color:#fff;font-size:14px;font-weight:700;text-transform:uppercase;padding:12px 30px;line-height:24px;text-decoration:none}
.wp-block-button__link:hover,.wp-block-button__link:focus{background:#043F20;border-color:#043F20;color:#fff}
.jk-btn--glass .wp-block-button__link{background:rgba(6,83,42,.78)}

/* ---------- full-width sections ---------- */
.jk-sec{padding:30px 24px}
.jk-sec > *{max-width:1344px;margin-left:auto;margin-right:auto}
.jk-sec--grey{background:var(--jk-panel)}
.jk-sec--green{background:var(--jk-green);color:#fff}
.jk-sec--green h1,.jk-sec--green h2,.jk-sec--green h3{color:#fff}
.jk-sec .jk-sec-title{text-align:center;font-size:38px;line-height:1.2;margin:0 0 24px}

/* ---------- homepage hero (video) ---------- */
.jk-hero.wp-block-cover{min-height:600px;padding:24px}
.jk-hero .wp-block-cover__inner-container{max-width:1080px;text-align:center}
.jk-hero h1{color:#fff;font-size:40px;line-height:1.2;text-shadow:0 0 4px rgba(0,0,0,.3);margin:0 0 24px}
.jk-hero .wp-block-buttons{justify-content:center;gap:16px}
.jk-hero .wp-block-button{flex:0 0 300px}
.jk-hero .wp-block-button__link{width:100%;text-align:center}
@media (max-width:767px){.jk-hero .wp-block-button{flex-basis:auto;width:100%;max-width:320px}}

/* ---------- search band ---------- */
.jk-band{padding:56px 24px 72px;text-align:center}
.jk-band h2{font-size:40px;line-height:1.2;margin:0 auto 36px;max-width:1080px}
.jk-search-card{background:#fff;max-width:792px;margin:0 auto;padding:36px;text-align:left}
.jk-band .jk-search-card h2{text-align:center;color:var(--jk-green);font-size:38px;margin:0 0 20px}

/* ---------- testimonials (fade slider; site.js) ---------- */
.jk-quotes{position:relative;max-width:900px;margin:0 auto;text-align:center}
.jk-quotes .wp-block-quote{border:0;margin:0 auto;padding:0 56px;max-width:860px;font-style:normal}
.jk-quotes .wp-block-quote p{font-size:16px;line-height:24px;color:var(--jk-text);margin:0 0 12px}
.jk-quotes .wp-block-quote cite{font-size:12px;color:var(--jk-text);font-style:normal;text-transform:none}
.jk-quotes.is-ready .wp-block-quote{display:none}
.jk-quotes.is-ready .wp-block-quote.is-on{display:block;animation:jkFade .5s ease}
@keyframes jkFade{from{opacity:0}to{opacity:1}}
.jk-quotes__nav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border:0;background:transparent;color:var(--jk-green);cursor:pointer;font-size:32px;line-height:40px;padding:0}
.jk-quotes__nav--prev{left:0}.jk-quotes__nav--next{right:0}
.jk-quotes__nav:focus-visible{outline:2px solid var(--jk-green)}

/* ---------- valuation call-to-action band ---------- */
.jk-cta.wp-block-cover{min-height:252px;padding:60px 24px}
.jk-cta h2{color:#fff;font-size:40px;line-height:1.2;text-shadow:0 0 4px rgba(0,0,0,.3);margin:0 0 24px}
.jk-cta .wp-block-buttons{justify-content:center}

/* ---------- get social ---------- */
.jk-social .wp-block-columns{max-width:806px;margin:24px auto 0;gap:32px}
.jk-social-item{display:flex;gap:20px;align-items:flex-start;color:#fff}
.jk-social-item h3{color:var(--jk-lime);font-size:22px;margin:4px 0 6px}
.jk-social-item p{margin:0;color:#fff}
.jk-circle{flex:none;display:inline-flex;align-items:center;justify-content:center;width:72px;height:72px;border-radius:50%;background:var(--jk-red);color:#fff}
.jk-circle svg{width:30px;height:30px;fill:currentColor}
.jk-circle:hover{background:#9E111B;color:#fff}

/* ---------- featured articles ---------- */
.jk-articles .wp-block-columns{gap:48px}
.jk-article.wp-block-cover{min-height:432px;align-items:flex-end;justify-content:flex-start;padding:36px}
.jk-article .wp-block-cover__inner-container{text-align:left}
.jk-article h3{color:#fff;font-size:30px;margin:0 0 16px;text-transform:uppercase}
.jk-article.jk-article--dark h3{color:#000}

/* ---------- inner pages ---------- */
.jk-page{padding:40px 24px 56px}
.jk-page > *{max-width:1344px;margin-left:auto;margin-right:auto}
.jk-page-title{text-align:center;font-size:38px;line-height:1.2;margin:0 0 40px}
.jk-page .wp-block-columns{gap:48px}
.jk-subnav{list-style:none;margin:0;padding:0;border-top:1px solid #ddd}
.jk-subnav li{border-bottom:1px solid #ddd;margin:0}
.jk-subnav a{display:block;padding:12px 0;color:var(--jk-green);text-decoration:none;font-size:16px}
.jk-subnav a:hover,.jk-subnav a[aria-current]{color:var(--jk-red)}
.jk-page .wp-block-image.jk-banner{margin:0 0 32px}
.jk-page .wp-block-image.jk-banner img{width:100%;height:auto;aspect-ratio:1600/634;object-fit:cover}
.jk-page h2{font-size:22px;margin:32px 0 12px}
.jk-page h3{font-size:18px;margin:28px 0 8px}
.jk-page a{color:var(--jk-green)}
.jk-page p,.jk-page li{line-height:24px}
.jk-testimonial{border:0;margin:0 0 28px;padding:0 0 28px;border-bottom:1px solid #e3e3e0}
.jk-testimonial p{margin:0 0 8px}
.jk-testimonial cite{font-style:normal;font-weight:700;color:var(--jk-green)}

/* legal pages and any page without the jk-page wrapper */
.page .entry-content > .wp-block-heading:first-child,.page .entry-content > p:first-child{margin-top:40px}
.page:not(.home) .entry-content > :not(.jk-page):not(.alignfull){max-width:1000px;margin-left:auto;margin-right:auto;padding-left:24px;padding-right:24px}
.page .entry-content > .wp-block-table{padding-left:24px;padding-right:24px}
.page .entry-content > .wp-block-table table{border-collapse:collapse;width:100%}
.page .entry-content > .wp-block-table td,.page .entry-content > .wp-block-table th{border:1px solid #ddd;padding:8px 10px;text-align:left}
.page .entry-content > .wp-block-table th{background:var(--jk-panel);color:var(--jk-green)}
.page .entry-content > :last-child{margin-bottom:56px}

/* ---------- property search templates (kit) ---------- */
.jk-ps{padding:24px}
.jk-ps > *{max-width:1344px;margin-left:auto;margin-right:auto}
[data-ps] .ps-price{color:var(--jk-red)}

/* ---------- valuation page ---------- */
.jk-val .lv-card{max-width:620px;margin:0 auto;box-shadow:0 2px 4px rgba(0,0,0,.06),0 18px 40px rgba(0,0,0,.12);border:1px solid #e3e3e0}
.lv{--lv-head:var(--global-heading-font-family,Roboto,sans-serif)}

/* ---------- header (HIVE-managed) ---------- */
#masthead .site-branding img{max-height:55px;width:auto}
#masthead .main-navigation .primary-menu-container > ul > li.menu-item > a{color:#fff}
#masthead .main-navigation .primary-menu-container > ul > li.menu-item > a:hover,
#masthead .main-navigation .primary-menu-container > ul > li.current-menu-item > a{color:var(--jk-lime)}
.jk-menu-search > a{font-size:0 !important}
.jk-menu-search > a::before{content:"";display:inline-block;width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 3a7 7 0 015.6 11.2l5.1 5.1-1.4 1.4-5.1-5.1A7 7 0 1110 3zm0 2a5 5 0 100 10 5 5 0 000-10z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 3a7 7 0 015.6 11.2l5.1 5.1-1.4 1.4-5.1-5.1A7 7 0 1110 3zm0 2a5 5 0 100 10 5 5 0 000-10z'/%3E%3C/svg%3E") center/contain no-repeat}
.jk-mobile-icons{display:flex;gap:16px;align-items:center}
.jk-mobile-icons a{display:inline-block;width:22px;height:22px;background:#fff}
.jk-mobile-icons a:hover{background:var(--jk-lime)}
.jk-mi--tel{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 006.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 013 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1l-2.3 2.2z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 006.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.3.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1A17 17 0 013 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.3 0 .7-.2 1l-2.3 2.2z'/%3E%3C/svg%3E") center/contain no-repeat}
.jk-mi--mail{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 4H4a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V6a2 2 0 00-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 4H4a2 2 0 00-2 2v12a2 2 0 002 2h16a2 2 0 002-2V6a2 2 0 00-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z'/%3E%3C/svg%3E") center/contain no-repeat}
.jk-mi--search{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 3a7 7 0 015.6 11.2l5.1 5.1-1.4 1.4-5.1-5.1A7 7 0 1110 3zm0 2a5 5 0 100 10 5 5 0 000-10z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M10 3a7 7 0 015.6 11.2l5.1 5.1-1.4 1.4-5.1-5.1A7 7 0 1110 3zm0 2a5 5 0 100 10 5 5 0 000-10z'/%3E%3C/svg%3E") center/contain no-repeat}
.jk-mi--val{-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 110 20 10 10 0 010-20zm0 2a8 8 0 100 16 8 8 0 000-16zm1.2 3.5c1.3 0 2.2.5 2.8 1.2l-1.2 1.1c-.4-.4-.9-.7-1.6-.7-1 0-1.6.6-1.6 1.6v.8h2.6v1.5h-2.6v1.6h4v1.6H8.5V15h1.2v-1.6H8.6v-1.5h1.1v-.9c0-2 1.4-3.5 3.5-3.5z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 110 20 10 10 0 010-20zm0 2a8 8 0 100 16 8 8 0 000-16zm1.2 3.5c1.3 0 2.2.5 2.8 1.2l-1.2 1.1c-.4-.4-.9-.7-1.6-.7-1 0-1.6.6-1.6 1.6v.8h2.6v1.5h-2.6v1.6h4v1.6H8.5V15h1.2v-1.6H8.6v-1.5h1.1v-.9c0-2 1.4-3.5 3.5-3.5z'/%3E%3C/svg%3E") center/contain no-repeat}
#mobile-header .mobile-toggle-open-container .menu-toggle-open{color:#fff}

/* ---------- footer (HIVE-managed) ---------- */
#colophon{background:var(--jk-footer);color:#fff}
#colophon .site-middle-footer-wrap .site-footer-row-container-inner,
#colophon .site-bottom-footer-wrap .site-footer-row-container-inner{background:var(--jk-footer)}
#colophon a{color:#fff}
#colophon a:hover{text-decoration:underline}
.jk-foot-addr{margin:0 0 12px}
.jk-foot-list{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 20px;font-size:12px;text-transform:uppercase}
.jk-foot-list a{text-decoration:none}
.jk-foot-list svg{width:12px;height:12px;fill:currentColor;margin-right:6px;vertical-align:-1px}
.jk-foot-legal{font-size:12px;opacity:.85;margin:16px 0 0}
.jk-foot-social{display:flex;gap:10px;margin:18px 0 0;padding:0;list-style:none}
.jk-foot-social a{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--jk-red);color:#fff}
.jk-foot-social a:hover{background:#9E111B;text-decoration:none}
.jk-foot-social svg{width:16px;height:16px;fill:currentColor}
.jk-logos{display:grid;grid-template-columns:repeat(3,1fr);gap:20px 16px;align-items:center;justify-items:end}
.jk-logos a{display:block;line-height:0}
.jk-logos img{display:block;height:32px;width:auto;max-width:none}
.jk-logos .jk-logo-tile{height:40px}
#colophon .site-bottom-footer-wrap{font-size:12px}
#colophon .footer-html{opacity:.9}

/* ---------- small screens ---------- */
@media (max-width:1024px){
  .jk-hero.wp-block-cover{min-height:420px}
  .jk-band h2,.jk-hero h1,.jk-cta h2{font-size:30px}
  .jk-logos{justify-items:center}
}
@media (max-width:767px){
  .jk-sec .jk-sec-title,.jk-page-title{font-size:28px}
  .jk-band{padding:40px 16px 48px}
  .jk-band h2,.jk-hero h1,.jk-cta h2{font-size:26px}
  .jk-search-card{padding:20px 14px}
  .jk-band .jk-search-card h2{font-size:26px}
  .jk-hero .wp-block-buttons{flex-direction:column;align-items:center}
  .jk-quotes .wp-block-quote{padding:0 40px}
  .jk-social-item p{display:none}
  .jk-social .wp-block-columns{flex-direction:row !important}
  .jk-article.wp-block-cover{min-height:300px}
  .jk-page{padding:28px 16px 40px}
  .jk-page .wp-block-columns{gap:24px}
  .jk-page .jk-col-nav{order:2}
  .page:not(.home) .entry-content > :not(.jk-page):not(.alignfull){padding-left:16px;padding-right:16px}
}
@media print{.jk-hero video{display:none}}

/* header: logo takes only its own width so the menu has room (28 Oct) */
#main-header .site-header-main-section-left{flex:0 0 auto}
#main-header .site-branding{width:auto;max-width:300px}
#main-header .primary-menu-container > ul{flex-wrap:nowrap}
#main-header .primary-menu-container > ul > li{white-space:nowrap;flex:none}
@media (max-width:1180px){#main-header .site-branding img{max-width:240px;height:auto}#main-header .main-navigation .primary-menu-container > ul > li.menu-item > a{padding-left:6px;padding-right:6px}}
/* hero: two-thirds of the screen height, as on the live site, so the search band shows below */
.jk-hero.wp-block-cover{min-height:66.667vh !important}
@media (max-width:767px){.jk-hero.wp-block-cover{min-height:60vh !important}}
/* homepage fixes (28 Oct, Bruce's review) */
.entry-content > .alignfull{margin-top:0;margin-bottom:0}
.home .entry-content > :last-child{margin-bottom:0}
.jk-search-card{max-width:1080px}
.jk-band .jk-search-card h2{color:var(--jk-green)}
.jk-search-card .ps-search{box-shadow:none;border:0;padding:0;background:transparent;max-width:none;width:100%}
.jk-cta .wp-block-cover__inner-container{text-align:center;max-width:1080px}
@media (min-width:1025px){[data-ps=featured] .ps-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
[data-ps=featured] > :not(.ps-grid){margin-top:28px}


/* Kadence zeroes side padding on full-width blocks: put it back on our sections */
.entry-content .jk-sec.alignfull,.entry-content .jk-band.alignfull,.entry-content .jk-ps.alignfull{padding-left:24px;padding-right:24px}
.entry-content .jk-page.alignfull{padding-left:24px;padding-right:24px}
@media (max-width:767px){
  .entry-content .jk-sec.alignfull,.entry-content .jk-band.alignfull,.entry-content .jk-ps.alignfull,.entry-content .jk-page.alignfull{padding-left:16px;padding-right:16px}
  .jk-mobile-icons{gap:12px}
  .jk-mobile-icons a{width:20px;height:20px}
  #mobile-header .site-branding img{max-width:130px;height:auto}
  #mobile-header .site-branding,#mobile-header .site-branding a.brand{max-width:140px;min-width:0}
  #mobile-header .site-header-main-section-left{min-width:0;flex:1 1 auto}
  #mobile-header .site-header-main-section-right{flex:none;gap:12px}
}
