@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700&family=Playfair+Display:wght@500;600&display=swap');

:root { --ink:#132427; --paper:#f5f1e8; --mist:#dce4dc; --gold:#c9a76a; --muted:#647174; --deep:#18383a; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Manrope,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.header { position:sticky; top:0; z-index:20; height:82px; padding:0 clamp(24px,5vw,76px); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:28px; border-bottom:1px solid rgba(19,36,39,.1); background:rgba(247,244,237,.92); box-shadow:0 5px 18px rgba(19,36,39,.04); backdrop-filter:blur(12px); }
.brand { font-family:"Playfair Display",Georgia,serif; font-size:29px; font-weight:600; letter-spacing:-1.4px; }
.brand span { color:var(--gold); }
nav { display:flex; justify-self:center; gap:5px; font-size:13px; }
nav a { padding:9px 13px; border:1px solid transparent; border-radius:100px; transition:background .2s ease,border-color .2s ease,color .2s ease,transform .2s ease; }
nav a:hover,nav a[aria-current="page"] { border-color:rgba(201,167,106,.5); background:#ede2ca; color:#182a2d; transform:translateY(-1px); }
.header-link { font-size:13px; border-bottom:1px solid var(--ink); padding-bottom:4px; }
.hero { min-height:650px; position:relative; overflow:hidden; color:#fff; display:flex; align-items:center; padding:clamp(48px,9vw,132px); }
.hero img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; }
.hero-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(5,12,12,.9) 0%,rgba(5,12,12,.66) 42%,rgba(5,12,12,.05) 74%); }
.hero-copy { position:relative; width:min(620px,100%); }
.hero-copy h1 { font-size:clamp(42px,4.4vw,58px); letter-spacing:-.018em; }
.eyebrow { margin:0 0 17px; text-transform:uppercase; font-size:11px; letter-spacing:.19em; font-weight:700; color:var(--gold); }
h1,h2,h3 { font-family:"Playfair Display",Georgia,serif; font-weight:500; margin:0; }
h1 { font-size:clamp(45px,5.4vw,77px); letter-spacing:-.045em; line-height:1.01; }
.lead { max-width:440px; margin:28px 0 34px; font-size:17px; line-height:1.6; color:#e2e6de; }
.button { display:inline-block; border-radius:100px; background:var(--gold); color:#192426; padding:15px 23px; font-size:14px; font-weight:700; }
.hero-note { position:absolute; bottom:24px; right:clamp(24px,5vw,76px); width:min(270px,40vw); margin:0; color:#d9d4c9; font-size:12px; line-height:1.45; text-align:right; }
.intro { position:relative; display:flex; justify-content:flex-end; overflow:hidden; padding:125px clamp(24px,10vw,154px); background:radial-gradient(ellipse at 84% 12%,rgba(201,167,106,.28),transparent 30%),radial-gradient(ellipse at 78% 72%,rgba(75,122,111,.22),transparent 48%),linear-gradient(115deg,#f7f4ed 0%,#eff1eb 53%,#dce6dd 100%); }
.intro::after { content:""; position:absolute; right:-15vw; top:-25vw; width:55vw; aspect-ratio:1; border:1px solid rgba(92,124,116,.32); border-radius:48% 52% 42% 58%; box-shadow:inset 0 0 0 24px rgba(255,255,255,.12),0 0 0 1px rgba(201,167,106,.15); transform:rotate(-18deg); }
.intro > * { position:relative; z-index:1; }
.intro > div { width:min(780px,100%); margin-left:auto; text-align:right; }
.intro h2,.section-heading h2,.contact-preview h2 { font-size:clamp(35px,4.5vw,58px); letter-spacing:-.045em; line-height:1.04; }
.intro div p { max-width:580px; margin:28px 0 0 auto; color:var(--muted); font-size:18px; line-height:1.65; }
.catalog { padding:86px clamp(24px,5vw,76px) 110px; background:var(--deep); color:#f7f4ed; }
.catalog-preview { position:relative; min-height:560px; display:flex; align-items:center; overflow:hidden; padding:clamp(62px,9vw,126px) clamp(24px,10vw,154px); background:#112728; color:#f7f4ed; }.catalog-preview-image,.catalog-preview-shade { position:absolute; inset:0; width:100%; height:100%; }.catalog-preview-image { object-fit:cover; object-position:center; }.catalog-preview-shade { background:linear-gradient(90deg,rgba(5,13,13,.94) 0%,rgba(5,13,13,.72) 39%,rgba(5,13,13,.12) 72%,rgba(5,13,13,.18) 100%); }.catalog-preview-copy { position:relative; z-index:1; max-width:570px; }.catalog-preview h2 { max-width:620px; font-size:clamp(38px,4.8vw,64px); letter-spacing:-.04em; line-height:1.04; }.catalog-preview-copy > p:not(.eyebrow) { max-width:440px; margin:26px 0 28px; color:#dce5dc; font-size:16px; line-height:1.65; }
.catalog-page-header { padding:clamp(64px,9vw,132px) clamp(24px,10vw,154px); background:linear-gradient(120deg,#f7f4ed 0%,#e0e9df 100%); }.catalog-page-header h1 { max-width:760px; font-size:clamp(48px,6vw,82px); letter-spacing:-.035em; line-height:1.02; }.catalog-page-header > p:last-child { max-width:480px; margin:24px 0 0; color:var(--muted); font-size:17px; line-height:1.6; }
.section-heading { display:grid; grid-template-columns:1.3fr .7fr; gap:80px; align-items:end; max-width:1160px; margin:0 auto 50px; }
.section-heading p:last-child { margin:0; color:#cbd6d0; font-size:14px; line-height:1.65; }
.catalog-toolbar { max-width:1160px; margin:0 auto 18px; display:flex; flex-wrap:wrap; gap:9px; }
.filter { border:1px solid #668081; border-radius:100px; padding:10px 17px; background:transparent; color:#e8ede8; font:600 13px Manrope,Arial,sans-serif; cursor:pointer; transition:.2s ease; }
.filter:hover,.filter.is-active { background:var(--gold); border-color:var(--gold); color:#172729; }
.filter:focus-visible,.product-card:focus-visible,.dialog-close:focus-visible { outline:3px solid #f5d69e; outline-offset:3px; }
.catalog-count { max-width:1160px; margin:0 auto 26px; color:#aebeba; font-size:12px; }
.product-grid { max-width:1160px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.product-card { appearance:none; padding:0; border:0; border-radius:4px; background:#f4f0e7; color:var(--ink); text-align:left; overflow:hidden; cursor:pointer; transition:transform .24s ease,box-shadow .24s ease; }
.product-card:hover { transform:translateY(-5px); box-shadow:0 18px 34px rgba(0,0,0,.22); }
.product-visual,.dialog-visual { position:relative; display:flex; align-items:center; justify-content:center; overflow:hidden; background:linear-gradient(135deg,#426d66,#203d40); }
.product-visual { aspect-ratio:1.18; }
.product-visual::before,.dialog-visual::before { content:""; position:absolute; width:78%; height:78%; border:1px solid rgba(228,207,161,.55); border-radius:48% 52% 58% 42%; transform:rotate(-12deg); }
.product-visual::after,.dialog-visual::after { content:""; position:absolute; width:46%; height:46%; border:1px solid rgba(255,255,255,.18); border-radius:60% 40% 44% 56%; transform:translate(35%,-20%) rotate(18deg); }
.product-visual.has-photo::before,.product-visual.has-photo::after,.dialog-visual.has-photo::before,.dialog-visual.has-photo::after { display:none; }
.product-visual.has-photo img,.dialog-visual.has-photo img { width:100%; height:100%; object-fit:cover; }
.product-card:nth-child(4n+2) .product-visual { background:linear-gradient(145deg,#675d4d,#283f3c); }.product-card:nth-child(4n+3) .product-visual { background:linear-gradient(150deg,#29464f,#182a34); }.product-card:nth-child(4n+4) .product-visual { background:linear-gradient(140deg,#4c6259,#243833); }
.product-visual span,.dialog-visual span { position:relative; z-index:1; color:#f3e7d0; text-transform:uppercase; letter-spacing:.15em; font-size:10px; font-weight:700; }
.product-visual .product-status { position:absolute; z-index:2; top:12px; left:12px; padding:8px 11px; border:1px solid rgba(255,255,255,.32); border-radius:100px; background:#173f36; color:#fff; box-shadow:0 4px 14px rgba(0,0,0,.28); font-size:10px; font-weight:700; line-height:1; text-transform:uppercase; letter-spacing:.06em; }
.product-visual .product-status[data-status="order"] { border-color:#dfc287; background:#dfc287; color:#172729; }
.product-info { padding:20px; }
.product-meta { display:flex; justify-content:space-between; gap:12px; margin-bottom:10px; color:#758181; font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.product-dimensions { display:flex; align-items:center; gap:6px; color:#59696a; font-variant-numeric:tabular-nums; letter-spacing:0; white-space:nowrap; }.dimension-item { display:inline-flex; align-items:center; gap:2px; font-size:9px; font-weight:700; }.dimension-item svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.35; stroke-linecap:round; stroke-linejoin:round; }.dimensions-help { position:relative; width:17px; height:17px; display:inline-grid; place-items:center; border:1px solid #9ba5a3; border-radius:50%; color:#506162; font-family:Georgia,serif; font-size:11px; font-weight:700; line-height:1; text-transform:none; cursor:help; }.dimensions-tooltip { position:absolute; z-index:6; right:-7px; bottom:calc(100% + 10px); width:max-content; min-width:150px; padding:11px 13px; display:grid; gap:5px; border-radius:4px; background:#132f31; color:#fff; box-shadow:0 10px 26px rgba(0,0,0,.25); opacity:0; visibility:hidden; transform:translateY(5px); transition:opacity .18s ease,transform .18s ease,visibility .18s ease; pointer-events:none; font-family:Manrope,Arial,sans-serif; font-size:10px; font-weight:500; letter-spacing:0; line-height:1.35; text-align:left; text-transform:none; }.dimensions-tooltip::after { content:""; position:absolute; top:100%; right:10px; border:6px solid transparent; border-top-color:#132f31; }.dimensions-help:hover .dimensions-tooltip { opacity:1; visibility:visible; transform:translateY(0); }
.product-info h3 { font-size:25px; letter-spacing:-.035em; }.product-info p { min-height:42px; margin:10px 0 22px; color:#667475; font-size:13px; line-height:1.55; }.product-bottom { display:flex; justify-content:space-between; align-items:center; gap:12px; border-top:1px solid #d9d8d0; padding-top:14px; }.product-price { font-size:14px; font-weight:700; }.product-more { color:#637273; font-size:12px; }
.product-dialog { width:min(960px,calc(100% - 32px)); padding:0; border:0; border-radius:8px; background:var(--paper); color:var(--ink); box-shadow:0 30px 90px rgba(0,0,0,.4); grid-template-columns:1fr 1fr; overflow:hidden; }
.product-dialog[open] { display:grid; }.product-dialog::backdrop { background:rgba(4,14,15,.78); backdrop-filter:blur(5px); }.dialog-close { position:absolute; z-index:3; top:14px; right:14px; width:42px; height:42px; border:0; border-radius:50%; background:#f4f0e7; color:var(--ink); font-size:26px; cursor:pointer; }.dialog-visual { min-height:560px; }.dialog-copy { padding:70px 58px 50px; }.dialog-copy h2 { font-size:44px; line-height:1.04; letter-spacing:-.045em; }.dialog-description { margin:24px 0; color:var(--muted); font-size:15px; line-height:1.65; }.dialog-copy dl { margin:28px 0; border-top:1px solid #d8d6cf; }.dialog-copy dl div { display:flex; justify-content:space-between; gap:20px; padding:13px 0; border-bottom:1px solid #d8d6cf; font-size:13px; }.dialog-copy dt { color:#738083; }.dialog-copy dd { margin:0; text-align:right; font-weight:600; }.dialog-bottom { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-top:30px; }.dialog-bottom strong { font-size:20px; }.dialog-copy small { display:block; margin-top:22px; color:#8b9291; line-height:1.45; }
.order-section { margin:0 clamp(24px,5vw,76px) 74px; padding:clamp(48px,7vw,84px); display:grid; grid-template-columns:minmax(0,.85fr) minmax(420px,1.15fr); gap:clamp(48px,8vw,110px); background:#d7e1d7; }
.order-intro h2 { font-size:clamp(35px,4.5vw,58px); letter-spacing:-.045em; line-height:1.04; }.order-intro > p:not(.eyebrow) { max-width:470px; margin:24px 0 34px; color:#4f6264; font-size:15px; line-height:1.65; }
.order-steps { margin:0; padding:0; list-style:none; border-top:1px solid rgba(19,36,39,.2); }.order-steps li { display:flex; gap:18px; padding:15px 0; border-bottom:1px solid rgba(19,36,39,.2); font-size:13px; }.order-steps span { color:#7a694c; font-size:11px; font-weight:700; }
.order-panel { min-height:530px; padding:34px; background:#f5f1e8; box-shadow:0 18px 50px rgba(27,53,52,.1); }.order-form { display:grid; gap:19px; }.order-form[hidden] { display:none; }.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }.order-form label { display:grid; gap:8px; color:#4b5b5d; font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }.order-form input:not([type="checkbox"]),.order-form select,.order-form textarea { width:100%; border:1px solid #c9ccc4; border-radius:3px; background:#fffdf8; color:var(--ink); padding:13px 14px; font:500 14px Manrope,Arial,sans-serif; text-transform:none; outline:none; transition:border-color .2s ease,box-shadow .2s ease; }.order-form textarea { resize:vertical; min-height:108px; }.order-form input:focus,.order-form select:focus,.order-form textarea:focus { border-color:#7d966f; box-shadow:0 0 0 3px rgba(125,150,111,.17); }.order-form input::placeholder,.order-form textarea::placeholder { color:#9a9f9b; font-weight:400; }
.consent { grid-template-columns:18px 1fr; align-items:start; gap:10px!important; font-size:11px!important; line-height:1.45; text-transform:none!important; letter-spacing:0!important; font-weight:500!important; }.consent input { width:16px; height:16px; margin:1px 0 0; accent-color:var(--deep); }.form-actions { display:flex; align-items:center; gap:17px; margin-top:2px; }.form-submit { border:0; cursor:pointer; }.form-actions span { max-width:220px; color:#7d8583; font-size:10px; line-height:1.45; }.form-success { min-height:462px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; }.form-success[hidden] { display:none; }.form-success > span { color:#7a694c; font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; }.form-success h3 { margin-top:18px; font-size:38px; line-height:1.05; letter-spacing:-.035em; }.form-success p { max-width:430px; margin:22px 0; color:var(--muted); font-size:14px; line-height:1.65; }.messenger-links { width:100%; display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:4px 0 24px; }.messenger-link { min-height:67px; padding:14px 16px; display:grid; align-content:center; gap:4px; border:1px solid #c9ccc4; border-radius:3px; background:#fffdf8; color:var(--ink); font-size:14px; font-weight:700; transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease; }.messenger-link small { color:#687778; font-size:10px; font-weight:500; }.messenger-link:not(.is-disabled):hover { border-color:#7d966f; box-shadow:0 7px 16px rgba(27,53,52,.12); transform:translateY(-2px); }.messenger-link--telegram { border-color:#8ebfd4; }.messenger-link--max { border-color:#b2a1df; }.messenger-link.is-disabled { opacity:.55; cursor:not-allowed; }.text-button { padding:0 0 4px; border:0; border-bottom:1px solid var(--ink); background:transparent; color:var(--ink); font:600 13px Manrope,Arial,sans-serif; cursor:pointer; }
footer { display:flex; justify-content:space-between; padding:28px clamp(24px,5vw,76px); border-top:1px solid #d9d5cc; font-size:12px; color:var(--muted); } footer span { color:#a09c92; }
@media (max-width:980px) { .order-section { grid-template-columns:1fr; }.order-intro > p:not(.eyebrow) { max-width:650px; } }
@media (max-width:900px) { .product-grid { grid-template-columns:1fr 1fr; }.product-dialog[open] { grid-template-columns:1fr; max-height:92vh; overflow:auto; }.dialog-visual { min-height:280px; }.dialog-copy { padding:40px 32px; } }
@media (max-width:760px) { .header { height:auto; padding-top:20px; padding-bottom:20px; }.header nav,.header-link { display:none; }.hero { min-height:600px; padding:84px 24px; }.hero-shade { background:linear-gradient(90deg,rgba(5,12,12,.9),rgba(5,12,12,.38)); }.hero-note { left:24px; right:auto; text-align:left; width:260px; }.intro,.section-heading,.catalog-preview { grid-template-columns:1fr; gap:28px; }.intro { padding:84px 24px; }.catalog { padding:70px 24px; }.order-section { margin:0 24px 46px; padding:48px 28px; gap:38px; } footer { padding:24px; } }
@media (max-width:560px) { .product-grid { grid-template-columns:1fr; }.product-card { display:grid; grid-template-columns:42% 58%; }.product-visual { aspect-ratio:auto; }.product-info h3 { font-size:21px; }.product-info p { display:none; }.dialog-copy h2 { font-size:36px; }.dialog-bottom { align-items:flex-start; flex-direction:column; } }
@media (max-width:520px) { .order-panel { min-height:0; padding:24px 20px; }.form-row,.messenger-links { grid-template-columns:1fr; }.form-actions { align-items:flex-start; flex-direction:column; }.form-success { min-height:390px; }.form-success h3 { font-size:32px; } }
