:root{
  --ink:#1c2b28; /* djup grönsvart */
  --sage:#9bb5a5; /* mild salviagrön */
  --mist:#eef3f1; /* ljus bakgrund */
  --paper:#ffffff;
  --accent:#6d8f80;
  --ring: #cfe1d9;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:"Manrope", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  color:var(--ink);
  background:var(--mist);
  line-height:1.6;
  font-weight:350;
}

/* Header */
.site-header{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem 1.25rem;
  background:var(--paper);
  border-bottom:1px solid #dfe8e4;
}

.brand{
  display:flex;
  align-items:center;
  gap:.6rem;
  color:var(--accent);
}
.brand .flower{
  width:72px; height:36px;
}
.brand-text{
  font-family:"Cormorant Garamond", serif;
  font-weight:600;
  letter-spacing:.02em;
  font-size:1.7rem;
}

/* Divider under header (tecknad linje-känsla) */
.divider{
  height:2px;
  background:linear-gradient(to right, transparent 0, var(--sage) 20%, var(--sage) 80%, transparent 100%);
  border:0; margin:0;
}

/* Desktop nav with hover dropdown */
.nav{ display:none; }
@media (min-width:840px){
  .nav{ display:block; }
}

.menu{
  list-style:none; margin:0; padding:0; display:flex; gap:1rem;
}
.menu-link{
  display:inline-block; padding:.5rem .75rem; border-radius:999px;
  text-decoration:none; color:var(--ink);
  border:1px solid transparent;
}
.menu-link:hover{ border-color:var(--ring); background:var(--mist); }

/* Dropdown */
.has-dropdown{ position:relative; }
.dropdown{
  position:absolute; right:0; top:calc(100% + .4rem);
  display:none; min-width:210px;
  background:var(--paper);
  border:1px solid #dfe8e4;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
  border-radius:16px; padding:.5rem;
}
.dropdown a{
  display:block; padding:.6rem .8rem; border-radius:12px;
  color:var(--ink); text-decoration:none;
}
.dropdown a:hover{ background:var(--mist); }
.has-dropdown:hover .dropdown{ display:block; }

/* Mobile hamburger & drawer (CSS only) */
.nav-toggle{ display:none; }
.hamburger{
  display:flex; flex-direction:column; gap:4px; cursor:pointer;
  padding:.6rem; border-radius:10px; border:1px solid transparent;
}
.hamburger span{ width:24px; height:2px; background:var(--ink); display:block; }
@media (min-width:840px){
  .hamburger{ display:none; }
}

.mobile-drawer{
  position:fixed; inset:0 0 auto auto; /* top-right */
  top:64px; right:12px;
  background:var(--paper);
  border:1px solid #dfe8e4;
  border-radius:16px;
  width:240px; padding:.5rem;
  box-shadow:0 10px 30px rgba(0,0,0,.1);
  display:none; z-index:50;
}
.mobile-drawer a{
  display:block; padding:.7rem .9rem; text-decoration:none; color:var(--ink);
  border-radius:12px;
}
.mobile-drawer a:hover{ background:var(--mist); }
.nav-toggle:checked ~ .mobile-drawer{ display:block; }

/* Layout */
.container{
  display:grid;
  grid-template-columns: 1fr;
  gap:2rem;
  max-width:1080px;
  margin:2rem auto;
  padding:0 1.25rem;
}
@media (min-width:960px){
  .container{
    grid-template-columns: minmax(0, 1.2fr) 0.8fr;
    align-items:start;
  }
}

.intro h1{
  font-family:"Cormorant Garamond", serif;
  font-weight:600; letter-spacing:.01em;
  margin:0 0 .6rem; font-size:clamp(1.6rem, 2vw + 1rem, 2.4rem);
}
.intro p{ margin:.6rem 0; }
.cta{
  display:inline-block; margin-top:1rem;
  background:var(--accent); color:white; text-decoration:none;
  padding:.7rem 1.1rem; border-radius:999px; font-weight:600;
}
.cta:hover{ filter:brightness(.95); }

/* Side card (låda till höger, enligt skiss) */
.side-card{
  background:var(--paper);
  border:1px solid #dfe8e4;
  border-radius:18px;
  padding:1rem;
  position:relative;
}
.side-title{
  margin:.2rem 0 0.4rem;
  font-family:"Cormorant Garamond", serif;
  font-weight:600;
}
.side-card a{
  display:block; padding:.45rem .55rem; border-radius:10px;
  text-decoration:none; color:var(--ink);
}
.side-card a:hover{ background:var(--mist); }

/* Sections */
.section{
  background:var(--paper);
  border-top:1px solid #e6eeea;
  border-bottom:1px solid #e6eeea;
}
.section.alt{ background:#f7faf8; }
.section-inner{
  max-width:960px; margin:0 auto; padding:3rem 1.25rem;
}
.section h2{
  font-family:"Cormorant Garamond", serif;
  font-weight:600; margin:0 0 .8rem;
}

.service-list{ margin:.4rem 0 0 1.1rem; }

.contact-form{
  display:grid; gap:.9rem; max-width:620px;
}
.contact-form label{ display:grid; gap:.35rem; font-weight:600; }
.contact-form input, .contact-form textarea{
  border:1px solid #ceddd7; border-radius:12px; padding:.7rem .9rem; font:inherit; background:white;
}
.contact-form input:focus, .contact-form textarea:focus{
  outline:3px solid var(--ring);
}
.contact-form button{
  justify-self:start; background:var(--accent); color:white; border:0;
  padding:.7rem 1.1rem; border-radius:999px; font-weight:700; cursor:pointer;
}
.contact-form button:hover{ filter:brightness(.95); }

/* Footer */
.site-footer{
  text-align:center; color:#4b6058; padding:2rem 1rem; font-size:.95rem;
}