/* =====================================================================
   Scotgate Cottage - global styles for the Impreza/WPBakery rebuild
   (ACS, Oct 2026). Ported from the Elementor site: header-template CSS,
   Customizer Additional CSS and the sg-* mu-plugins.
   Page-specific layout lives in each page's WPBakery Custom CSS.
   ===================================================================== */

/* Body sans = Mulish (was in Customizer Additional CSS on the Elementor site; overrides the
   sgsans.woff face that the sg-fonts mu-plugin registers) */
@font-face{font-family:'SGSans';src:url('/wp-content/uploads/sgfonts/mulish.woff2') format('woff2');font-weight:300 900;font-style:normal;font-display:swap;}

/* ---------- base: match the old hello-elementor defaults ---------- */
html, body.sg-site {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	font-size: 16px;
	line-height: 1.5;
	color: #333;
	background: #fff;
}
body.sg-site .l-canvas, body.sg-site .l-main { background: transparent; }
body.sg-site .l-main { padding: 0 !important; }
body.sg-site .l-section.sg-e { padding: 0; position: relative; }
body.sg-site .l-section.sg-e > .l-section-h { padding: 0; margin-left: auto; margin-right: auto; }
body.sg-site .sg-e .g-cols { margin: 0; }
body.sg-site .sg-e .wpb_column { position: relative; }
body.sg-site .sg-e .vc_column-inner { position: relative; }
body.sg-site .sg-e .w-text, body.sg-site .sg-e .wpb_text_column, body.sg-site .sg-e .w-image,
body.sg-site .sg-e .w-html, body.sg-site .sg-e .w-separator, body.sg-site .sg-e .w-btn-wrapper,
body.sg-site .sg-e .w-slider, body.sg-site .sg-e .w-form { margin: 0; }
body.sg-site .sg-e h1, body.sg-site .sg-e h2, body.sg-site .sg-e h3, body.sg-site .sg-e h4, body.sg-site .sg-e h5, body.sg-site .sg-e h6 { padding: 0; }
body.sg-site .sg-e .w-text-h, body.sg-site .sg-e .w-text-value { color: inherit; font: inherit; letter-spacing: inherit; text-transform: inherit; }
body.sg-site .sg-e .w-separator { min-height: 0; }
body.sg-site .sg-e .w-image { display: block; }
body.sg-site .sg-e .w-image-h { display: inline; }
body.sg-site .sg-e .w-btn { text-decoration: none; transition: background-color .3s, color .3s; }

/* headings typed inside text blocks: the Hello/Elementor defaults the site was built on */
.sg-site .wpb_text_column h1, .sg-site .wpb_text_column h2, .sg-site .wpb_text_column h3, .sg-site .wpb_text_column h4, .sg-site .wpb_text_column h5, .sg-site .wpb_text_column h6 { font-family: Roboto, sans-serif; font-weight: 500; line-height: 1.2; margin-block-start: .5rem; margin-block-end: 1rem; color: inherit; letter-spacing: normal; text-transform: none; padding: 0; }
.sg-site .wpb_text_column h1 { font-size: 2.5rem; } .sg-site .wpb_text_column h2 { font-size: 2rem; } .sg-site .wpb_text_column h3 { font-size: 1.75rem; }
.sg-site .wpb_text_column h4 { font-size: 1.5rem; } .sg-site .wpb_text_column h5 { font-size: 1.25rem; } .sg-site .wpb_text_column h6 { font-size: 1rem; }

/* Hello theme kept the bottom margin on the last paragraph; Impreza zeroes it */
.sg-site .w-html p:last-child { margin-bottom: .9rem; }

/* SGScript wordmark: ascenders/descenders must not clip (was the 29 Sep fix) */
.sg-brush, .sg-brush .w-text-h { overflow: visible; }

