:root{--ink:#29231f;--brown:#4c3023;--brown2:#76513e;--cream:#f4ecdf;--paper:#fcfaf6;--gold:#aa8060;--line:rgba(76,48,35,.16);--serif:"Cormorant Garamond",Georgia,serif;--sans:"Montserrat",Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.75}a{color:inherit}img{display:block;max-width:100%}
.site-head{position:fixed;inset:0 0 auto 0;height:78px;z-index:20;display:flex;align-items:center;padding:0 clamp(18px,4vw,58px);background:rgba(252,250,246,.9);border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}
.menu-btn{width:44px;height:44px;padding:11px;border:0;background:transparent;cursor:pointer}.menu-btn span{display:block;height:1px;background:var(--brown);margin:6px 0;transition:.3s}.brand{margin-left:12px;font:600 clamp(22px,2.4vw,30px)/1 var(--serif);letter-spacing:.03em;text-decoration:none}
.drawer{position:fixed;inset:0 auto 0 0;width:min(390px,88vw);z-index:30;padding:96px 40px 40px;background:var(--brown);color:#fff;transform:translateX(-105%);transition:.35s}.drawer.open{transform:none}.drawer-close{position:absolute;right:24px;top:24px;border:0;background:none;color:#fff;font-size:32px;cursor:pointer}.drawer nav a{display:block;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.13);font:500 23px var(--serif);text-decoration:none}.overlay{position:fixed;inset:0;z-index:25;background:rgba(24,16,12,.42);opacity:0;pointer-events:none;transition:.3s}.overlay.open{opacity:1;pointer-events:auto}
.hero{padding:156px clamp(20px,7vw,100px) 86px;background:linear-gradient(125deg,rgba(45,28,20,.93),rgba(92,60,43,.82)),url("../assets/images/products/mdi-series-background.webp") center/cover;color:#fff}.eyebrow{font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:#d9bda8}.hero h1{max-width:850px;margin:12px 0 18px;font:500 clamp(48px,8vw,94px)/.95 var(--serif)}.hero p{max-width:650px;color:#eee2d7}
.wrap{width:min(1180px,calc(100% - 40px));margin:auto}.intro{text-align:center;padding:78px 0 34px}.intro h2{font:500 clamp(36px,5vw,56px)/1.05 var(--serif);margin:8px}.intro p{max-width:680px;margin:auto;color:#665b54}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;padding:24px 0 100px}.card{display:flex;flex-direction:column;min-height:360px;padding:36px;background:#fff;border:1px solid var(--line);transition:.3s}.card:hover{transform:translateY(-5px);box-shadow:0 18px 55px rgba(70,43,29,.1)}.card .no{font:italic 25px var(--serif);color:var(--gold)}.card h2{font:500 clamp(29px,3.3vw,42px)/1.08 var(--serif);margin:22px 0 14px}.card p{color:#6f645d}.read{display:inline-flex;align-items:center;gap:14px;margin-top:auto;padding-top:24px;font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;text-decoration:none}.read:after{content:"";width:42px;height:1px;background:currentColor;transition:.25s}.read:hover:after{width:65px}
.article-hero{padding:142px 20px 74px;background:var(--cream);text-align:center}.crumb{font-size:12px;letter-spacing:.1em;text-transform:uppercase}.article-hero h1{max-width:920px;margin:28px auto 20px;font:500 clamp(42px,7vw,78px)/1 var(--serif)}.meta{color:#77675d;font-size:13px}.article-layout{display:grid;grid-template-columns:minmax(0,760px) 290px;gap:76px;padding:80px 0 100px}.prose{font-family:Georgia,serif;font-size:18px;color:#453d38}.prose .lead{font-size:22px;color:#342b26}.prose h2{font:500 clamp(31px,4vw,44px)/1.08 var(--serif);color:var(--ink);margin:52px 0 18px}.prose ul{padding-left:22px}.note{margin:38px 0;padding:28px;border-left:3px solid var(--gold);background:var(--cream);font-family:var(--sans);font-size:15px}
.article-byline{margin-top:10px;color:#8b776a;font-size:12px}.article-figure{margin:38px 0 48px}.article-figure img{width:100%;aspect-ratio:16/10;object-fit:cover;background:#eadfce}.article-figure figcaption{padding-top:10px;color:#817269;font:12px/1.6 var(--sans)}.related-products{margin:54px 0 38px;padding-top:38px;border-top:1px solid var(--line)}.related-products>h2{margin:0 0 24px}.related-product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.related-product{display:block;color:var(--ink);text-decoration:none;background:#fff;border:1px solid var(--line)}.related-product img{width:100%;aspect-ratio:4/5;object-fit:cover;background:#eadfce}.related-product span{display:block;padding:13px 14px;font:600 13px var(--sans)}.related-product:hover span{text-decoration:underline}.related-articles{margin-top:34px;padding:26px;background:var(--cream);font-family:var(--sans)}.related-articles strong{display:block;margin-bottom:10px;font:500 24px var(--serif)}.related-articles a{display:block;padding:7px 0;color:var(--brown);font-size:13px;text-decoration:none}.related-articles a:hover{text-decoration:underline}
.side-box{position:sticky;top:110px;padding:28px;background:var(--brown);color:white}.side-box h3{font:500 30px var(--serif);margin:0 0 12px}.side-box a{display:inline-block;margin-top:12px;border:1px solid #cdb5a4;padding:11px 18px;text-decoration:none;font-size:11px;letter-spacing:.1em;text-transform:uppercase}.pager{display:flex;justify-content:space-between;gap:20px;padding:30px 0 80px;border-top:1px solid var(--line)}.pager a{text-decoration:none;font:500 22px var(--serif)}
.footer{padding:66px clamp(20px,6vw,90px) 28px;background:var(--brown);color:#f6eee7}.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1.2fr;gap:50px}.footer h2,.footer h3{font:500 27px var(--serif);margin-top:0}.footer p,.footer a{color:#ddcfc5;text-decoration:none;font-size:14px}.copyright{margin-top:48px;padding-top:22px;border-top:1px solid rgba(255,255,255,.13);font-size:12px;color:#c9b8ac}
.main-footer{padding:70px 24px 28px;color:#f2e8da;background:#3d281c}.footer-top{width:min(1180px,100%);margin:0 auto;display:grid;grid-template-columns:1.5fr repeat(2,.75fr);gap:50px;padding-bottom:55px}.footer-brand{margin:0 0 14px;font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(2rem,4vw,3.4rem);font-weight:500}.footer-text{max-width:420px;margin:0;color:rgba(242,232,218,.68);line-height:1.75}.footer-column h4{margin:8px 0 20px;font-size:.76rem;letter-spacing:.18em;text-transform:uppercase}.footer-column a,.footer-column span{display:block;margin:11px 0;color:rgba(242,232,218,.7);text-decoration:none;line-height:1.5}.footer-column a:hover{color:#fff}.footer-bottom{width:min(1180px,100%);margin:0 auto;padding-top:24px;display:flex;justify-content:space-between;gap:20px;color:rgba(242,232,218,.5);font-size:.82rem;border-top:1px solid rgba(255,255,255,.12)}
@media(max-width:820px){.site-head{height:66px}.hero{padding-top:128px}.grid{grid-template-columns:1fr}.article-layout{grid-template-columns:1fr;gap:30px}.side-box{position:static}.footer-grid{grid-template-columns:1fr}.article-hero{padding-top:116px}.pager{flex-direction:column}.card{min-height:330px;padding:28px}}
@media(max-width:480px){.wrap{width:min(100% - 28px,1180px)}.brand{font-size:21px}.hero h1{font-size:48px}.grid{gap:16px}.card h2{font-size:31px}}
@media(max-width:560px){.related-product-grid{grid-template-columns:1fr 1fr}.related-product:last-child{display:none}.article-figure{margin-left:-14px;margin-right:-14px}.article-figure img{aspect-ratio:4/3}}
@media(max-width:600px){.main-footer{padding:58px 20px 26px}.footer-top{grid-template-columns:1fr;gap:30px}.footer-bottom{flex-direction:column}}
.social-float{position:fixed;left:22px;bottom:24px;z-index:950;display:flex;flex-direction:column;gap:13px}
.social-float a{width:50px;height:50px;display:grid;place-items:center;color:#4c3023;background:rgba(244,236,223,.92);border:1px solid rgba(76,48,35,.22);border-radius:50%;box-shadow:0 8px 26px rgba(53,34,24,.14);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform .25s ease,background .25s ease,box-shadow .25s ease}
.social-float a:hover,.social-float a:focus-visible{transform:translateY(-3px);background:#fffaf2;box-shadow:0 12px 32px rgba(53,34,24,.22)}
.social-float svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:600px){.social-float{left:14px;bottom:16px;gap:11px}.social-float a{width:44px;height:44px}.social-float svg{width:20px;height:20px}}