/*
Theme Name: Rembrandt
Author: QNY Creative
Author URI: http://qnycreative.com
Version: 1.0
*/

/* Colors — overwrite per project */
:root{
	--primary:#658D1B;
	--accent:#FA4616;
	--white:#fff;
	--dark:#1a1a1a;
	--text:#000;
	--text-light:#999;
	--border:#ccc;
	--bg:#fff;
	--bg-alt:#efefef;
}

/* WordPress Core Styles */
.alignleft{float:left; margin-right:1.5rem; margin-bottom:1rem}
.alignright{float:right; margin-left:1.5rem; margin-bottom:1rem}
.aligncenter{display:block; margin-left:auto; margin-right:auto; margin-bottom:1rem}
.alignwide{max-width:100%; margin-left:auto; margin-right:auto}
.alignfull{max-width:100vw; margin-left:calc(-50vw + 50%); width:100vw}
.wp-caption{max-width:100%; margin-bottom:1rem}
.wp-caption img{display:block; max-width:100%; height:auto}
.wp-caption-text,.wp-block-image figcaption,.gallery-caption{font-size:.875rem; color:#666; margin-top:.5rem; text-align:center}
img{max-width:100%; height:auto}
.wp-block-image img{display:block}
.gallery{display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:1.5rem}
.gallery-item{flex:1 0 calc(33.333% - .5rem)}
.gallery-item img{display:block; width:100%; height:auto}
.screen-reader-text{clip:rect(1px,1px,1px,1px); clip-path:inset(50%); height:1px; width:1px; margin:-1px; overflow:hidden; padding:0; position:absolute; word-wrap:normal!important}
.screen-reader-text:focus{background-color:#f1f1f1; clip:auto!important; clip-path:none; color:#21759b; display:block; font-size:.875rem; font-weight:700; height:auto; left:5px; line-height:normal; padding:15px 23px 14px; text-decoration:none; top:5px; width:auto; z-index:100000}
.entry-content::after{content:""; display:table; clear:both}
.wp-block-quote{border-left:4px solid #ccc; margin:1.5rem 0; padding:.5rem 1.5rem}
.wp-block-pullquote{border-top:4px solid #ccc; border-bottom:4px solid #ccc; padding:1.5rem 0; text-align:center}
.wp-block-table{width:100%; margin-bottom:1.5rem; border-collapse:collapse}
.wp-block-table td,.wp-block-table th{padding:.5rem; border:1px solid #ccc}
.wp-block-separator{border:none; border-top:2px solid #ccc; margin:2rem 0}
.wp-block-button .wp-block-button__link{display:inline-block; padding:.75rem 1.5rem; text-decoration:none}
.has-text-align-left{text-align:left}
.has-text-align-center{text-align:center}
.has-text-align-right{text-align:right}

/* Minimal Reset */
*, *::before, *::after{box-sizing:border-box; margin:0; padding:0}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; font-size:16px}
body{font-family:sans-serif; min-height:100vh; line-height:1.5; overflow-x:hidden; font-weight:400; font-size:1.2rem;}
img, picture, video, canvas, svg{display:block; max-width:100%; height:auto}
button{font:inherit; cursor:pointer}
a{text-decoration:none; color:inherit}
table{border-collapse:collapse; border-spacing:0}
h1,h2,h3,h4,h5,h6{font-size:inherit; font-weight:inherit}
input, select, textarea{width:100%; padding:10px; border:1px solid var(--border); background:var(--white); font:inherit; border-radius:0; -webkit-appearance:none}
textarea{resize:none; min-height:120px}

/* Layout */
.content{ width:1300px; margin:0 auto; padding:0;}
.hidden{display:none !important}
.center{ text-align:center !important;}
.bg{ display: flow-root;}
.white{ color:var(--white);}

/* Column Layout */
.row{display:flex; flex-wrap:wrap; gap:15px}
.col{flex:1}
.col-1{flex:0 0 100%}
.col-2{flex:0 0 calc(50% - 7.5px)}
.col-3{flex:0 0 calc(33.333% - 10px)}
.col-4{flex:0 0 calc(25% - 11.25px)}
.col-5{flex:0 0 calc(20% - 12px)}

/* Responsive BG */
.rbg{background-image:var(--bg-desktop); background-size:cover; background-position:center}

/* Solid fill button */
.button{display:inline-block; padding:12px 30px; background:var(--primary); color:var(--white); font-weight:700; text-transform:uppercase; letter-spacing:0.05em; font-size:0.875rem; cursor:pointer; border:none; transition:background 0.3s}
.button:hover{background:var(--accent)}

/* Notifications */
.msg{padding:12px 16px; font-size:1rem; margin:20px 0 0; display:none;}
.msg.visible{display:block !important;}
.msg.success{background:#e8f5e9; color:#2e7d32; border:1px solid #a5d6a7}
.msg.error{background:#fbe9e7; color:#c62828; border:1px solid #ef9a9a}
.msg.warning{background:#fff8e1; color:#f57f17; border:1px solid #ffe082}
.redBorder{border-color:#c62828 !important; outline: 2px solid #c62828 !important;}

/* ACF Blocks wrapper */
.block { margin: 60px auto; position: relative;}
.block .content { margin: 0px auto;}

/* Popup CPT overlay */
.popupOverlay{position:fixed; left:0; top:0; background:rgba(255,255,255,0.8); display:block; width:100vw; height:100vh; z-index:1000;}
.popupOverlay .verticalAlign{width:100%; height:100%; display:table-cell; vertical-align:middle;}
.popupOverlay .popup{ width: 100%; margin:0 auto; max-width:420px; position: relative;}
.popupOverlay .popupFullImg{ width: 100%; margin:0 auto; display: block; }
.popupOverlay .popupFullImg img{ display: block; width: 100%;}
.popupOverlay .close{ position: absolute; right: -40px; top: -40px; width: 40px; height: 40px; box-sizing: border-box; background: url(img/close.svg) no-repeat center center / contain; cursor: pointer;}
.displayTable{ display: table; width: 100%; height: 100%;}
.verticalAlign{ display: table-cell; vertical-align: middle;}

/* Header */
header { transition: 0.3s ease; padding: 60px 0px 0px; position: fixed; z-index: 1000; left: 0px; top: 0px; width: 100%;}
body.admin-bar header{ top: 32px;}
header .content{ display:flex; align-items:center; justify-content:center; position:relative;}
header .menuIcon { position: absolute; left: 0px; width: 60px; height: 60px; flex-shrink: 0; top: 0px; display: flex; align-items: center; justify-content: center; background: var(--bg-alt); border-radius: 50%; cursor: pointer; z-index: 1001;}
header .menuIcon span { display: block; width: 28px; height: 3px; background: var(--dark); border-radius: 2px; position: absolute; transition: 0.3s ease; left: 50%; margin-left: -14px;}
header .menuIcon span:nth-child(1) { top: 20px;}
header .menuIcon span:nth-child(2) { top: 28px;}
header .menuIcon span:nth-child(3) { top: 36px;}
body.menuOpen .menuIcon span:nth-child(1) { top: 28px; transform: rotate(45deg);}
body.menuOpen .menuIcon span:nth-child(2) { opacity: 0;}
body.menuOpen .menuIcon span:nth-child(3) { top: 28px; transform: rotate(-45deg);}
header .logo { transition: 0.3s ease; display: block; font-size: 1.5rem; font-weight: 700;}
body.scrolled header { padding: 20px 0px; background: var(--white); box-shadow: rgba(0, 0, 0, 0.25) 0px 0px 10px;}

/* Section */
section{ padding: 139px 0 0;}

/* Main Menu (full-screen overlay) */
.mainMenu { position: fixed; inset: 0; z-index: 999; background: var(--primary); opacity: 0; visibility: hidden; pointer-events: none; transition: opacity 0.3s ease, visibility 0.3s ease; overflow-y: auto; -webkit-overflow-scrolling: touch;}
body.menuOpen .mainMenu { opacity: 1; visibility: visible; pointer-events: auto;}
body.menuOpen.scrolled header { background: transparent; box-shadow: none;}
.mainMenu-inner { padding: 193px 0px 60px; min-height: 100vh;}
.mainMenu a { display: block; font-size: 2rem; color: var(--white); text-transform: uppercase; padding: 8px 0; transition: opacity 0.2s;}
.mainMenu a:hover { opacity: 0.7;}

/* Footer */
footer{background:var(--primary); color:var(--white); padding:50px 0; font-size: 1.3125rem;}
footer a{color:var(--white)}
footer .row{align-items:flex-start; gap:30px; flex-wrap:nowrap;}
.footLogo { flex: 0 0 253px; margin: 0px 60px 0px 0px; padding: 5px 0px 0px;}
.footLogoLink { display: block; font-size: 1.5rem; font-weight: 700;}
.footerMenu { flex: 0 0 203px;}
.footLinks { list-style: none;}
.footerMenu strong { font-size: 1.5rem; text-transform: uppercase; line-height: 1;}
.footLinks a {  font-size: 1.3125rem; line-height: 1;}
footer .content{ padding:0 30px;}
.footSocial { flex: 0 0 auto; text-align: left;}
.footRight { display: contents;}
.followLabel { font-size: 1.5rem; text-transform: uppercase; display: block; margin-bottom: 14px; line-height: 1;}
.socialIcons { display: flex; gap: 7px; justify-content: flex-start; margin-bottom: 0px;}
.socialIcons a{ display:block; width:41px; height:41px; background-repeat:no-repeat; background-size:contain; font-size:0; color:transparent;}
.iconInstagram{ background-image:url(img/icon-instagram.svg)}
.iconFacebook{ background-image:url(img/icon-facebook.svg)}
.copyright { font-size: 1.3125rem; margin-top: 6px;}

@media(min-width:768px){
	.showIphone{ display: none;}
}

/* Tablet */
@media(max-width:1299px){
	html{font-size: 14px;}
	.content{ width: 780px; padding: 0;}
	body{ min-width: 810px; }

	.showDesktop,
	.hideIpad{ display: none !important;}

	/* Header */
	header { padding: 40px 0px 0px;}
	header .menuIcon { left: 0;}

	/* Section */
	section { padding: 110px 0 0;}

	/* Footer */
	footer .row { flex-wrap: wrap !important;}
	.footLogo { flex: 0 0 100%; margin: 0px 0px 20px; text-align: center;}
	.footLogoLink { margin: 0px auto;}
	.footerMenu { flex: 1 1 0;}
	.footRight { display: flex; flex-direction: column; flex: 1 1 0;}

	/* Grid */
	.col-3, .col-4, .col-5 { flex: 0 0 calc(50% - 7.5px);}

	.footLinks a { font-size: 1.6rem;}
}

/* Phone */
@media(max-width:767px){
	.popupOverlay .popup{max-width: 300px;}
	html { font-size: 11px;}
	.content { width: 370px; padding:0;}
	body{ min-width: 390px; }

	/* Header */
	header { padding: 20px 0px 0px;}
	header .menuIcon { width: 50px; height: 50px;}
	header .menuIcon span { width: 24px; margin-left: -12px;}
	header .menuIcon span:nth-child(1) { top: 17px;}
	header .menuIcon span:nth-child(2) { top: 24px;}
	header .menuIcon span:nth-child(3) { top: 31px;}
	body.menuOpen .menuIcon span:nth-child(1) { top: 24px;}
	body.menuOpen .menuIcon span:nth-child(3) { top: 24px;}

	/* Main Menu */
	.mainMenu-inner { padding: 120px 0px 40px;}

	/* Section */
	section { padding: 90px 0 0;}

	/* Responsive BG */
	.rbg { background-image: var(--bg-phone);}

	/* Grid */
	[class*="col-"] { flex: 0 0 100%;}

	.footLogo { flex: 0 0 100%; text-align: center;}
	.footLogoLink { margin: 0 auto;}
	.footerMenu { flex: 1 1 calc(50% - 15px);}
	.footRight { align-items: center;}
	.socialIcons { justify-content: center;}
	#wpadminbar{ display: none !important;}
	body.admin-bar{ margin-top: -46px;}
	body.admin-bar header{ top: 0;}
	.hideIphone{ display: none !important;}
	.showIphone{ display: block !important;}
}