/* Minimal replacement CSS for this template.
   File: /Content/PatternSeven/home.css (or link to this file directly)
   Focus: basic layout + the "Read More" truncation + map sizing + footer readability.
*/

:root{
  --brand:#F4DDBA;
  --text:#111;
  --muted:#6b7280;
  --bg:#fff;
  --border:#e5e7eb;
}

*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
  margin:0;
  font-family: Lato, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--text);
  background:var(--bg);
  line-height:1.5;
}

a{ color:var(--brand); text-decoration:none; }
a:hover{ text-decoration:underline; }

.container{
  width:min(1100px, calc(100% - 32px));
  margin-inline:auto;
}

.section{ padding:48px 0; }
.section-sm{ padding:28px 0; }
.section-lg{ padding:64px 0; }
.section-md{ padding:48px 0; }
.section-xxs{ padding:12px 0; }

.bg-default{ background:#fff; }
.bg-gray-11{ background:#0b0b0b; color:#fff; }
.bg-gray-100{ background:#f5f5f5; }

/* Navbar basics (very light; your original template likely did more) */
.rd-navbar-wrap{ position:relative; z-index:20; }
.rd-navbar{
  border-bottom:1px solid var(--border);
  background:#fff;
}
.rd-navbar-brand a{ font-weight:900; letter-spacing:.2px; }
.rd-navbar-nav{
  list-style:none;
  display:flex;
  gap:18px;
  padding:0;
  margin:0;
  align-items:center;
}
.rd-nav-item{ display:block; }
.rd-nav-link{
  display:inline-block;
  padding:14px 10px;
  color:#111;
  font-weight:600;
}
.rd-nav-link:hover{ color:var(--brand); }

/* Swiper section: make slides visible even if the JS slider isn't loaded */
.swiper-container{ position:relative; overflow:hidden; }
.swiper-wrapper{ display:flex; }
.swiper-slide{ min-height:420px; flex:0 0 100%; position:relative; }
.slide-bg{
  position:absolute; inset:0;
  background-size:cover;
}

/* About text truncation */
.truncated{
  max-height: 7.5em; /* ~5 lines */
  overflow:hidden;
  position:relative;
}
.truncated::after{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:3.2em;
  background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
}
.full-message{
  max-height:none;
}
.full-message::after{ display:none; }

.button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 18px;
  border-radius:10px;
  border:1px solid var(--border);
  cursor:pointer;
  user-select:none;
  font-weight:700;
}
.button-lg{ padding:14px 22px; }
.button-gray-600{
  background:#111;
  color:#fff;
  border-color:#111;
}
.button-gray-600:hover{ filter:brightness(1.05); }
.review-button{
  background:var(--brand);
  border-color:var(--brand);
  color:#111;
}
.review-button:hover{ filter:brightness(0.98); }

/* Two-column section (map + form) */
.section-two-column{
  display:grid;
  grid-template-columns: minmax(280px, 1fr) minmax(320px, 1fr);
  gap:0;
  padding:0;
}
.section-block-aside.section-map{ min-height:420px; }
.section-two-column .section-md{ padding:48px 28px; }
@media (max-width: 900px){
  .section-two-column{ grid-template-columns:1fr; }
  .section-block-aside.section-map{ min-height:360px; }
}

/* Google map container */
.google-map,
.google-map_contacts,
#map{
  width:100%;
  height:100%;
  min-height:420px;
}

/* Form */
.form-wrap{ margin:14px 0; }
.form-input{
  width:100%;
  padding:12px 12px;
  border-radius:10px;
  border:1px solid var(--border);
  font-size:16px;
}
textarea.form-input{ min-height:110px; resize:vertical; }

/* Footer */
.footer{ border-top:1px solid var(--border); }
.footer-title{ font-weight:900; margin:0 0 10px; }
.footer .list, .footer-contact-info{
  list-style:none; padding:0; margin:0;
}
.footer .list li, .footer-contact-info li{ margin:10px 0; color:#111; }
.footer-modern{ background:#fff; }

.bottom-footer .business-name a{ font-weight:900; color:#111; }
.copy-right-privacy{ color:#111; }
.copy-right-privacy a{ color:var(--brand); }

/* Opening hours highlight */
.footer .list li.today{
  outline:2px solid var(--brand);
  outline-offset:4px;
  border-radius:10px;
  padding:6px 8px;
}

/* Small helpers used in markup */
.text-center{ text-align:center; }
.text-lg-left{ text-align:left; }
@media (max-width: 900px){
  .text-lg-left{ text-align:center; }
}