/* Dynamic template collections */
.template-collection { position:relative; min-width:0; }
.template-collection--muted { background:var(--bg); }
.template-collection--brand_soft { background:var(--brand-soft); }
.template-collection--surface .template-collection__inner { padding:clamp(20px,4vw,38px); border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); box-shadow:var(--shadow); }
.template-collection__heading { margin-bottom:24px; }
.template-collection__items { display:grid; grid-template-columns:repeat(var(--collection-columns-desktop,3),minmax(0,1fr)); gap:18px; min-width:0; }
.template-collection--list .template-collection__items { grid-template-columns:minmax(0,1fr); }
.template-collection--list .item-card { display:grid; grid-template-columns:minmax(180px,.38fr) minmax(0,1fr); }
.template-collection--list .item-card .media-frame { min-height:100%; }
.template-collection--featured .item-card:first-child { grid-column:span 2; }
.template-collection--featured .item-card:first-child .media-frame { aspect-ratio:16/8; }
.template-collection--compact .template-collection__items { gap:11px; }
.template-collection--compact .item-card .card-body { padding:15px; }
.template-collection--compact .item-card .media-frame { aspect-ratio:16/8; }

/* Advanced typography. Template CSS remains able to override these rules. */
body { font-family:var(--type-body-font,var(--font-family)); font-size:var(--type-body-size,16px); font-weight:var(--type-body-weight,400); line-height:var(--type-body-line,1.8); letter-spacing:var(--type-body-spacing,0); }
.site-shell h1,.editable-template h1 { font-family:var(--type-h1-font,var(--font-family)); font-size:var(--type-h1-size,48px); font-weight:var(--type-h1-weight,800); line-height:var(--type-h1-line,1.2); letter-spacing:var(--type-h1-spacing,0); }
.site-shell h2,.editable-template h2 { font-family:var(--type-h2-font,var(--font-family)); font-size:var(--type-h2-size,34px); font-weight:var(--type-h2-weight,800); line-height:var(--type-h2-line,1.3); letter-spacing:var(--type-h2-spacing,0); }
.site-shell h3,.editable-template h3 { font-family:var(--type-h3-font,var(--font-family)); font-size:var(--type-h3-size,21px); font-weight:var(--type-h3-weight,700); line-height:var(--type-h3-line,1.45); letter-spacing:var(--type-h3-spacing,0); }
.site-shell main p,.site-shell main li,.editable-template p { font-family:var(--type-paragraph-font,var(--font-family)); font-size:var(--type-paragraph-size,16px); font-weight:var(--type-paragraph-weight,400); line-height:var(--type-paragraph-line,1.9); letter-spacing:var(--type-paragraph-spacing,0); }
.site-shell small,.site-shell .card-meta,.site-shell .page-meta { font-family:var(--type-small-font,var(--font-family)); font-size:var(--type-small-size,13px); font-weight:var(--type-small-weight,400); line-height:var(--type-small-line,1.6); letter-spacing:var(--type-small-spacing,0); }
.site-shell button,.site-shell .primary-button,.site-shell .secondary-button,.site-shell .text-link { font-family:var(--type-button-font,var(--font-family)); font-size:var(--type-button-size,14px); font-weight:var(--type-button-weight,700); line-height:var(--type-button-line,1.4); letter-spacing:var(--type-button-spacing,0); }

@media (max-width:900px) {
  .template-collection__items { grid-template-columns:repeat(var(--collection-columns-tablet,2),minmax(0,1fr)); }
}
@media (max-width:680px) {
  .template-collection__items { grid-template-columns:repeat(var(--collection-columns-mobile,1),minmax(0,1fr)); }
  .template-collection--featured .item-card:first-child { grid-column:auto; }
  .template-collection--list .item-card { grid-template-columns:minmax(0,1fr); }
  .site-shell h1,.editable-template h1 { font-size:var(--type-h1-size-mobile,34px); }
  .site-shell h2,.editable-template h2 { font-size:var(--type-h2-size-mobile,28px); }
  .site-shell h3,.editable-template h3 { font-size:var(--type-h3-size-mobile,19px); }
  .site-shell main p,.site-shell main li,.editable-template p { font-size:var(--type-paragraph-size-mobile,16px); }
  .site-shell small,.site-shell .card-meta,.site-shell .page-meta { font-size:var(--type-small-size-mobile,12px); }
  .site-shell button,.site-shell .primary-button,.site-shell .secondary-button,.site-shell .text-link { font-size:var(--type-button-size-mobile,14px); }
  body { font-size:var(--type-body-size-mobile,16px); }
}

/* Google Maps and location cards */
.site-map-component { display:grid; gap:20px; min-width:0; }
.site-map-component__canvas { position:relative; min-height:var(--map-height,420px); overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:var(--brand-soft); box-shadow:var(--shadow); }
.site-map-component iframe,.interactive-google-map { display:block; width:100%; height:var(--map-height,420px); min-height:240px; border:0; }
.map-consent { position:absolute; inset:0; z-index:2; display:grid; place-content:center; justify-items:center; gap:14px; padding:28px; text-align:center; background:linear-gradient(135deg,var(--brand-soft),var(--surface)); }
.site-map-locations { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr)); gap:14px; }
.site-map-location { display:grid; gap:10px; min-width:0; padding:18px; border:1px solid var(--line); border-radius:var(--radius); background:var(--surface); }
.site-map-location.is-primary { border-color:var(--brand); }
.site-map-location h3,.site-map-location address { margin:0; }
.site-map-location address { color:var(--ink-soft); font-style:normal; }
.site-map-location__actions { display:flex; flex-wrap:wrap; gap:8px; }
.site-map-location__actions a { display:inline-flex; min-height:36px; align-items:center; padding:7px 12px; border:1px solid var(--line); border-radius:999px; font-weight:700; }

/* Social accounts and sharing */
.social-profiles,.social-share { display:flex; flex-wrap:wrap; align-items:center; gap:var(--social-gap,10px); }
.social-profile { --social-brand:var(--brand); display:inline-flex; min-width:var(--social-size,42px); height:var(--social-size,42px); align-items:center; justify-content:center; gap:8px; padding:0 11px; border:1px solid color-mix(in srgb,var(--social-brand) 55%,transparent); color:var(--social-brand); background:color-mix(in srgb,var(--social-brand) 9%,var(--surface)); text-decoration:none; font:inherit; font-weight:800; cursor:pointer; transition:transform .18s ease,box-shadow .18s ease,background .18s ease; }
.social-profile:hover,.social-profile:focus-visible { transform:translateY(-2px); box-shadow:0 8px 22px color-mix(in srgb,var(--social-brand) 20%,transparent); }
.social-profiles--circle .social-profile { width:var(--social-size,42px); padding:0; border-radius:50%; }
.social-profiles--square .social-profile { width:var(--social-size,42px); padding:0; border-radius:10px; }
.social-profiles--pill .social-profile,.social-profiles--labels .social-profile { width:auto; border-radius:999px; }
.social-profiles--plain .social-profile { width:auto; min-width:0; height:auto; padding:5px; border:0; background:transparent; }
.social-profile__symbol { line-height:1; }
.social-share .social-profile { width:auto; border-radius:999px; }
.social-share .social-profile span:last-child { font-size:.82rem; }

@media (max-width:680px) {
  .site-map-component__canvas,.site-map-component iframe,.interactive-google-map { min-height:320px; height:min(var(--map-height,420px),70vh); }
  .site-map-location__actions a { flex:1 1 auto; justify-content:center; }
}
