*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 30% 20%,#ffedb7,#f7d893 58%,#ecd084);font:14px Arial,sans-serif;color:#080300}header{padding-top:43px}header h1{text-align:center;margin:0 0 43px;font: bold 34px Georgia,serif}.nav-shell,main{width:min(calc(100% - 34px),1000px);margin:auto}.nav-shell{height:45px;position:relative;background:linear-gradient(100deg,#eabb48,#f7d676,#e6b43e);clip-path:polygon(2% 0,99% 0,100% 95%,0 100%);display:flex;justify-content:center;align-items:center}.nav-shell nav{display:flex}.nav-shell a{padding:4px 9px;border-right:2px solid #741908;color:#620d03;text-decoration:none;font-weight:bold}.nav-shell a:last-child{border:0}.mobile-brand,.menu{display:none}.hero{height:365px;margin-top:13px;overflow:hidden;position:relative;border:7px solid transparent;background:url('about-reference.png') -175px -184px/1312px auto;box-shadow:0 3px 7px #79400b8a}.hero:before{content:"";position:absolute;inset:0;border:4px solid #86400e9b}.hero span{position:absolute;right:30px;top:138px;padding:6px 12px;color:#fff8e8;background:#7c8f786d;font:29px Georgia,serif}main>h2{margin:75px 0 31px;color:#209817;font:italic 30px Georgia,serif}.intro{display:grid;grid-template-columns:300px 1fr;gap:21px;align-items:center}.intro p,.details p{margin:0 0 22px;line-height:21px}.intro h3,.details h3,.cover h3{font-size:14px;margin:0 0 24px}.mortar-art{text-align:center;font-size:130px;color:#77a82a;text-shadow:2px 2px #fff0b3;}.mortar-art b{font-size:80px;color:#b87123}.mortar-art em{font-size:55px;color:#8b3c17}.details{margin-top:-5px;line-height:21px}.details ul,.cover ul{line-height:21px;margin:0 0 16px}.details h3{margin:8px 0 10px}.cover{display:grid;grid-template-columns:300px 1fr;gap:29px;align-items:start;margin-bottom:52px}.cover h3{color:#6c1407;margin-bottom:15px}.tea-photo{height:255px;border:2px solid #fff;background:url('about-reference.png') -480px -1385px/1312px auto;box-shadow:0 0 0 1px #6b5b2c}footer{padding:40px 20px;background:#cfb36acc;color:#6c1004;text-align:center;font-weight:bold;line-height:21px}
@media(max-width:760px){header{padding-top:22px}header h1{font-size:27px;margin-bottom:25px}.nav-shell,main{width:calc(100% - 28px)}.nav-shell{height:54px;padding:0 16px;clip-path:none;justify-content:space-between;border-radius:4px}.mobile-brand{display:block;border:0!important;padding:0!important;font: bold 18px Georgia,serif!important}.menu{display:grid;width:42px;height:37px;padding:0 9px;gap:5px;align-content:center;background:#712408;border:0;border-radius:4px}.menu i{height:3px;background:#fff;border-radius:2px}.nav-shell nav{display:none;position:absolute;z-index:3;top:54px;left:0;width:100%;background:#f2c961;padding:8px;box-shadow:0 5px 10px #5c310766}.nav-shell nav.open{display:flex;flex-direction:column}.nav-shell nav a{padding:10px;border-right:0;border-bottom:1px solid #b67d23}.hero{height:36.5vw;min-height:125px;max-height:270px;margin-top:13px;border-width:4px;background-size:calc((100vw - 28px)*1.312) auto;background-position:calc((100vw - 28px)*-.175) calc((100vw - 28px)*-.184)}.hero span{right:5px;top:37%;font-size:clamp(13px,4vw,23px)}main>h2{margin:35px 0 22px;font-size:27px}.intro{grid-template-columns:1fr;gap:5px}.mortar-art{font-size:75px;height:120px}.intro p,.details p{line-height:20px}.details{margin-top:14px}.cover{grid-template-columns:1fr;margin-bottom:35px}.tea-photo{height:180px;background-size:930px auto;background-position:-340px -980px}footer{padding:28px 14px;font-size:12px}}
