/*
Theme Name: Monografia Minimal v1.0.7
Theme URI: https://monografia.co.uk/
Author: Monografia
Description: Minimal private landing theme for Monografia. Clean controlled header, no default footer clutter.
Version: 1.0.7
License: Private
Text Domain: monografia-minimal-v107
*/

:root {
  --mono-bg: #120D07;
  --mono-gold: #B58759;
  --mono-text: #D8CCB8;
  --mono-soft: #BFAE96;
  --mono-header-h: 72px;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--mono-bg); color: var(--mono-text); }
body { font-family: Georgia, "Times New Roman", serif; overflow-x: hidden; }
img { max-width: 100%; height: auto; }
a { color: inherit; }

/* Header */
.mono-menu-toggle { display: none !important; }

.mono-header {
  width: 100% !important;
  height: var(--mono-header-h) !important;
  background: var(--mono-bg) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  z-index: 1000 !important;
}

.mono-header-inner {
  width: min(640px, calc(100vw - 56px)) !important;
  height: var(--mono-header-h) !important;
  display: grid !important;
  grid-template-columns: 64px minmax(0, 1fr) 64px !important;
  align-items: center !important;
  gap: 0 !important;
}

.mono-tree-mark {
  grid-column: 1 !important;
  justify-self: start !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  pointer-events: none !important;
}

.mono-tree-mark img {
  height: 40px !important;
  width: auto !important;
  display: block !important;
}

.mono-header-message {
  grid-column: 2 !important;
  justify-self: center !important;
  text-align: center !important;
  color: var(--mono-text) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(14px, 1.25vw, 16px) !important;
  font-weight: 300 !important;
  letter-spacing: 0.065em !important;
  line-height: 1.15 !important;
  opacity: 0.94 !important;
  white-space: nowrap !important;
  display: block !important;
  max-width: 100% !important;
  overflow: visible !important;
}

.mono-menu-wrap {
  grid-column: 3 !important;
  position: relative !important;
  justify-self: end !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
}

.mono-menu-button {
  width: 34px !important;
  height: 24px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  cursor: pointer !important;
}

.mono-menu-button span {
  display: block !important;
  width: 34px !important;
  height: 1.5px !important;
  background: var(--mono-gold) !important;
}

.mono-menu-dropdown {
  position: absolute !important;
  top: calc(100% + 16px) !important;
  right: 0 !important;
  width: 260px !important;
  padding: 18px 0 !important;
  background: rgba(18, 13, 7, 0.985) !important;
  border: 1px solid rgba(181, 135, 89, 0.32) !important;
  box-shadow: 0 18px 40px rgba(0, 0, 0, 0.34) !important;
  display: none !important;
  flex-direction: column !important;
  align-items: stretch !important;
  z-index: 3000 !important;
}

.mono-menu-toggle:checked ~ .mono-header .mono-menu-dropdown { display: flex !important; }


/* Dropdown menu - restored v1.0.5 spacing/design, now using editable WP menu */
.mono-menu-dropdown ul,
.mono-menu-dropdown .mono-menu-list,
.mono-menu-dropdown .mono-default-menu {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0 !important;
}

.mono-menu-dropdown li,
.mono-menu-dropdown .menu-item {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  display: block !important;
}

.mono-menu-dropdown a {
  color: var(--mono-text) !important;
  text-decoration: none !important;
  font-size: 16px !important;
  font-weight: 300 !important;
  letter-spacing: 0.055em !important;
  line-height: 1.2 !important;
  padding: 13px 22px !important;
  white-space: nowrap !important;
  display: block !important;
  width: 100% !important;
}

.mono-menu-dropdown a:hover {
  color: var(--mono-gold) !important;
  background: rgba(181, 135, 89, 0.08) !important;
}

/* Homepage carousel */
.mono-home-carousel {
  position: relative;
  width: 100%;
  height: calc(100svh - var(--mono-header-h));
  min-height: calc(100svh - var(--mono-header-h));
  overflow: hidden;
  background: var(--mono-bg);
}

.mono-home-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  z-index: 1;
  background: var(--mono-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8px 0 12px;
  pointer-events: none;
  transition: opacity 1.4s ease-in-out;
}

