/* Personal voyage notes and an uneasy sky; decorative, with no motion loop. */
.home-page .guide-cover { width:min(100%,310px); padding:27px 23px 23px 33px; border:1px solid #807361; border-right:3px solid #a69a81; border-radius:3px 9px 9px 3px; color:#d2c6a9; background:repeating-linear-gradient(0deg,#c5bda007 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,#b4bda008 0 1px,transparent 1px 4px),linear-gradient(100deg,#1c2729,#394346 9%,#2c373b 13%,#30393d 94%,#222b30); transform:rotate(-4deg); box-shadow:4px 2px 0 #c0af90,7px 4px 0 #4d4945,10px 8px 0 #172025,0 22px 35px #08061077; }
.home-page .guide-cover::before { inset:0 auto 0 12px; width:4px; border:0; border-left:1px solid #111a2080; border-right:1px solid #c9c09d20; border-radius:0 }
.home-page .guide-cover::after { content:''; position:absolute; inset:6px; border:1px solid #d7c9a518; border-radius:1px 5px 5px 1px; pointer-events:none }
.home-page .guide-cover-edition { font-size:9px; letter-spacing:.13em; text-align:left; color:#bfb59b }
.home-page .guide-cover strong { margin:23px 0 20px; font:400 35px/1.04 Georgia,serif; letter-spacing:-.055em; color:#e0d2b4 }
.home-page .guide-cover strong i { font-size:.73em; font-weight:400; letter-spacing:-.03em }
.guide-cover-print { position:relative; background:#cbbc9e; padding:5px 5px 9px; transform:rotate(2deg); box-shadow:0 2px 5px #060a0c66 }
.guide-cover-print::before { content:''; position:absolute; width:60px; height:19px; top:-8px; right:12px; transform:rotate(9deg); background:#d1ba8e70; border-inline:1px solid #ecdbb322; z-index:1 }
.guide-cover-print img { width:100%; height:auto }
.guide-cover-print > span { display:block; padding:6px 5px 0; color:#4a4540; font:italic 11px Georgia,serif; letter-spacing:.02em }
.home-page .guide-cover-note { margin:22px 0 18px 8px; color:#c3c3b1; font:italic 20px 'Alegreya Sans',serif; transform:rotate(-6deg); letter-spacing:.015em }
.guide-cover-note::after { content:''; display:block; width:114px; height:5px; border-bottom:1px solid #c3c3b16b; border-radius:50%; transform:rotate(-2deg) }
.guide-cover-label { display:block; font:500 9px 'Barlow Condensed',sans-serif; letter-spacing:.18em; color:#b8ae96; border-top:1px solid #c4b59433; padding-top:12px }
.guide-cover-ribbon { position:absolute; width:17px; height:49px; bottom:-35px; right:31px; background:linear-gradient(90deg,#814638,#b77655 45%,#8e4f3e); clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%); z-index:-1 }
.listening-heading { display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:20px; align-items:center; margin-bottom:38px }
.home-page .listening-intro { margin-bottom:0; max-width:none; position:relative; z-index:1 }
.home-page .listening-intro h2 { font-size:clamp(44px,5.4vw,78px) }
.listening-illustration { min-width:0; position:relative; margin:-30px -30px 0 -15px; pointer-events:none }
.listening-illustration img { width:100%; height:auto }
.listening-illustration figcaption { margin-top:-18px; text-align:center; font:italic 17px Georgia,serif; color:#ccb0ca; letter-spacing:.01em }
@media (max-width:1000px) { .listening-heading { grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:0 } .listening-illustration { margin-inline:-35px } .listening-illustration figcaption { font-size:14px } }
@media (max-width:760px) { .home-page .guide-cover { width:255px; margin:8px auto 25px; padding:25px 21px 22px 30px } .home-page .guide-cover strong { font-size:32px; margin:20px 0 } .home-page .guide-cover-note { font-size:19px } .listening-heading { grid-template-columns:1fr; gap:10px; margin-bottom:30px } .home-page .listening-intro h2 { font-size:52px } .listening-illustration { width:min(100%,460px); margin:-10px auto 0 } .listening-illustration figcaption { margin-top:-15px; font-size:15px } }
.home-page .listening-section { container-type:inline-size }
@container (max-width:800px) { .listening-heading { grid-template-columns:1fr; gap:10px } .listening-illustration { width:min(100%,460px); margin:0 auto } }
@media (max-width:760px) { .home-page .guide-cover { width:min(255px,100%) } .home-page .listening-intro h2 { font-size:clamp(36px,11vw,52px) } }