*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:#29231d;background:#f2ece1;font-family:Montserrat,Arial,sans-serif}
a{text-decoration:none;color:inherit}
a:hover{color:#8b6b43}

.header{height:94px;padding:18px 4%;display:flex;align-items:center;justify-content:space-between;background:#f6f1e8;border-bottom:1px solid #ded3c1;position:sticky;top:0;z-index:40}
.logo{font-family:"Cormorant Garamond",serif;line-height:.75;letter-spacing:.13em;font-size:39px;color:#29231d}
.logo span{display:block;font-size:21px;letter-spacing:.25em;margin-top:10px}
.header nav{display:flex;gap:36px;font-size:11px;letter-spacing:.08em}
.header nav a[aria-current="page"]{color:#8b6b43}
.tools{display:flex;gap:17px;align-items:center}
.tools a,.tools button{background:none;border:0;font-size:22px;color:#28231e;cursor:pointer;padding:0;line-height:1}
.tools sup{font-size:9px}

.hero{display:grid;grid-template-columns:40% 60%;min-height:640px;background:radial-gradient(circle at 30% 20%,#fffdf7 0,#f2e9dc 65%,#dfcfba 100%)}
.hero-copy{padding:70px 8% 50px 12%;z-index:2}
.hero h1{font:500 64px/.92 "Cormorant Garamond",serif;margin:0}
.hero h1 i{color:#84653f}
.line{width:265px;border-bottom:1px solid #b9a17d;text-align:center;margin:27px 0 24px;color:#8c7049}
.hero-copy p{font:17px/1.82 "Cormorant Garamond",serif;margin:0 0 .6rem}
.italic{font-style:italic;color:#765b3b}
.btn{display:inline-block;margin-top:14px;padding:18px 25px;background:#302419;color:#fffaf0;font:14px "Cormorant Garamond",serif;letter-spacing:.07em;border:0;cursor:pointer}
.btn:hover{background:#3d2f22;color:#fffaf0}
.btn.small{font-size:12px;padding:16px 22px}

.hero-products{position:relative;overflow:hidden;background:linear-gradient(130deg,#eee5d7,#e1d1bb)}
.hero-products.has-photo{background:#e8dccb center/cover no-repeat}
.hero-products.has-photo .deco{display:none}
.chain{position:absolute;border:5px solid #9c7137;border-color:#a67c3f transparent transparent transparent;border-radius:50%;opacity:.9}
.c1{width:320px;height:510px;left:20px;top:-210px;transform:rotate(18deg)}
.c2{width:400px;height:620px;right:-80px;top:90px;transform:rotate(-35deg)}
.cameo,.brooch,.earrings,.bow,.pendant{position:absolute;display:grid;place-items:center;text-shadow:0 3px 3px #3a2718}
.cameo{left:90px;top:260px;width:150px;height:185px;border:10px solid #9a6b2d;border-radius:50%;background:radial-gradient(circle,#f6ead6 0 30%,#20231f 32%);font-size:65px;color:#eee2ca}
.brooch{width:150px;height:150px;font-size:95px;color:#c59a4f}
.green{left:340px;top:120px;color:#1d5439}
.pink{left:250px;top:280px;color:#a26872}
.earrings{right:50px;top:210px;font-size:100px;color:#c6a36c}
.bow{left:230px;bottom:55px;font-size:150px;color:#b38a4f}
.pendant{right:220px;bottom:25px;font-size:110px;color:#c9aa71}

.values{display:grid;grid-template-columns:repeat(3,1fr);padding:40px 6%;background:#f8f4ec}
.values article{text-align:center;padding:5px 50px 25px;min-height:250px;border-right:1px solid #d9cebd}
.values article:last-child{border:0}
.icon{width:66px;height:66px;border:1px solid #c8b79e;border-radius:50%;display:grid;place-items:center;margin:auto;font-size:28px;color:#765c3c}
.values h2{font:500 23px/1.15 "Cormorant Garamond",serif}
.values p{font:15px/1.45 "Cormorant Garamond",serif}

.collection{text-align:center;padding:42px 3.5% 50px}
.collection>h2{font:500 59px/1 "Cormorant Garamond",serif;letter-spacing:.13em;margin:0}
.slogan{font:italic 24px "Cormorant Garamond",serif;color:#80613c;margin:7px 0 26px}
.cards{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;max-width:1300px;margin:auto}
.card{display:block;background:#f8f4ec;border:1px solid #ded3c2;border-radius:5px;overflow:hidden;padding-bottom:16px;color:inherit;transition:transform .25s ease,box-shadow .25s ease}
a.card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(48,36,25,.1);color:inherit}

.contact-hero{text-align:center;padding:4.5rem 6% 5rem;background:radial-gradient(circle at 50% 0%,#fffdf7 0,#f2e9dc 70%,#e8dcc8 100%)}
.contact-hero h1{font:500 48px/1.1 "Cormorant Garamond",serif;margin:0 0 .75rem}
.contact-hero .lead{font:italic 20px/1.5 "Cormorant Garamond",serif;color:#80613c;max-width:28rem;margin:0 auto 2rem}
.ig-card{display:inline-flex;flex-direction:column;align-items:center;gap:.85rem;padding:2rem 2.5rem;background:#f8f4ec;border:1px solid #ded3c2;min-width:min(100%,22rem)}
.ig-card .handle{font:500 36px/1 "Cormorant Garamond",serif;letter-spacing:.08em;color:#302419}
.ig-card .hint{font:15px/1.5 "Cormorant Garamond",serif;color:#6e5a42;margin:0}
.photo{height:205px;display:grid;place-items:center;font:80px "Cormorant Garamond",serif}
.hand{background:linear-gradient(135deg,#b98c70,#f0d2ba);color:#32271f}
.earrings2{background:#ddd2c2;color:#9d7744}
.green2{background:#d8d0c0;color:#21543a;text-shadow:0 3px 1px #9c783e}
.ring{background:#e1d5c4;color:#6f4750}
.brand{background:#203128;color:#c5a45b}
.card h3{font:500 19px "Cormorant Garamond",serif;margin:16px 0 7px}
.card p{font:15px/1.45 "Cormorant Garamond",serif;margin:0 0 10px}
.card b{font-size:21px;color:#8a673e}

footer.site-footer{display:flex;flex-wrap:wrap;justify-content:space-between;gap:1rem;align-items:center;padding:20px 6%;border-top:1px solid #d6cab8;font:16px "Cormorant Garamond",serif;background:#f6f1e8}
.footer-legal{display:flex;flex-wrap:wrap;gap:.75rem 1.25rem;width:100%;justify-content:center;font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:#6e5a42;padding-top:.5rem}
.footer-legal a:hover{color:#8b6b43}

/* Legal / inner pages */
.page{max-width:42rem;margin:0 auto;padding:3rem 6% 4.5rem}
.page h1{font:500 42px/1.1 "Cormorant Garamond",serif;margin:0 0 .5rem}
.page .meta{font:italic 16px "Cormorant Garamond",serif;color:#80613c;margin:0 0 1.75rem}
.prose h2{font:500 24px "Cormorant Garamond",serif;margin:2rem 0 .65rem;color:#302419}
.prose p,.prose li{font:17px/1.7 "Cormorant Garamond",serif;color:#3a322a}
.prose a{color:#84653f;text-decoration:underline;text-underline-offset:.15em}
.prose ul,.prose ol{padding-left:1.2rem}

/* Cookie banner */
.cookie-banner{position:fixed;z-index:60;left:1rem;right:1rem;bottom:1rem;width:min(34rem,calc(100% - 2rem));margin-inline:auto;padding:1.15rem 1.25rem;background:#f8f4ec;border:1px solid #ded3c2;box-shadow:0 16px 40px rgba(48,36,25,.18);transform:translateY(120%);opacity:0;pointer-events:none;transition:transform .4s ease,opacity .4s ease}
.cookie-banner.is-open{transform:translateY(0);opacity:1;pointer-events:auto}
.cookie-banner p{margin:0 0 1rem;font:15px/1.5 "Cormorant Garamond",serif;color:#3a322a}
.cookie-actions{display:flex;flex-wrap:wrap;gap:.55rem}
.cookie-actions button{cursor:pointer;font:13px "Cormorant Garamond",serif;letter-spacing:.06em;text-transform:uppercase;min-height:2.4rem;padding:.45rem .9rem;border:1px solid #c8b79e;background:#f6f1e8;color:#302419}
.cookie-actions .accept{background:#302419;color:#fffaf0;border-color:#302419}

@media(max-width:1000px){
  .cards{grid-template-columns:repeat(3,1fr)}
  .header nav{gap:16px}
}
@media(max-width:760px){
  .header{height:auto;flex-wrap:wrap;gap:15px}
  .header nav{order:3;width:100%;overflow:auto;padding-bottom:8px}
  .tools{display:none}
  .hero{grid-template-columns:1fr}
  .hero-copy{padding:55px 9%}
  .hero h1{font-size:54px}
  .hero-products{min-height:430px}
  .values{grid-template-columns:1fr}
  .values article{border-right:0;border-bottom:1px solid #d9cebd}
  .cards{grid-template-columns:repeat(2,1fr)}
  .collection>h2{font-size:43px}
  .photo{height:180px}
  footer.site-footer{font-size:13px}
  .page h1{font-size:34px}
}
@media(max-width:460px){
  .cards{grid-template-columns:1fr}
  .header nav{font-size:9px}
  .logo{font-size:31px}
}
@media(prefers-reduced-motion:reduce){
  *{transition:none!important}
}
