:root { --paper:#f7f1e3; --ink:#34444a; --soft:#7d7263; --sea:#3f8f8a; --line:rgba(52,68,74,.15); }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Cormorant Garamond",Georgia,serif; font-size:20px; line-height:1.55; }
a { color:var(--sea); }
.wrap { max-width:1060px; margin:0 auto; padding:0 24px; }
.top { border-bottom:1px solid var(--line); }
.top .wrap { display:flex; align-items:center; justify-content:space-between; padding:12px 24px; gap:16px; flex-wrap:wrap; }
.brand { display:flex; align-items:center; gap:12px; color:var(--ink); text-decoration:none; letter-spacing:.14em; text-transform:uppercase; font-size:17px; }
.brand img { width:54px; height:auto; }
.top nav a { color:var(--ink); text-decoration:none; letter-spacing:.12em; text-transform:uppercase; font-size:14px; margin-left:20px; }
.crumbs { font-size:15px; color:var(--soft); margin:28px 0 0; }
.crumbs a { color:var(--soft); }
.card-page { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:56px; align-items:start; padding:28px 0 64px; }
.card-page img { width:100%; height:auto; display:block; box-shadow:0 12px 34px rgba(52,68,74,.16); }
h1 { font-weight:500; font-size:clamp(30px,4vw,42px); line-height:1.15; margin:0 0 6px; }
.sub { color:var(--soft); font-style:italic; margin:0 0 20px; }
.price { font-size:24px; margin:8px 0 4px; }
.small { font-size:16px; color:var(--soft); }
.button { display:inline-block; margin:14px 0 6px; padding:12px 28px; border:1px solid var(--ink); color:var(--ink); text-decoration:none; letter-spacing:.12em; text-transform:uppercase; font-size:15px; }
.button:hover { background:var(--ink); color:var(--paper); }
.button.soon { border-style:dashed; color:var(--soft); border-color:var(--soft); }
ul.facts { padding-left:1.1em; margin:18px 0; }
.more { border-top:1px solid var(--line); padding:44px 0 56px; }
.more h2 { font-weight:500; text-align:center; margin:0 0 26px; }
.more .grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:22px; }
.more a { text-decoration:none; color:var(--ink); text-align:center; font-size:16px; }
.more img { width:100%; height:auto; box-shadow:0 6px 16px rgba(52,68,74,.14); margin-bottom:8px; }
footer { text-align:center; color:var(--soft); font-size:16px; padding:36px 24px 50px; border-top:1px solid var(--line); }
@media (max-width:760px) { .card-page { grid-template-columns:1fr; gap:28px; } .top nav a { margin:0 14px 0 0; } }