@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@400;500;600&family=Inter:wght@300;400;500&display=swap');

:root{
--bg:#f7f5f1;
--text:#2f3434;
--muted:#6d7573;
--accent:#8f8067;
--line:#ddd7cf;
}

*{box-sizing:border-box}
body{
margin:0;
font-family:'Inter',sans-serif;
background:var(--bg);
color:var(--text);
line-height:1.8;
}
header{
background:rgba(247,245,241,.95);
backdrop-filter:blur(8px);
position:sticky;
top:0;
z-index:10;
border-bottom:1px solid var(--line);
}
.nav{
max-width:1200px;
margin:auto;
padding:1.2rem 2rem;
display:flex;
justify-content:space-between;
align-items:center;
}
.logo{
font-family:'Cormorant Garamond',serif;
font-size:2rem;
line-height: 1.1;
font-weight: bolder;
}
.credentials {color: #978e8e; }

nav a{
text-decoration:none;
color:#2f3131;
margin-left:1.5rem;
}

.hero{
height:60vh;
background:
linear-gradient(rgba(255,255,255,.15),rgba(255,255,255,.15)),
url('bg-2.png') center/cover;
display:flex;
align-items:center;
}

.hero-sm{
    height:10vh;
    background:
    linear-gradient(rgba(255,255,255,.15),rgba(255,255,255,.15)),
    url('bg-2.png') center/cover;
    display:flex;
    align-items:center;
    margin-bottom: -2rem;
    }
    
.hero-inner{
max-width:1200px;
margin:auto;
padding:2rem;
}
.hero h1{
font-family:'Cormorant Garamond',serif;
font-size:clamp(3rem,7vw,5.8rem);
font-weight:500;
max-width:700px;
line-height:1;
}
.hero p{
font-size:1.15rem;
max-width:600px;
}
.container{
max-width:1100px;
margin:auto;
padding:2rem 2rem;
}
.intro{
display:grid;
grid-template-columns:320px 1fr;
gap:4rem;
align-items:;
}
.portrait{
width:100%;
border-radius:4px;
box-shadow:0 20px 50px rgba(0,0,0,.08);
vertical-align: top;
margin-top: 3rem;
}
.img-right{
    margin:0 0rem 2rem 2rem;
    border-radius:4px;
    box-shadow:0 20px 50px rgba(0,0,0,.08);
    float:right;
    margin-top: 3rem;
    }

/* OPTION 2 BUTTONS */
.button-group {
    display: flex;
    gap: 1rem;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 2rem;
}
.jung-button2 {
    display: inline-block;
    padding: 1rem 1.75rem;

    background: #f8f5ef;
    border: 1px solid #ddd5c9;
    border-radius: 14px;

    color: #4f5555;
    text-decoration: none;

    font-family: "Cormorant Garamond", serif;
    font-size: 1.15rem;

    transition: all .25s ease;
}

.jung-button:hover {
    background: white;
    border-color: #b6a27b;
    box-shadow: 0 8px 25px rgba(0,0,0,.06);
}


.container h1{
    font-family:'Cormorant Garamond',serif;
    font-size:3rem;
    font-weight:500;
    max-width:700px;
    line-height:1;
    }
h2{
font-family:'Cormorant Garamond',serif;
font-size:2rem;
line-height: 1.3;
font-weight:500;
margin-bottom:.5rem;
}
blockquote{
font-family:'Cormorant Garamond',serif;
font-size:1.8rem;
font-style:italic;
color:var(--accent);
}
.reflection {
    max-width: 700px;
    margin: 4rem auto;
    padding: 2rem;
    background: rgba(255,255,255,0.6);
    border-radius: 8px;
}

.reflection p {
    margin: 0;
    font-family: 'Cormorant Garamond', serif;
    font-size: 1.8rem;
    line-height: 1.4;
    color: #5b5b5b;
    text-align: center;
}
.sectionbreak {
    width: 30%;       /* Takes up 100% of its container's width */
    max-width: 600px;  /* Optional: Stops the image from getting too large */
    height: auto;      /* Maintains original aspect ratio */
    display: block;
    margin-left: auto;
    margin-right: auto;
  }

@media(max-width:800px){
.intro{grid-template-columns:1fr}
.hero{height:60vh}
}

[id] {
    scroll-margin-top: 125px; /* Replace with your header height */
  }
 
  
  /* ======================================== */
  /* FOOTER                                   */
  /* ======================================== */
  
  .site-footer{
  
      margin-top:4rem;
  
      background:#ffffff;
  
      border-top:1px solid #e6dfd6;
  
  }
  
  .footer-divider{
  
      width:70px;
  
      height:1px;
  
      background:#bba884;
  
      margin:0 auto;
  
  }
  
  .footer-content{
  
      max-width:1200px;
      margin:auto; 
      padding:1rem 2rem 3rem; 
      display:grid;  
      grid-template-columns:
          3fr
          1fr;
      gap:3rem;
      align-items:start; 
  }
  
  .footer-brand h3{
  
      margin:0;  
      font-family:"Cormorant Garamond", serif; 
      font-size:2rem;
 
      font-weight:500;
  
      color:#3d4343;
  
  }
  
  .footer-brand p{
  
      margin-top:.5rem;
  
      color:#8b8478;
  
      letter-spacing:.05em;
  
  }
  
  .footer-contact h2{
  
    margin-top:.5rem;

}
  
  .footer-contact a{
  
      color:#5b5b5b;
  
      text-decoration:none;
  
      transition:.3s;
  
  }
  
  .footer-contact a:hover{
  
      color:#a88d59;
  
  }
  
  .footer-contact p{
  
      margin-top:1rem;
  
      color:#777;
  
      line-height:1.7;
  
  }
  
  .footer-button{
  
      display:inline-block;
  
      padding:14px 28px;

      margin-top:1.5rem;
  
      border-radius:999px;
  
      border:1px solid #b6a27b;
  
      color:#6f6757;
  
      text-decoration:none;
  
      font-family:"Cormorant Garamond", serif;
  
      font-size:1.1rem;
  
      transition:.3s;
  
  }
  
  .footer-button:hover{
  
      background:#b6a27b;
  
      color:white;
  
  }
  
  .footer-bottom{
  
      text-align:center;
  
      padding:2rem;
  
      
  
  }
  
  .footer-bottom p{
  
      margin:0;
  
      color:#cecdcd;
  
      font-size:.9rem;
  
  }
  
  
  /* ======================================== */
  /* MOBILE                                   */
  /* ======================================== */
  
  @media (max-width:900px){
  
  .footer-content{
  
      grid-template-columns:1fr;
  
      text-align:center;
  
  }
  
  .footer-contact{
  
      align-items:center;
  
  }
  
  }
  ```