/*
Theme Name: Sutton Heritage
Theme URI: https://sutton-in-ashfield.co.uk/
Author: Sutton Heritage Project
Description: Heritage green and parchment WordPress theme for Sutton-in-Ashfield local history.
Version: 1.9.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: sutton-heritage
*/
:root{--green:#063629;--deep:#00271d;--gold:#d5aa56;--paper:#f4e7cb;--ink:#282018}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:17px/1.5 Georgia,serif}a{color:inherit}a:hover{color:#ad812d}img{max-width:100%;height:auto}.site-header{background:var(--deep);color:#f9e5b6}.header-top{max-width:1400px;margin:auto;padding:18px 26px;display:flex;gap:24px;align-items:center;justify-content:space-between}.brand{font-size:clamp(24px,3vw,39px);font-weight:bold;line-height:1.1;text-decoration:none;color:var(--gold);letter-spacing:1px}.brand small{display:block;font:12px/1.8 Georgia,serif;letter-spacing:4px;color:#f3d8a4}.searchform{display:flex;gap:0}.searchform input{padding:12px;min-width:220px;border:1px solid #bfa675;border-radius:3px 0 0 3px}.searchform button,.btn{background:var(--gold);color:#171b12;border:0;padding:12px 20px;text-decoration:none;display:inline-block;border-radius:3px;font:600 15px Georgia,serif;cursor:pointer}.btn.dark{background:var(--green);color:white;border:1px solid var(--gold)}.site-nav{border-top:1px solid #476354}.site-nav ul{max-width:1400px;margin:auto;padding:0 20px;display:flex;gap:0;flex-wrap:wrap;list-style:none}.site-nav a{display:block;padding:12px 14px;color:#f6ebcf;text-decoration:none;font-size:15px}.site-nav a:hover{background:#184d3c;color:var(--gold)}.hero{min-height:420px;display:flex;align-items:center;background:linear-gradient(90deg,rgba(0,0,0,.87),rgba(0,0,0,.16)),linear-gradient(135deg,#746448,#29271e);color:#fff;border-bottom:5px solid var(--gold);position:relative}.hero-inner{max-width:1400px;width:100%;margin:auto;padding:64px 30px}.hero h1{font-size:clamp(48px,6vw,86px);line-height:.98;margin:15px 0;color:#fff5da}.hero h1 span{color:var(--gold)}.hero p{max-width:560px;font-size:21px}.eyebrow{letter-spacing:3px;text-transform:uppercase;font-size:13px;color:var(--gold)}.actions{display:flex;gap:14px;flex-wrap:wrap}.wrap{max-width:1400px;margin:auto;padding:32px 24px}.features{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.feature,.panel,.archive-card{background:#fff5de;border:1px solid #d6bd8b;padding:22px;box-shadow:0 3px 10px #4b3a1d12}.feature{text-align:center;transition:transform .25s,box-shadow .25s}.feature:hover{transform:translateY(-5px);box-shadow:0 10px 22px #4b3a1d22}.feature .symbol{font-size:43px;display:block}.feature h3{margin:7px 0;font-size:21px}.feature p{font-size:15px}.feature a{color:#75551b}.split{display:grid;grid-template-columns:1fr 1fr;gap:20px}.dark-section{background:var(--green);color:#f9e9c7;padding:30px}.dark-section h2{color:var(--gold)}.map-placeholder,.photo-placeholder{background:repeating-linear-gradient(35deg,#9d977c,#9d977c 20px,#b6ac8e 20px,#b6ac8e 40px);min-height:240px;display:grid;place-items:center;color:#1b2c23;text-align:center;padding:20px}.grid-archive{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.archive-card h3{margin:10px 0 4px}.archive-card .thumb{aspect-ratio:16/10;object-fit:cover;width:100%;background:#c7b794}.page-head{background:var(--green);color:var(--gold);padding:35px 0}.page-head h1{margin:0;font-size:clamp(35px,5vw,60px)}.content-area{min-height:320px}.site-footer{background:var(--deep);color:#f2e1b9;padding:35px 24px;text-align:center;border-top:4px solid var(--gold)}.site-footer a{color:var(--gold)}.book{background:#7a5231;padding:22px;border-radius:15px;box-shadow:0 10px 25px #0004}.book-pages{display:grid;grid-template-columns:1fr 1fr;background:#f7ecd0;min-height:320px}.book-page{padding:25px;border:1px solid #d7c69d;position:relative}.book-page h3{margin-top:0}.book-controls{display:flex;justify-content:space-between;align-items:center;margin-top:15px}.book button{cursor:pointer;background:var(--gold);padding:10px 16px;border:0}.entry-meta{color:#675c46}.wp-block-image img{height:auto}@media(max-width:850px){.header-top{flex-wrap:wrap}.features{grid-template-columns:repeat(2,1fr)}.split{grid-template-columns:1fr}.grid-archive{grid-template-columns:repeat(2,1fr)}.hero{min-height:350px}}@media(max-width:520px){.features,.grid-archive,.book-pages{grid-template-columns:1fr}.searchform input{min-width:0;width:180px}.header-top{padding:14px}.hero-inner{padding:44px 20px}.book-page{min-height:200px}}

/* Heritage collections: homepage and collection quick navigation */
.heritage-collections{padding-top:48px;padding-bottom:56px}.collections-heading{max-width:740px;margin-bottom:26px}.heritage-collections-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.heritage-collection-card{border:1px solid #ddd2b8;border-radius:14px;padding:25px 20px;background:#fffdf7;box-shadow:0 4px 14px #0000000a}.heritage-collection-card h3{margin:14px 0 8px;font-size:1.25rem}.heritage-collection-card p{min-height:65px}.heritage-collection-card a{font-weight:700}.collection-icon{font-size:2rem}.heritage-quick-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;padding:12px 20px;background:#f5edda;border-bottom:1px solid #ded2b7}.heritage-quick-nav a{font-size:.92rem;font-weight:700;color:#3c3023;text-decoration:none}.heritage-quick-nav a:hover{text-decoration:underline}@media(max-width:850px){.heritage-collections-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:500px){.heritage-collections-grid{grid-template-columns:1fr}.heritage-collection-card p{min-height:0}}

/* v1.2: Authentic Sutton-in-Ashfield Market Place heritage photograph */
.home .hero, .hero {
  background-image: linear-gradient(90deg, rgba(16,12,8,.94) 0%, rgba(16,12,8,.77) 27%, rgba(16,12,8,.32) 52%, rgba(16,12,8,.05) 100%), url('assets/images/sutton-market-place-original.png');
  background-color: #211c16;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}
.hero-inner { position:relative; z-index:1; }
.hero-inner h1, .hero-inner p { text-shadow:0 2px 9px rgba(0,0,0,.4); }
@media (max-width:700px) {
  .home .hero, .hero {
    background-image:linear-gradient(90deg,rgba(16,12,8,.90),rgba(16,12,8,.56)),url('assets/images/sutton-market-place-original.png');
    background-position: 58% center;
  }
}

/* v1.3 mobile/tablet menu */
.sh-mobile-menu-toggle{display:none;background:#0b3a2b;color:#f9e5b6;border:1px solid #d5aa56;border-radius:5px;padding:11px 17px;font:700 17px Georgia,serif;margin:8px 16px;cursor:pointer}
@media(max-width:1024px){.sh-mobile-menu-toggle{display:block}.site-nav{display:none}.site-nav.sh-menu-open{display:block}.site-nav ul{display:block;padding:4px 14px 14px;margin:0;max-width:none}.site-nav li{display:block;width:100%}.site-nav a{display:block;padding:13px 16px;border-bottom:1px solid #355747}.site-nav .sub-menu{display:block;padding-left:18px}.header-top{flex-wrap:wrap}.header-top .brand{max-width:100%;overflow-wrap:anywhere}}
@media(max-width:520px){.brand{font-size:clamp(19px,6vw,30px)}.brand small{letter-spacing:1.5px;font-size:10px}}
.sh-compact-updates{padding:10px 14px!important;margin-top:10px!important;margin-bottom:12px!important;max-width:100%;overflow:hidden}.sh-compact-updates h1,.sh-compact-updates h2,.sh-compact-updates h3{font-size:clamp(19px,2.5vw,28px)!important;line-height:1.2!important;margin:4px 0 9px!important}.sh-compact-updates img{max-height:92px!important;width:auto;object-fit:contain}.sh-compact-updates p{margin:5px 0!important}
@media(max-width:700px){.sh-compact-updates{padding:8px!important}.sh-compact-updates img{max-height:60px!important}.sh-compact-updates h1,.sh-compact-updates h2,.sh-compact-updates h3{font-size:19px!important}}

/* v1.4: Vintage green/gold postcard and video showcase.
   The two original shortcodes, media, playback and destination links remain intact. */
.sh-featured-showcase{gap:22px;align-items:stretch;padding-top:28px;padding-bottom:44px}
.sh-featured-panel{min-width:0;overflow:hidden;background:linear-gradient(150deg,#785033 0%,#52331f 100%);border:3px solid #c79a4d;border-radius:24px;box-shadow:0 5px 0 #8b602d,0 15px 26px #2c180c40;display:flex;flex-direction:column}
.sh-featured-heading{display:flex;align-items:center;justify-content:center;gap:15px;min-height:84px;padding:15px 18px;background:linear-gradient(155deg,#07503b,#002d22 75%);border-bottom:4px double #d9b46d;color:#ffe4a3;text-align:center}
.sh-featured-heading h2{font-size:clamp(24px,2.6vw,37px);line-height:1.15;margin:0;color:#ffe5a9;text-shadow:0 2px 2px #0008}
.sh-heading-icon{font-size:30px;color:#eec36f;line-height:1}
.sh-featured-content{padding:18px;flex:1;min-width:0;color:#fff0d0}
.sh-featured-content img{max-width:100%;height:auto}
.sh-postcard-panel .sh-featured-content img{border:8px solid #f3e2bb;box-shadow:0 5px 18px #0007}
.sh-featured-content a:not(:has(img)){background:linear-gradient(#f5d788,#bc8739);border:2px solid #f5d58d;border-radius:9px;color:#251707!important;font-weight:700;padding:10px 18px;text-decoration:none;display:inline-block;box-shadow:0 3px 7px #0005}
.sh-featured-content a:not(:has(img)):hover{filter:brightness(1.1)}
.sh-featured-content video,.sh-featured-content iframe{max-width:100%}
.sh-featured-content .stv-television{max-width:100%;margin-left:auto;margin-right:auto}
@media(max-width:850px){.sh-featured-showcase{grid-template-columns:1fr}.sh-featured-panel{max-width:720px;width:100%;margin:auto}}
@media(max-width:520px){.sh-featured-heading{min-height:65px;padding:12px}.sh-featured-heading h2{font-size:24px}.sh-featured-content{padding:12px}.sh-featured-panel{border-radius:15px}}

/* v1.5: both Visit links are on the lower right of their respective media. */
.sh-featured-media-frame{position:relative;isolation:isolate;width:100%;max-width:100%;margin:0 auto 12px}
.sh-featured-media-frame>img,.sh-featured-media-frame>a:has(img){display:block;width:100%;max-width:100%}
.sh-featured-media-frame img{display:block;width:100%;height:auto}
.sh-featured-media-frame>.stv-television{width:100%;margin:0 auto}
.sh-featured-media-frame>.sh-featured-visit{
 position:absolute!important;right:12px!important;bottom:12px!important;z-index:10;
 display:inline-flex!important;align-items:center;justify-content:center;
 margin:0!important;min-width:76px;padding:9px 18px!important;
 background:linear-gradient(#f6df9e,#c38b35)!important;color:#211605!important;
 border:2px solid #f9e4ab!important;border-radius:9px!important;
 box-shadow:0 3px 9px #0009!important;font-weight:700!important;text-decoration:none!important;
}
.sh-featured-media-frame>.sh-featured-visit:hover{filter:brightness(1.1)}
.sh-featured-video-title{margin:0 0 12px!important;text-align:center;color:#ffe2a1}
.sh-featured-content{display:flex;flex-direction:column}
@media(max-width:520px){.sh-featured-media-frame>.sh-featured-visit{right:7px!important;bottom:7px!important;padding:7px 12px!important}}


/* v1.6 — remove excess empty brown space beneath postcard and video.
   Cards shrink to fit the actual shortcode media instead of stretching. */
.sh-featured-showcase{align-items:start!important;padding-bottom:24px!important}
.sh-featured-showcase>.sh-featured-panel{
  height:auto!important;
  min-height:0!important;
  align-self:start!important;
}
.sh-featured-panel>.sh-featured-content{
  flex:0 0 auto!important;
  padding:12px 14px 10px!important;
  min-height:0!important;
}
.sh-featured-media-frame{margin-bottom:0!important}
.sh-featured-content>.sh-featured-media-frame:last-child{margin-bottom:0!important}
.sh-featured-panel .sh-featured-content>p:empty{display:none}
@media(max-width:520px){
 .sh-featured-panel>.sh-featured-content{padding:10px!important}
 .sh-featured-showcase{gap:16px!important}
}

/* v1.7 — hide the historic film caption plaque on homepage only. */
.home .sh-featured-showcase .sh-video-panel .stv-title,
.home .sh-featured-showcase .sh-video-panel .stv-video-title,
.home .sh-featured-showcase .sh-video-panel .stv-caption,
.home .sh-featured-showcase .sh-video-panel .stv-video-caption,
.home .sh-featured-showcase .sh-video-panel .sh-featured-video-title {display:none!important}

/* v1.9: equal-height featured panels on desktop without changing media sizes. */
@media (min-width:851px){
 .sh-featured-showcase{align-items:stretch!important;}
 .sh-featured-showcase>.sh-featured-panel{
   align-self:stretch!important;
   height:auto!important;
   min-height:0!important;
   margin-top:0!important;
   margin-bottom:0!important;
 }
 .sh-featured-showcase>.sh-featured-panel>.sh-featured-content{
   flex:1 1 auto!important;
 }
}
