/*
Theme Name: Rea Timber Craft
Theme URI: https://reatimber.cogmultimedia.com/
Author: Cog Multimedia
Description: Lean custom theme for Rea Timber Craft Ltd, built from the approved static HTML/CSS. Native WordPress templates, self-hosted fonts, vanilla JS hero + gallery lightbox. No page builders.
Version: 1.0.0
License: Proprietary
Text Domain: reatimber
*/

/* ---------- Reset / base ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  font-family:"Lato",Arial,Helvetica,sans-serif;
  font-size:15px;
  line-height:1.8;
  color:#999999;
  background:#f5f5f5;
}
img{max-width:100%;height:auto;display:block;}
a{color:#111111;text-decoration:none;transition:color .2s;}
a:hover{color:#046ddd;}
h1,h2,h3,h4,h5,h6{
  font-family:"Montserrat",Arial,sans-serif;
  color:#002775;
  margin:0 0 .6em;
  line-height:1.3;
  font-weight:700;
}
h1{font-size:32px;}
h2{font-size:26px;}
h3{font-size:19px;}
h4{font-size:16px;}
h5{font-size:15px;letter-spacing:.5px;text-transform:uppercase;}
p{margin:0 0 1.2em;}
ul{margin:0 0 1.2em;padding-left:0;list-style:none;}
.wrap{max-width:1170px;margin:0 auto;padding:0 20px;}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);}

/* ---------- Buttons ---------- */
.btn{
  display:inline-block;
  font-family:"Montserrat",Arial,sans-serif;
  font-size:13px;
  font-weight:700;
  letter-spacing:1px;
  text-transform:uppercase;
  padding:14px 30px;
  border:2px solid #046ddd;
  background:#046ddd;
  color:#fff;
  cursor:pointer;
  transition:background .2s,color .2s,border-color .2s;
}
.btn:hover{background:#0357b0;border-color:#0357b0;color:#fff;}
.btn-outline{background:transparent;border-color:#fff;color:#fff;}
.btn-outline:hover{background:#046ddd;border-color:#046ddd;color:#fff;}
.btn-lg{padding:16px 38px;font-size:14px;}

/* ---------- Top dark bar ---------- */
.topbar{background:#1b273d;color:#fff;font-size:13px;}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;min-height:38px;}
.topbar a{color:#fff;}
.topbar a:hover{color:#046ddd;}
.topbar .tb-right span{margin-left:22px;display:inline-block;}
.topbar i{color:#046ddd;margin-right:6px;}

/* ---------- Header ---------- */
.site-header{background:#fff;}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:18px;padding-bottom:18px;gap:24px;}
.site-logo img{max-height:120px;width:auto;}
.header-contact{display:flex;gap:34px;font-size:15px;line-height:1.5;color:#777;}
.header-contact .hc{display:flex;align-items:center;gap:12px;}
.header-contact .hc svg{width:22px;height:22px;color:#046ddd;flex:none;box-sizing:content-box;
  padding:9px;border:2px solid #046ddd;border-radius:3px;background:#fff;}
.header-contact strong{display:block;color:#002775;font-family:"Montserrat",sans-serif;font-size:15px;}

/* ---------- Primary nav ---------- */
.navbar{background:transparent;}
.navbar .wrap{display:flex;align-items:center;justify-content:space-between;background:#0306a9;}
/* Float the nav bar over the hero/banner on every page so the image extends up behind it */
.navbar{position:absolute;left:0;right:0;z-index:30;}
.nav-menu{display:flex;margin:0;padding:0;list-style:none;}
.nav-menu li{position:relative;}
.nav-menu a{
  display:block;
  color:#dbdbdb;
  font-family:"Montserrat",Arial,sans-serif;
  font-size:12px;
  font-weight:700;
  letter-spacing:.6px;
  text-transform:uppercase;
  padding:12px 15px;
  border-left:1px solid rgba(255,255,255,.08);
}
.nav-menu li:last-child a{border-right:1px solid rgba(255,255,255,.08);}
.nav-menu a:hover,.nav-menu li.current-menu-item>a,.nav-menu li.current_page_item>a,.nav-menu a.active{background:transparent;color:#fff;box-shadow:inset 0 3px 0 #ffb600;}
.nav-search{color:#dbdbdb;padding:0 4px;display:flex;align-items:center;}
.nav-toggle{display:none;background:none;border:0;color:#fff;padding:12px 20px;cursor:pointer;}

/* ---------- Hero slider (home) ---------- */
.hero-slider{position:relative;overflow:hidden;background:#1b273d;}
.hero-slide{position:relative;min-height:560px;display:flex;align-items:center;
  background-size:cover;background-position:center;}
.hero-slide .wrap{position:relative;z-index:2;text-align:center;color:#fff;width:100%;
  text-shadow:0 2px 12px rgba(0,0,0,.55);}
.hero-eyebrow{font-family:"Montserrat",sans-serif;letter-spacing:3px;font-size:15px;font-weight:700;
  text-transform:uppercase;color:#fff;margin-bottom:14px;}
.hero-slide h2{color:#fff;font-size:46px;line-height:1.15;margin:0 0 10px;text-transform:uppercase;}
.hero-accent{color:#fff;display:block;}
.hero-slide .btn{margin-top:26px;}
/* Hero headline fade-in on load */
.hero-slide h2{opacity:0;transform:translateY(14px);animation:rtcHeroFade 1.1s ease-out .25s forwards;}
@keyframes rtcHeroFade{to{opacity:1;transform:translateY(0);}}
@media (prefers-reduced-motion:reduce){.hero-slide h2{opacity:1;transform:none;animation:none;}}

/* ---------- Intro band ---------- */
.intro-band{background:#0306a9;color:#fff;padding:0;}
.intro-band .wrap{display:flex;align-items:stretch;justify-content:space-between;gap:40px;flex-wrap:wrap;}
.intro-band h3{color:#fff;font-size:19px;text-align:left;max-width:760px;margin:0;line-height:1.4;
  align-self:center;padding:22px 0;}
/* Get a Quote: navy fill with an angled (slanted) left edge, full band height */
.intro-band .btn{flex:none;}
.intro-band .btn-outline{background:#00027A;border:0;color:#fff;
  display:flex;align-items:center;justify-content:center;padding:0 64px 0 80px;
  clip-path:polygon(22px 0, 100% 0, 100% 100%, 0 100%);}
.intro-band .btn-outline:hover{background:#0453c4;color:#fff;}

/* ---------- Page banner (inner pages) ---------- */
.page-banner{position:relative;background-size:cover;background-position:center;
  text-align:center;padding:130px 0;}
.page-banner::after{content:"";position:absolute;inset:0;background:rgba(10,18,35,.5);}
.page-banner .wrap{position:relative;z-index:2;}
.page-banner h1{color:#fff;font-size:38px;margin:0;}

/* ---------- Content sections ---------- */
.section{padding:70px 0;}
.section.alt{background:#fff;}
.section-head{text-align:center;max-width:780px;margin:0 auto 46px;}
.section-head h2{margin-bottom:12px;}
.section-head .sub{font-family:"Montserrat",sans-serif;text-transform:uppercase;letter-spacing:2px;
  font-size:13px;color:#046ddd;font-weight:700;margin-bottom:10px;}

/* two-column feature rows */
.feature{display:flex;align-items:center;gap:50px;}
.feature + .feature{margin-top:64px;}
.feature .col{flex:1 1 0;min-width:0;}
.feature.reverse{flex-direction:row-reverse;}
.feature .f-sub{font-family:"Montserrat",sans-serif;text-transform:uppercase;letter-spacing:1.5px;
  font-size:12px;color:#999;font-weight:700;margin-bottom:8px;}
.feature img{width:100%;border-radius:2px;box-shadow:0 14px 34px rgba(0,0,0,.14);}
.feature h3{margin-top:0;}

/* bullet lists */
.ticks li{position:relative;padding-left:26px;margin-bottom:9px;}
.ticks li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;
  background:#046ddd;border-radius:50%;}

/* ---------- Product category grid ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;}
.cat-card{background:#fff;border:1px solid #e6e6e6;overflow:hidden;transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column;}
.cat-card:hover{transform:translateY(-5px);box-shadow:0 16px 34px rgba(0,0,0,.12);}
.cat-card .thumb{overflow:hidden;background:#eee;}
.cat-card .thumb img{width:100%;height:auto;display:block;}

/* ---------- Gallery grid ---------- */
.gallery-grid{columns:4;column-gap:14px;}
.gallery-grid a{display:block;margin:0 0 14px;overflow:hidden;break-inside:avoid;}
.gallery-grid img{width:100%;transition:transform .35s,filter .35s;filter:brightness(.97);}
.gallery-grid a:hover img{transform:scale(1.05);filter:brightness(1.08);}

/* ---------- Editable gallery (native Gallery block → masonry) ----------
   The native block ships with is-layout-flex / is-cropped core rules; we
   override them (!important) to turn the block into a CSS multi-column
   masonry that matches the original hand-built gallery. */
.rtc-gallery-wrap .wp-block-gallery,
.wp-block-gallery.rtc-gallery{display:block !important;columns:4;column-gap:14px;gap:0 !important;margin:0;max-width:100%;}
.rtc-gallery-wrap .wp-block-gallery figure.wp-block-image,
.wp-block-gallery.rtc-gallery figure.wp-block-image{display:block !important;width:100% !important;max-width:100% !important;margin:0 0 14px !important;overflow:hidden;break-inside:avoid;}
.rtc-gallery-wrap figure.wp-block-image img,
.wp-block-gallery.rtc-gallery figure.wp-block-image img{width:100% !important;height:auto !important;max-width:100% !important;display:block;transition:transform .35s,filter .35s;filter:brightness(.97);}
.rtc-gallery-wrap a{display:block;}
.rtc-gallery-wrap a:hover img{transform:scale(1.05);filter:brightness(1.08);}
.rtc-gallery-wrap figcaption,
.wp-block-gallery.rtc-gallery figcaption{display:none;}

/* ---------- Product body (native Media & Text rows) ---------- */
.product-body .wp-block-media-text{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px;margin:0 0 64px;}
.product-body .wp-block-media-text:last-child{margin-bottom:0;}
.product-body .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content{grid-column:1;grid-row:1;}
.product-body .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media{grid-column:2;grid-row:1;}
.product-body .wp-block-media-text__media img{width:100%;height:auto;border-radius:2px;box-shadow:0 14px 34px rgba(0,0,0,.14);}
.product-body .wp-block-media-text__content{padding:0;}
.product-body h3{margin-top:0;}
.product-body ul{list-style:none;margin:0 0 16px;padding:0;}
.product-body ul li{position:relative;padding-left:26px;margin-bottom:9px;}
.product-body ul li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:9px;border-radius:50%;background:#046ddd;}

/* ---------- Contact ---------- */
.contact-intro{text-align:center;max-width:760px;margin:0 auto 40px;}
.contact-form{max-width:820px;margin:0 auto;}
.cf-row{display:flex;gap:20px;}
.cf-row .cf-field{flex:1;}
.cf-field{margin-bottom:20px;}
.cf-field input,.cf-field textarea{
  width:100%;font-family:"Lato",sans-serif;font-size:15px;color:#555;
  padding:14px 16px;border:1px solid #d9d9d9;background:#fff;border-radius:2px;
}
.cf-field input:focus,.cf-field textarea:focus{outline:none;border-color:#046ddd;}
.contact-form .btn{border:0;}
.contact-cols{display:flex;gap:40px;margin-top:60px;}
.contact-cols .col{flex:1;}
.contact-cols iframe{width:100%;height:320px;border:0;}
.hours-list{list-style:none;}
.hours-list li{display:flex;justify-content:space-between;border-bottom:1px solid #e6e6e6;
  padding:11px 0;color:#666;}
.hours-list li span:last-child{color:#002775;font-weight:700;}

/* ---------- Contact Form 7 (styled to match the static form) ---------- */
.contact-form .wpcf7-form p{margin:0;}
.contact-form input.wpcf7-form-control,
.contact-form textarea.wpcf7-form-control{
  width:100%;font-family:"Lato",sans-serif;font-size:15px;color:#555;
  padding:14px 16px;border:1px solid #d9d9d9;background:#fff;border-radius:2px;margin-bottom:0;
}
.contact-form input.wpcf7-form-control:focus,
.contact-form textarea.wpcf7-form-control:focus{outline:none;border-color:#046ddd;}
.contact-form input.wpcf7-submit{
  width:auto;font-family:"Montserrat",Arial,sans-serif;font-size:14px;font-weight:700;
  letter-spacing:1px;text-transform:uppercase;padding:16px 38px;border:0;background:#046ddd;color:#fff;cursor:pointer;
}
.contact-form input.wpcf7-submit:hover{background:#0357b0;}
.contact-form .wpcf7-not-valid-tip{color:#c0392b;font-size:13px;margin-top:5px;}
.contact-form .wpcf7-response-output{margin:18px 0 0;padding:12px 16px;font-size:14px;}
.wpcf7 .wpcf7-spinner{margin-top:14px;}

/* ---------- Footer ---------- */
.site-footer{background:#1B273D;color:#888;padding:60px 0 40px;font-size:14px;}
.footer-cols{display:flex;gap:46px;flex-wrap:wrap;}
.footer-cols .col{flex:1;min-width:220px;}
.site-footer h4{color:#fff;font-size:16px;text-transform:uppercase;letter-spacing:1px;margin-bottom:22px;}
.site-footer a{color:#BABFC5;}
.site-footer a:hover{color:#2d95e5;}
.footer-logo{max-width:200px;margin-bottom:18px;}
.footer-menu{list-style:none;margin:0;padding:0;}
.footer-menu li{padding:6px 0;border-bottom:1px solid rgba(255,255,255,.06);}
.footer-contact{list-style:none;margin:0;padding:0;}
.footer-contact li{display:flex;gap:12px;margin-bottom:14px;line-height:1.5;}
.footer-contact svg{color:#046ddd;margin-top:4px;flex:none;}
.copyright{background:#09162d;color:#cfd4da;text-align:center;padding:16px 0;font-size:13px;}

/* ---------- Back-to-top ---------- */
.to-top{position:fixed;right:20px;bottom:20px;width:42px;height:42px;background:#046ddd;color:#fff;
  display:none;align-items:center;justify-content:center;border-radius:3px;z-index:50;cursor:pointer;
  font-size:20px;line-height:1;}
.to-top.show{display:flex;}

/* ---------- Lightbox ---------- */
.lb-overlay{position:fixed;inset:0;background:rgba(8,14,26,.92);display:none;align-items:center;
  justify-content:center;z-index:200;}
.lb-overlay.open{display:flex;}
.lb-img{max-width:88vw;max-height:86vh;box-shadow:0 10px 50px rgba(0,0,0,.5);}
.lb-close{position:absolute;top:18px;right:26px;background:none;border:0;color:#fff;font-size:40px;
  line-height:1;cursor:pointer;}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.12);
  border:0;color:#fff;font-size:34px;width:54px;height:72px;cursor:pointer;}
.lb-prev{left:16px;}.lb-next{right:16px;}
.lb-nav:hover{background:#046ddd;}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .gallery-grid{columns:3;}
  .rtc-gallery-wrap .wp-block-gallery,
  .wp-block-gallery.rtc-gallery{columns:3;}
  .feature{gap:34px;}
  .product-body .wp-block-media-text{gap:34px;}
}
@media(max-width:768px){
  .header-contact{display:none;}
  .nav-toggle{display:block;}
  .nav-menu{display:none;position:absolute;left:0;right:0;top:100%;background:#0306a9;flex-direction:column;z-index:40;}
  .nav-menu.open{display:flex;}
  .navbar{position:relative;}
  .nav-menu a{border-left:0;border-top:1px solid rgba(255,255,255,.08);}
  .nav-search{display:none;}
  .feature,.feature.reverse{flex-direction:column;}
  .contact-cols,.cf-row{flex-direction:column;gap:0;}
  .contact-cols{gap:40px;}
  .hero-slide h2{font-size:32px;}
  .page-banner{padding:90px 0;}
  .page-banner h1{font-size:28px;}
  .cat-grid{grid-template-columns:1fr;}
  .gallery-grid{columns:2;}
  .rtc-gallery-wrap .wp-block-gallery,
  .wp-block-gallery.rtc-gallery{columns:2;}
  .product-body .wp-block-media-text,
  .product-body .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content,
  .product-body .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media{grid-template-columns:1fr;grid-column:1;}
  .product-body .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media{grid-row:auto;}
  .topbar{display:none;}
}