/* ---------- header bar (Impreza header builder) ---------- */
body.sg-site .l-header { box-shadow: none !important; }
body.sg-site .l-header .l-subheader.at_middle { background: #F4F1ED !important; }
body.sg-site .l-header .l-subheader.at_middle .l-subheader-h { max-width: none !important; padding: 0 30px !important; }
body.sg-site .l-header .w-text.sg-logo { font-family: SGScript, sans-serif; font-size: 34px; font-weight: 700; line-height: 51px; color: #623E2A; padding-bottom: .1em; align-self: flex-start; margin-top: 12px; }
body.sg-site .l-header .w-text.sg-logo a, body.sg-site .l-header .w-text.sg-logo a:hover { color: #623E2A !important; text-decoration: none; }
body.sg-site .l-header .w-html { line-height: normal; }

/* ---------- nav (was the html widget in Elementor header post 47) ---------- */
.sg-navwrap { position: relative; }
.sg-burger { display: none; background: transparent !important; border: 0 !important; box-shadow: none !important; outline: none; font-size: 26px; line-height: 1; color: #623E2A !important; cursor: pointer; padding: 4px 6px; font-family: inherit; }
.sg-nav { text-align: right; line-height: 2.0; white-space: nowrap; }
.sg-nav a { display: inline-block; margin: 0 6px; color: #304254; font-family: SGSans, sans-serif; font-weight: 400; font-size: 15px; text-decoration: none; transition: color .2s; }
.sg-nav a:hover { color: #8a6a4a; }
.sg-nav .sg-grp { position: relative; display: inline-block; }
.sg-nav .sg-sub { display: none; position: absolute; top: 100%; right: 0; background: #F4F1ED; padding: 8px 18px; box-shadow: 0 10px 26px rgba(0,0,0,.12); border-radius: 8px; z-index: 200; min-width: 170px; text-align: right; }
.sg-nav .sg-grp:hover .sg-sub { display: block; }
.sg-nav .sg-sub a { display: block; margin: 7px 0; white-space: nowrap; }
.sg-nav a.sg-current { font-weight: 700; }
@media (max-width:1649px) {
	.sg-burger { display: block; }
	.sg-nav { display: none; position: absolute; top: calc(100% + 14px); right: 0; background: #F4F1ED; flex-direction: column; text-align: right; white-space: normal; padding: 12px 20px; box-shadow: 0 10px 26px rgba(0,0,0,0.14); min-width: 215px; border-radius: 4px; z-index: 120; }
	.sg-navwrap.open .sg-nav { display: flex; }
	.sg-nav a { display: block; margin: 7px 0; font-size: 15px; }
}
@media (max-width:1024px) {
	.sg-nav .sg-grp { display: block; }
	.sg-nav .sg-grp:hover .sg-sub { display: none; }
	.sg-nav .sg-sub { position: static; box-shadow: none; background: transparent; padding: 0 0 4px 16px; min-width: 0; border-radius: 0; }
	.sg-nav .sg-grp.open .sg-sub { display: block; }
	.sg-parent { cursor: pointer; }
}

/* ---------- sticky BOOK YOUR STAY pill ---------- */
.sg-sticky-book { position: fixed; bottom: 20px; right: 20px; z-index: 9999; }
.sg-sticky-book a { display: inline-block; background: #D4A574; color: #fff !important; padding: 14px 28px; border-radius: 30px; text-decoration: none; font-weight: 700; font-size: 15px; letter-spacing: 1px; box-shadow: 0 4px 15px rgba(0,0,0,0.2); transition: all 0.3s ease; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif; line-height: 1.5; }
.sg-sticky-book a:hover { background: #C4945F; transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0,0,0,0.25); }
@media (max-width: 767px) {
	.sg-sticky-book { bottom: 10px; right: 10px; left: 10px; text-align: center; }
	.sg-sticky-book a { display: block; padding: 16px; font-size: 16px; }
}

/* ---------- helper classes used in page content ---------- */
.sg-bright img { filter: brightness(1.16) saturate(1.07); }
.sg-frame img { border: 1px solid rgba(255,255,255,0.92) !important; outline: 1px solid rgba(255,255,255,0.4); outline-offset: 7px; }
.sg-frame-tan img { border: 1px solid #bcae9c !important; padding: 9px !important; border-radius: 0 !important; box-sizing: content-box; }
.sg-fbox { border: 1px solid rgba(255,255,255,0.5); padding: 30px 16px 34px; display: flex; flex-direction: column; align-items: center; min-height: 360px; box-sizing: border-box; }
.sg-ficon { height: 170px; width: auto; max-width: 185px; object-fit: contain; margin-bottom: 16px; display: block; }
.sg-ftitle { font-family: SGSans, sans-serif; font-weight: 400; font-size: 27px; color: #EFEBE5; text-align: center; line-height: 1.25; }
.sg-muddy { position: absolute !important; top: 36px; right: 150px; z-index: 5; width: 185px !important; }
@media (max-width:1024px) { .sg-muddy { position: static !important; right: auto; margin: 10px auto 0; } }
.sg-icon { height: 200px !important; display: flex !important; align-items: flex-end; justify-content: center; }
.sg-icon img { width: auto !important; height: auto !important; max-height: 185px; max-width: 185px; }
.sg-fcard { min-height: 375px; box-sizing: border-box; }
@media (max-width:1024px) { .sg-icon { height: auto !important; } .sg-fcard { min-height: 0; } }
/* warm tint over selected homepage photos (was /*SGWARM*/ in the header template) */
.sg-warm .w-image-h { position: relative; display: inline-block !important; }
.sg-warm .w-image-h::after { content: ""; position: absolute; inset: 0; background: rgba(120,72,38,0.18); pointer-events: none; border-radius: inherit; z-index: 1; }
.sg-readmore { display: block !important; width: -moz-max-content; width: max-content; max-width: 100%; margin: 14px 0 0 auto !important; }

/* forms: Elementor showed no required asterisk */
body.sg-site .sg-e .w-form-row-label::after, body.sg-site .sg-e .w-form-row-label::before { content: none !important; display: none !important; }
body.sg-site .w-form span.required { display: none !important; }
/* footer legal links (was sg-legal-links in Customizer CSS, 3 Oct 2026) */
.sg-sglegalhtml a { color: #623E2A !important; font-size: 14px !important; text-decoration: underline; }
.sg-sglegalhtml a:hover { color: #A2BBAE !important; }

/* =================== POP-UP FORMS (Reusable Blocks "Popup - ...", shown by us_popup) =================== */
.sg-site .sg-poprow { padding: 0 !important; height: 0; overflow: visible; }
.sg-popblock { padding: 0 !important; }
.sg-popblock > .l-section-h { padding: 0 !important; max-width: none !important; }
.sg-popblock .sg-pop-h { font-family: SGSerif, serif; color: #623E2A; font-size: 34px; font-weight: 500; line-height: 1.2; text-align: center; margin: 0 0 18px; }
.sg-popform input[type=text], .sg-popform input[type=email], .sg-popform textarea { font-family: SGSans, sans-serif; font-size: 15px; border: 1px solid #c8bcab; border-radius: 0; background: #fff; color: #333; padding: 8px 12px; box-shadow: none; }
.sg-popform .w-btn { width: 100%; background: #623E2A !important; color: #fff !important; font-family: SGSans, sans-serif; font-weight: 700; font-size: 16px; letter-spacing: .8px; border-radius: 0; border: 0; padding: 14px 20px; box-shadow: none; }
.sg-popform .w-btn:hover { background: #4A2E1C !important; }
.w-popup-box-content:has(.sg-popblock), .sg-news-form .sg-popblock { background: #F4F1ED; }
.sg-news-form .sg-popblock .l-section-h { padding: 0 !important; }

/* =================== BLOG (was the sg-blog mu-plugin on the Hello theme) =================== */
body.blog.sg-site, body.single-post.sg-site { background: #F4F1ED !important; }
/* single post - Page Template "Scotgate Blog Post" */
.sg-site .sg-single { padding: 0 !important; }
.sg-site .sg-single > .l-section-h { max-width: 820px !important; margin: 0 auto 72px !important; padding: 150px 26px 0 !important; box-sizing: border-box; }
.sg-site .sg-single .g-cols, .sg-site .sg-single .vc_column-inner { display: block !important; padding: 0 !important; }
.sg-site .sg-single .sg-post-title { font-family: 'SGSerif', Georgia, serif !important; color: #623E2A !important; font-size: 50px !important; line-height: 1.08 !important; font-weight: 500 !important; text-align: center; margin: 0 auto .55em !important; max-width: 760px; padding: 0; letter-spacing: normal; text-transform: none; }
.sg-site .sg-single .sg-post-title::after { content: ""; display: block; width: 74px; height: 3px; background: #A2BBAE; margin: 22px auto 0; border-radius: 2px; }
.sg-site .sg-single .sg-post-content p { font-family: 'SGSans', sans-serif; font-size: 18px; line-height: 1.82; color: #4a4a4a; margin: 0 0 1.15em; }
.sg-site .sg-single .sg-post-content h2 { font-family: 'SGSerif', Georgia, serif; color: #623E2A; font-size: 31px; font-weight: 500; line-height: 1.2; margin: 1.75em 0 .45em; padding: 0; letter-spacing: normal; }
.sg-site .sg-single .sg-post-content h3 { font-family: 'SGSans', sans-serif; color: #4A2E1C; font-size: 21px; font-weight: 700; margin: 1.5em 0 .35em; padding: 0; line-height: 1.2; letter-spacing: normal; }
.sg-site .sg-single .sg-post-content ul, .sg-site .sg-single .sg-post-content ol { margin: 0 0 1.3em 1.25em; padding: 0; }
.sg-site .sg-single .sg-post-content li { font-family: 'SGSans', sans-serif; font-size: 18px; line-height: 1.7; color: #4a4a4a; margin: .35em 0; }
.sg-site .sg-single .sg-post-content a { color: #623E2A; }
.sg-site .sg-single .sg-post-content > :last-child { margin-bottom: 0 !important; } /* Hello collapsed it into the 72px bottom margin */
.sg-site .sg-single .sg-post-content img { border-radius: 8px; height: auto; max-width: 100%; }
/* blog index - Page Template "Scotgate Blog Index" */
.sg-site .sg-bloglist { padding: 0 !important; }
.sg-site .sg-bloglist > .l-section-h { max-width: 1120px !important; margin: 0 auto !important; padding: 150px 26px 80px !important; box-sizing: border-box; }
.sg-site .sg-bloglist .g-cols, .sg-site .sg-bloglist .vc_column-inner { display: block !important; padding: 0 !important; }
.sg-site .sg-bloglist .sg-blog-title { font-family: 'SGSerif', Georgia, serif !important; color: #623E2A !important; font-size: 44px !important; font-weight: 500 !important; text-align: center !important; margin: 0 0 6px !important; line-height: 1.15 !important; padding: 0; letter-spacing: normal; }
.sg-blog-cards article.post { background: #fff; border: 1px solid #e6ddcf; border-radius: 8px; padding: 30px 34px 26px; margin: 26px 0 0; box-shadow: 0 6px 22px rgba(74,46,28,.06); transition: box-shadow .2s, transform .2s; }
.sg-blog-cards article.post:hover { box-shadow: 0 10px 30px rgba(74,46,28,.12); transform: translateY(-2px); }
.sg-blog-cards article.post img.wp-post-image { width: 100%; height: 250px; object-fit: cover; border-radius: 6px; display: block; }
.sg-blog-cards article.post .entry-title { font-family: 'SGSerif', Georgia, serif !important; font-size: 27px !important; font-weight: 500 !important; margin: 0 0 12px !important; line-height: 1.2; padding: 0; letter-spacing: normal; }
.sg-blog-cards article.post .entry-title a { color: #623E2A !important; text-decoration: none; }
.sg-blog-cards article.post p { font-family: 'SGSans', sans-serif; font-size: 16.5px; line-height: 1.72; color: #5a5148; margin: 0 0 18px; text-align: left; }
.sg-readmore { background: #623E2A; color: #fff !important; font-family: 'SGSans', sans-serif; font-size: 12.5px; font-weight: 700; letter-spacing: .6px; text-transform: uppercase; text-decoration: underline; padding: 9px 18px; border-radius: 4px; }
.sg-readmore:hover { background: #4A2E1C; }
@media (max-width:767px) {
	.sg-site .sg-single .sg-post-title { font-size: 34px !important; }
	.sg-site .sg-bloglist .sg-blog-title { font-size: 32px !important; }
	.sg-blog-cards article.post { padding: 24px 22px; }
}

/* Header nav placement (injected nav) + hide Impreza's empty default burger */
#w-header-show{display:none !important}
.l-header .sg-navwrap{position:absolute;right:5vmin;top:0;height:100%;display:flex;align-items:center;z-index:130}
.l-header .sg-nav{line-height:1.2}
@media (max-width:1024px){ .l-header .sg-navwrap{right:18px} }

/* fix: anchor the injected nav to the viewport top-right (header is only 300px wide) */
.l-header .sg-navwrap{position:fixed !important;top:26px;right:5vmin;left:auto;height:auto;z-index:1000}
.sg-burger{color:#623E2A !important}
@media (max-width:1024px){ .l-header .sg-navwrap{right:18px;top:20px} }

/* inject nav into body (l-header is hidden at mobile widths) - position fixed top-right */
.sg-navwrap{position:fixed !important;top:26px;right:5vmin;left:auto;height:auto;z-index:1000}
@media (max-width:1024px){ .sg-navwrap{right:16px;top:16px} }

/* FAQ accordion (shared by the FAQ page and the Events page) */
.sg-faq{max-width:880px;margin:0 auto;}
.sg-faq-item{border:1px solid #c8bcab;background:#fff;margin-bottom:12px;border-radius:2px;}
.sg-faq-q{font-family:"SGSerif",Georgia,serif;font-size:21px;color:#623E2A;padding:18px 46px 18px 20px;cursor:pointer;list-style:none;position:relative;line-height:1.35;}
.sg-faq-q::-webkit-details-marker{display:none;}
.sg-faq-q::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);font-size:26px;line-height:1;color:#A2BBAE;font-family:"SGSans",sans-serif;}
.sg-faq-item[open] .sg-faq-q::after{content:"\2013";}
.sg-faq-item[open] .sg-faq-q{border-bottom:1px solid #e6ded3;}
.sg-faq-q:hover{background:#faf8f3;}
.sg-faq-a{font-family:"SGSans",sans-serif;font-size:17px;line-height:1.65;color:#4a4a4a;padding:16px 20px 4px 20px;}
.sg-faq-a p{margin:0 0 14px 0;}
@media (max-width:600px){.sg-faq-q{font-size:19px;padding:16px 40px 16px 16px;}.sg-faq-a{padding:14px 16px 2px 16px;font-size:16px;}}

/* === Solid header bar (fixes Impreza dropping header content -> 60px cream left strip) === */
.l-header{position:fixed!important;top:0!important;left:0!important;right:0!important;width:100%!important;height:88px!important;min-height:88px!important;max-height:88px!important;background:#F4F1ED!important;box-shadow:0 1px 12px rgba(40,25,12,.07)!important;z-index:500!important;overflow:visible!important}
.l-header .l-subheader,.l-header .l-subheader-h,.l-header [class*="l-subheader"]{width:100%!important;height:88px!important;min-height:0!important;max-height:88px!important;background:transparent!important;position:static!important}
.sg-logo{position:fixed!important;left:5vmin;top:0;height:88px;display:flex;align-items:center;font-family:SGScript,cursive;font-size:36px;line-height:1;color:#623E2A!important;text-decoration:none;z-index:510}
.sg-logo:hover{color:#8a6a4a!important}
.sg-navwrap{top:30px!important}
@media (max-width:1024px){.l-header,.l-header [class*="l-subheader"]{height:72px!important;max-height:72px!important}.sg-logo{height:72px;font-size:30px}.sg-navwrap{top:22px!important}}
/* force the header to true full viewport width (100% was resolving to 1210) */
.l-header{width:100vw!important;max-width:100vw!important;left:0!important;right:auto!important}

/* Image haze -> match live: Elementor applies opacity:.5 to its background overlay,
   so its effective tint is half the stated colour alpha (rgba(40,26,15,.22)->~.11,
   rgba(40,26,12,.32)->~.16). Our rebuilt rows carry the same overlay colours at full
   opacity, making every image ~2x too dark. Halve them globally to match the live look. */
.l-section-overlay{opacity:.5!important}

/* Form success / voucher-reveal text -> brand brown (Impreza default was lime #44CC00,
   off-brand against the cream popup). Covers both popups + contact + footer forms. */
.w-form-message.type_success{color:#623E2A!important;font-weight:600}