.mono-home-slide.is-active { opacity: 1; z-index: 2; pointer-events: auto; }

.mono-home-card {
  position: relative;
  height: 100%;
  max-height: 100%;
  max-width: 100vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.mono-home-card img {
  height: 100%;
  width: auto;
  max-height: 100%;
  max-width: 100vw;
  object-fit: contain;
  display: block;
  border-radius: 22px;
  box-shadow: 0 18px 55px rgba(0, 0, 0, 0.34);
}

.mono-cta-hotspot {
  position: absolute;
  left: 18.6%;
  bottom: 16.9%;
  width: 62.8%;
  height: 12.2%;
  z-index: 100;
  display: block;
  cursor: pointer;
  background: transparent;
  border: 0;
  outline: 0;
}

/* Standard pages */
.mono-page {
  min-height: calc(100svh - var(--mono-header-h));
  background: var(--mono-bg);
  color: var(--mono-text);
  padding: 54px 24px 90px;
}
.mono-page-inner { width: min(860px, 100%); margin: 0 auto; }
.mono-page h1, .mono-page h2, .mono-page h3 { color: var(--mono-text); font-weight: 400; line-height: 1.15; }
.mono-page h1 { font-size: clamp(38px, 5vw, 72px); text-align: center; margin: 0 0 44px; }
.mono-page p, .mono-page li, .mono-page label { color: var(--mono-text); font-size: 18px; line-height: 1.65; }
.mono-page a { color: var(--mono-gold); }
.mono-page input, .mono-page textarea, .mono-page select {
  background: #f7f2e8; color: #120D07; border: 1px solid rgba(181, 135, 89, 0.35); border-radius: 12px; padding: 12px 14px; font-size: 16px;
}
.mono-page button, .mono-page input[type="submit"], .wpforms-submit {
  background: var(--mono-gold) !important; color: #120D07 !important; border: 0 !important; border-radius: 999px !important; padding: 14px 30px !important; font-family: Georgia, "Times New Roman", serif !important; font-size: 17px !important; cursor: pointer !important;
}

/* Logged in WordPress admin bar */
body.admin-bar .mono-header { top: 0; }

@media screen and (max-width: 900px) {
  :root { --mono-header-h: 70px; }

  .mono-header-inner {
    width: calc(100vw - 28px) !important;
    grid-template-columns: 38px minmax(0, 1fr) 38px !important;
  }

  .mono-tree-mark img { height: 28px !important; }

  .mono-header-message {
    display: block !important;
    font-size: clamp(9.4px, 2.95vw, 14.5px) !important;
    letter-spacing: clamp(0em, 0.03vw, 0.018em) !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
    max-width: 100% !important;
    overflow: visible !important;
    opacity: 0.94 !important;
  }

  .mono-menu-button { width: 27px !important; height: 19px !important; }
  .mono-menu-button span { width: 27px !important; height: 1.5px !important; }

  .mono-menu-dropdown {
    top: calc(100% + 12px) !important;
    right: 0 !important;
    width: min(260px, calc(100vw - 32px)) !important;
    padding: 16px 0 !important;
  }

  .mono-menu-dropdown a { font-size: 16px !important; padding: 13px 20px !important; }
  .mono-home-slide { padding: 8px 0 12px; }
  .mono-home-card img { border-radius: 18px; }
  .mono-cta-hotspot { left: 18.6%; bottom: 16.9%; width: 62.8%; height: 12.2%; }
  .mono-page { padding: 38px 20px 70px; }
}

@media screen and (max-width: 900px) and (orientation: landscape) {
  .mono-header-message {
    font-size: clamp(12px, 1.7vw, 15px) !important;
    letter-spacing: 0.04em !important;
  }
}

@media screen and (max-width: 360px) {
  .mono-header-inner {
    width: calc(100vw - 24px) !important;
    grid-template-columns: 34px minmax(0, 1fr) 34px !important;
  }
  .mono-tree-mark img { height: 26px !important; }
  .mono-menu-button { width: 25px !important; height: 18px !important; }
  .mono-menu-button span { width: 25px !important; }
  .mono-header-message {
    font-size: clamp(8.8px, 2.82vw, 10px) !important;
    letter-spacing: 0 !important;
  }
}
