/** Shopify CDN: Minification failed

Line 113:10 Unexpected "{"
Line 113:19 Expected ":"

**/

:root{
  --text:#000;
  --muted:#333;
  --bg:#fff;
  --card-radius:12px;
  --button-radius:10px;
}

*,
*::before,
*::after{ box-sizing:border-box; }

html, body{
  margin:0;
  padding:0;
  background:var(--bg);
  color:var(--text);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
  line-height:1.45;
  -webkit-text-size-adjust:100%;
}

img{ max-width:100%; height:auto; display:block; }

/* Container */
.container{
  max-width: 1200px;
  margin: 0 auto;
  padding: clamp(16px, 3vw, 32px);
}

/* Header */
.header{
  text-align:center;
  margin-bottom: clamp(20px, 4vw, 36px);
}

.header .logo{
  max-width: clamp(120px, 20vw, 200px);
  margin: 0 auto 12px;
}

h1{
  font-size: clamp(22px, 4.5vw, 40px);
  margin: 0 0 6px;
}

p{
  font-size: clamp(14px, 2.7vw, 18px);
  color: var(--muted);
  margin: 0.25rem 0 0;
}

/* Links */
a{
  color: inherit;
  text-decoration: underline; /* better a11y */
  text-underline-offset: 3px;
}
a:hover{ text-decoration: none; }
a:focus-visible{
  outline: 3px solid #000;
  outline-offset: 2px;
  border-radius: 6px;
}

/* Hero */
.hero img{
  width: 100%;
  height: clamp(220px, 45vh, 520px);
  object-fit: cover;
  border-radius: var(--card-radius);
  margin-bottom: clamp(16px, 3vw, 24px);
}

/* Section headings */
.info h2,
.gallery-preview h2{
  font-size: clamp(18px, 3.5vw, 24px);
  margin: 16px 0 12px;
}

/* Photo grid */
.photo-grid{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: clamp(10px, 2.5vw, 16px);
}

.photo-grid img{
  width: 100%;
  aspect-ratio: 4 / 3;        /* consistent tiles */
  object-fit: cover;
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

/* Ensure up to 6 columns on large screens */
@media (min-width: 1280px){
  .photo-grid{
    grid-template-columns: repeat(4, 1fr);
  }
}

/* The intrinsic width/height won’t force giant rendering because we cap it */
.section-{{ section.id }} .preview-modal img{
  max-width: 90%;
  max-height: 90vh;
  width: auto;
  height: auto;
  border-radius: 10px;
}

/* CTA buttons */
.cta{
  margin-top: clamp(20px, 5vw, 40px);
  display: grid;
  gap: 12px;
}

/* Mobile: full-width buttons, comfy tap targets */
.cta-button{
  display: inline-block;
  width: 100%;
  text-align: center;
  background: #000;
  color: #fff;
  padding: 14px 16px;
  text-decoration: none;
  font-weight: 700;
  border-radius: var(--button-radius);
  letter-spacing: 0.2px;
  transition: transform .08s ease;
}
.cta-button:hover{ transform: translateY(-1px); }
.cta-button:active{ transform: translateY(0); }
.cta-button:focus-visible{
  outline: 3px solid #222;
  outline-offset: 3px;
}

/* Tablet/Desktop: lay buttons out in a row */
@media (min-width: 700px){
  .cta{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Footer */
.footer{
  margin-top: clamp(20px, 5vw, 44px);
  text-align:center;
  font-size: 0.95rem;
  color: #666;
}
.footer img{
  margin: 0 auto;
  width: clamp(400px, 20vw, 180px);
}

/* Motion preference */
@media (prefers-reduced-motion: reduce){
  *{ animation: none !important; transition: none !important; }
}
