/* site.css — styles for the parts of the page that site.js builds from the admin settings.
   Colors/fonts use the same --mk-* variables as the rest of the site (defaults = the current look). */

/* ── Announcement bar (moved here from index.html so every page can show it) ── */
#announcementBar{display:none;background:var(--mk-d,#2d5a0e);color:#fff;text-align:center;padding:11px 16px;
  font-family:var(--mk-font-u,'Josefin Sans'),sans-serif;font-size:13px;letter-spacing:.06em;
  position:fixed;top:0;left:0;right:0;z-index:1030;line-height:1.5}
#announcementBar.announce-flow{position:relative;z-index:1100}
#announcementBar .announce-inner{display:inline-flex;align-items:center;flex-wrap:wrap;justify-content:center;gap:6px 10px;max-width:700px}
#announcementBar .announce-emoji{font-size:15px;flex-shrink:0}
#announcementBar .announce-text{font-weight:400;opacity:.92}
#announcementBar .announce-text strong{font-weight:700}
#announcementBar .announce-text a{color:inherit;text-decoration:underline}
#announcementBar .announce-cta{display:inline-flex;align-items:center;gap:5px;background:var(--mk-a,#c8e66b);color:var(--mk-d2,#1a3a06);
  font-family:var(--mk-font-u,'Josefin Sans'),sans-serif;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  text-decoration:none;padding:5px 14px;border-radius:20px;white-space:nowrap;transition:background .2s,transform .15s;flex-shrink:0}
