:root{--bg:#f8efef;--brand:#0b2a59;--text:#1e293b;--muted:#6b7280;--card:#fff;--shadow:0 10px 25px rgba(0,0,0,.12)}
*{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,Ubuntu,Arial,sans-serif}
a{color:inherit;text-decoration:none}
figure img{max-width:100%;height:auto}
img{width:100%;height:auto;display:block}
.container{max-width:1100px;margin:0 auto;padding:20px}

.site-header{position:sticky;top:0;background:#9ddad4;display:flex;align-items:center;justify-content:space-between;padding:14px 16px;z-index:10;box-shadow:0 2px 10px rgba(0,0,0,.08)}
.site-header .nav-left{display:flex;align-items:center;gap:16px}
.site-header .insta{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px}
.site-header .insta img{width:28px;height:28px}
.main-nav a{margin:0 8px;font-weight:600}
.brand-wrap{position:absolute;right:0px;top:-8px;height:140px;pointer-events:none}
.brand{height:140px}
@media (max-width: 768px){
  .om-grid{grid-template-columns:1fr}
  /* move logo 3px down and 5px right on mobile */
  .brand-wrap{top:7px;right:6px;transform:scale(.6);transform-origin:top right}
}
.page-title{font-size:2.25rem;margin:10px 0 20px}
.om-grid{display:grid;grid-template-columns:1fr;gap:24px;align-items:center}
@media (min-width:900px){.om-grid{grid-template-columns:1fr 1fr}}
/* make the figure span full container width on larger screens so the image is 100% width */
@media (min-width:900px){
  .figure { grid-column: 1 / -1; /* span both columns so image is full width */ }
  /* optional: remove inner padding if you want the image to touch container padding edges
     .figure { padding: 0; border-radius: 12px; } */
}
.figure{box-shadow:var(--shadow);border-radius:16px;overflow:hidden;background:#fff;padding:8px}
.site-footer{padding:40px 16px;text-align:center;color:var(--muted)}