#announcementBar .announce-cta:hover{background:var(--mk-a2,#daf07e);transform:translateY(-1px);color:var(--mk-d2,#1a3a06);text-decoration:none}
@media(max-width:576px){#announcementBar{font-size:12px;padding:10px 12px}#announcementBar .announce-cta{font-size:10px;padding:5px 12px}}

/* ── Hero extras ── */
.mk-hero-sub{font-family:var(--mk-font-b,'EB Garamond'),Georgia,serif;font-size:clamp(1.05rem,2.2vw,1.5rem);color:#fff;margin:14px 0 0;text-shadow:0 1px 10px rgba(0,0,0,.35)}
.mk-hero-cta{display:inline-block;margin-top:22px;padding:13px 34px;border-radius:50px;background:var(--mk-p,#6aaa2e);color:#fff;
  font-family:var(--mk-font-u,'Josefin Sans'),sans-serif;font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;text-decoration:none;
  box-shadow:0 6px 22px rgba(0,0,0,.25);transition:background .25s,transform .2s}
.mk-hero-cta:hover{background:var(--mk-p2,#4a8820);color:#fff;text-decoration:none;transform:translateY(-2px)}

/* ── About ── */
.mk-about-p{margin:0 0 1em}
.mk-about-p:last-child{margin-bottom:0}
.mk-about-img{text-align:center;margin-top:28px}
.mk-about-img img{display:inline-block;width:auto;height:auto;max-width:100%;max-height:480px;object-fit:contain;border-radius:14px;box-shadow:0 8px 30px color-mix(in srgb,var(--mk-text,#2a4a0e) 18%,transparent)}

/* ── Reviews ── */
.mk-reviews-title{font-family:var(--mk-font-h,'Oleo Script'),cursive;text-align:center;color:var(--mk-d,#2d5a0e);margin:0 0 18px;font-size:clamp(1.6rem,3.5vw,2.4rem)}

/* ── Contact form ── */
#mk-contact-form .mk-hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
#mk-contact-form .mk-msg{padding:12px 16px;border-radius:8px;margin-bottom:16px;font-size:15px}
#mk-contact-form .mk-msg.ok{background:#e6f4d7;color:#2d5a0e;border:1px solid #b5d96e}
#mk-contact-form .mk-msg.err{background:#fde8e8;color:#8a1c1c;border:1px solid #f0b4b4}
#mk-contact-form button[disabled]{opacity:.65;cursor:wait}

/* ── Social icons ── */
.mk-social-row{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin-top:16px}
.mk-social{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:50%;
  border:1.5px solid color-mix(in srgb,#fff 55%,transparent);color:#fff;font-size:17px;text-decoration:none;transition:background .2s,color .2s,transform .2s}
.mk-social:hover{background:var(--mk-a,#c8e66b);border-color:var(--mk-a,#c8e66b);color:var(--mk-d2,#1a3a06);transform:translateY(-2px);text-decoration:none}
.jnl-footer .mk-social-row{margin-top:12px}

/* Section headings that the original page showed in capitals */
#content1-m .mk-section-title, #gallery2-17 .mk-section-title { text-transform: uppercase; }

/* The theme fades the whole hero caption to 30%. Keep that look for the headline only,
   so the optional subtitle and button added from the admin stay fully readable and clickable. */
.blk-hero .carousel-caption { opacity: 1; }
.blk-hero .carousel-caption h1,
.blk-hero .carousel-caption h2 { opacity: .3; }
.blk-hero .carousel-caption .mk-hero-sub,
.blk-hero .carousel-caption .mk-hero-cta { position: relative; z-index: 2; }

.jnl-brand span{white-space:nowrap}

/* contact details cards */
.mk-info-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:18px}
@media (max-width:575px){.mk-info-grid{grid-template-columns:1fr}}
.mk-info-card{display:flex;align-items:center;gap:14px;padding:16px 18px;background:#fff;border:1px solid color-mix(in srgb,var(--mk-p,#6aaa2e) 22%,transparent);border-radius:14px;box-shadow:0 4px 18px color-mix(in srgb,var(--mk-text,#2a4a0e) 8%,transparent);text-align:left}
.mk-info-ico{flex:0 0 44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--mk-p,#6aaa2e) 16%,#fff);color:var(--mk-p2,#4a8820)}
.mk-info-label{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mk-p2,#4a8820);font-weight:700;margin-bottom:2px}
.mk-info-val{color:var(--mk-text,#2a4a0e);font-size:1.05rem;line-height:1.35;overflow-wrap:anywhere}
.mk-info-val a{color:inherit;text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--mk-p,#6aaa2e) 55%,transparent)}
.mk-info-val a:hover,.mk-info-val a:focus{color:var(--mk-p2,#4a8820)}

/* footer links stay readable after click / focus / visit */
.blk-footer a.text-primary,.blk-footer a.text-primary:visited{color:var(--mk-pl2,#c5e880) !important}
.blk-footer a.text-primary:hover,.blk-footer a.text-primary:focus,.blk-footer a.text-primary:active,.blk-footer a.text-primary.active{color:#fff !important;outline:none}
.blk-footer a.text-primary:focus-visible{outline:2px solid #fff;outline-offset:3px}

/* gallery heading position */
.mk-gal{display:flex;flex-direction:column;gap:26px}
.mk-gal-head{text-align:center}
.mk-gal-sub{margin:0 auto;max-width:640px;opacity:.85}
.mk-gal-bottom .mk-gal-head{order:2}
.mk-gal-grid{margin:0 -12px}
@media (min-width:992px){
  .mk-gal-left,.mk-gal-right{flex-direction:row;align-items:flex-start;gap:36px}
  .mk-gal-left .mk-gal-head,.mk-gal-right .mk-gal-head{flex:0 0 28%;position:sticky;top:110px;text-align:left}
  .mk-gal-left .mk-gal-sub,.mk-gal-right .mk-gal-sub{margin:0}
  .mk-gal-left .mk-gal-grid,.mk-gal-right .mk-gal-grid{flex:1;min-width:0}
  .mk-gal-right .mk-gal-head{order:2}
}

/* rotated gallery photos */
.mk-rot{display:block;position:relative;width:100%;overflow:hidden;container-type:inline-size;aspect-ratio:var(--ar,1)}
.mk-rot>img{position:absolute !important;top:50%;left:50%;max-width:none !important;object-fit:fill !important;transition:none !important;
  width:calc(100cqw / var(--ar,1)) !important;height:100cqw !important}
.mk-rot>img.mk-rot-90{transform:translate(-50%,-50%) rotate(90deg)}
.mk-rot>img.mk-rot-270{transform:translate(-50%,-50%) rotate(270deg)}
img.mk-rot-180{transform:rotate(180deg)}
