:root{--ink:#172b2c;--cream:#f3f0e6;--orange:#cf693b;--line:#c8cabb;--serif:Georgia,'Times New Roman',serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--cream);font-family:Arial,sans-serif}button,a{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #e6814c;outline-offset:3px}.header{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 5%;border-bottom:1px solid var(--line)}.brand{display:flex;gap:9px;align-items:center;color:inherit;text-decoration:none;font-family:var(--serif);font-size:19px;letter-spacing:.12em}.brand-mark{font-size:34px;color:var(--orange)}.brand small{display:block;font:8px Arial;letter-spacing:.18em;margin-top:3px}.header-note,.eyebrow,.intro-index,.card-number,.image-caption,.viewer-bottom,.viewer-title span,.places-head span,.story-top,.story-note{font-size:10px;letter-spacing:.17em;font-weight:bold}.header-note{color:#79817a}.intro{display:grid;grid-template-columns:1fr 1fr;min-height:580px;position:relative}.intro-copy{padding:100px 8% 110px 10%}.eyebrow{color:#8a6552}.eyebrow span{color:var(--orange)}h1,h2,h3,p{margin-top:0}h1{font:clamp(48px,5vw,80px)/1.02 var(--serif);letter-spacing:-.045em;margin:27px 0}h1 em,.closing em{font-weight:normal;color:var(--orange)}.lead{font:17px/1.7 var(--serif);color:#59635b}.primary{display:inline-flex;align-items:center;justify-content:space-between;gap:42px;background:var(--ink);color:white;text-decoration:none;border:0;padding:18px 20px;font-size:12px;font-weight:bold;margin-top:18px}.primary span{font-size:18px}.intro-image{background:linear-gradient(0deg,rgba(16,34,36,.45),transparent 50%),url('assets/odyssey.png') center/cover;position:relative;min-height:360px}.image-caption{position:absolute;bottom:26px;left:30px;right:30px;color:white;display:flex;justify-content:space-between;font-size:9px}.intro-index{position:absolute;bottom:27px;left:5%;color:#8a9188;font-size:9px}.intro-index span{color:var(--orange);padding:0 8px}.explore{padding:105px 5% 110px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:36px}.section-heading h2{font:52px/1 var(--serif);letter-spacing:-.035em;margin:18px 0 0}.section-heading h2 span{color:var(--orange)}.section-heading>p{font:16px/1.6 var(--serif);max-width:310px;color:#637068;margin:0}.map-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.map-card{text-align:left;padding:0;border:1px solid #c7cabb;background:#f9f7ef;color:var(--ink);transition:transform .2s}.map-card:hover{transform:translateY(-4px)}.card-image{display:block;height:230px;background-size:cover;background-position:center}.iliad-thumb{background-image:url('assets/iliad.jpg')}.troy-thumb{background-image:url('assets/troy.png')}.odyssey-thumb{background-image:url('assets/odyssey.png')}.card-body{display:block;position:relative;padding:24px}.card-number{color:#a06447}.card-body strong{display:block;font:30px var(--serif);margin-top:20px}.card-sub{display:block;font:italic 16px var(--serif);color:#728078;margin-top:4px}.card-arrow{position:absolute;right:24px;bottom:26px;border:1px solid #b8c0b5;border-radius:50%;width:36px;height:36px;display:grid;place-items:center}.closing{text-align:center;background:#e3e6da;padding:70px 20px}.closing>span{color:var(--orange);font-size:22px}.closing p{font:32px/1.3 var(--serif);margin:18px}.closing a{font-size:10px;letter-spacing:.14em;color:var(--ink);font-weight:bold}footer{display:flex;justify-content:space-between;gap:20px;padding:30px 5%;font-size:9px;letter-spacing:.12em;color:#68766c}footer span:first-child{font:16px var(--serif);letter-spacing:.12em;color:var(--ink)}footer i{color:var(--orange)}.viewer[hidden],.places[hidden]{display:none}.viewer{position:fixed;inset:0;z-index:10;background:var(--cream);display:flex;flex-direction:column}.viewer-top{height:76px;display:flex;align-items:center;gap:30px;padding:0 3%;border-bottom:1px solid var(--line)}.back,.places-toggle{border:0;background:transparent;color:var(--ink);font-size:12px;font-weight:bold}.back{padding:12px 0;min-width:95px;text-align:left}.viewer-title{flex:1}.viewer-title span{color:#a06447;font-size:9px}.viewer-title h2{font:25px var(--serif);margin:3px 0 0}.places-toggle{border:1px solid #9ca99c;padding:11px}.places-toggle span{color:#a06447;margin-left:5px}.viewer-tabs{display:flex;gap:22px;padding:0 3%;background:#f9f7ef;border-bottom:1px solid var(--line);overflow:auto}.viewer-tabs button{white-space:nowrap;border:0;border-bottom:2px solid transparent;padding:14px 0;background:transparent;color:#8d9a91;font-size:10px;letter-spacing:.08em}.viewer-tabs button span{font-size:12px;letter-spacing:0;margin-left:6px}.viewer-tabs button.active{color:var(--ink);border-color:var(--orange)}.map-area{position:relative;flex:1;min-height:0;background:#c6c6b7;overflow:hidden}.viewport{width:100%;height:100%;overflow:hidden;touch-action:none;cursor:grab}.viewport:active{cursor:grabbing}.map-layer{position:absolute;left:0;top:0;transform-origin:0 0;will-change:transform}.map-layer img{display:block;width:100%;height:auto;user-select:none;pointer-events:none}.hotspot{position:absolute;transform:translate(-50%,-50%);width:5.4%;aspect-ratio:1;border:2px solid transparent;border-radius:50%;background:transparent;padding:0}.hotspot:hover,.hotspot:focus-visible{border-color:#fff;box-shadow:0 0 0 3px #cb6a3d,0 0 20px #fff}.map-help{position:absolute;left:20px;bottom:20px;background:rgba(23,43,44,.9);color:white;padding:12px 14px;font-size:11px;pointer-events:none}.map-help span{padding-left:5px}.zoom-controls{position:absolute;right:20px;bottom:20px;display:flex;flex-direction:column;box-shadow:0 3px 15px #172b2c33}.zoom-controls button{width:42px;height:42px;border:0;border-bottom:1px solid #ddd;background:#faf9f2;color:var(--ink);font-size:22px}.places{position:absolute;right:0;top:0;bottom:0;width:min(330px,85vw);background:#f9f7ef;box-shadow:-8px 0 30px #0002;overflow:auto;padding:24px}.places-head{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:18px}.places-head span{color:#a06447;font-size:9px}.places-head h3{font:27px var(--serif);margin:8px 0 0}.places-head button,.story-top button{border:0;background:none;font-size:28px;color:var(--ink)}#place-list button{display:flex;width:100%;justify-content:space-between;padding:17px 0;border:0;border-bottom:1px solid #ddd;background:none;color:var(--ink);text-align:left;font:17px var(--serif)}#place-list button span{color:var(--orange)}.viewer-bottom{padding:12px 3%;display:flex;justify-content:space-between;font-size:9px;color:#75837a}dialog{width:min(440px,calc(100% - 32px));border:0;background:#f8f6ed;color:var(--ink);padding:30px;box-shadow:0 15px 70px #0005}dialog::backdrop{background:#102424aa}.story-top{display:flex;justify-content:space-between;align-items:center;color:#a06447;font-size:9px}.story-ornament{font-size:30px;color:var(--orange);margin:35px 0 15px}dialog h2{font:43px/1.05 var(--serif);margin:0}.story-rule{width:45px;border-top:2px solid var(--orange);margin:23px 0}#story-text{font:17px/1.7 var(--serif);color:#4c5e55}.story-note{color:#9aa297;font-size:8px;margin-top:30px}dialog .primary{width:100%}@media(max-width:700px){.header{height:65px}.header-note{font-size:8px}.intro{display:flex;flex-direction:column}.intro-copy{padding:65px 6% 55px}h1{font-size:50px}.intro-image{min-height:300px}.intro-index{display:none}.explore{padding:70px 5%}.section-heading{display:block}.section-heading h2{font-size:42px}.section-heading>p{margin-top:18px}.map-cards{grid-template-columns:1fr}.card-image{height:210px}.closing p{font-size:27px}footer{flex-wrap:wrap}footer span:last-child{display:none}.viewer-top{height:64px;gap:12px}.back{min-width:38px;font-size:18px}.back span{display:none}.viewer-title h2{font-size:20px}.viewer-tabs{gap:16px}.viewer-tabs button{font-size:9px}.viewer-tabs button span{font-size:11px}.map-help{left:10px;bottom:10px;font-size:10px;max-width:70%}.zoom-controls{right:10px;bottom:10px}.viewer-bottom span:last-child{display:none}.hotspot{min-width:30px;min-height:30px}}
/* Official Studiolo branding and book links */
.brand-logo{display:block;width:160px;height:auto}.footer-logo{display:block;width:140px;height:auto;align-self:center}.book-promo{display:flex;align-items:center;justify-content:center;gap:34px;padding:40px 5%;border-top:1px solid var(--line);background:#f9f7ef}.book-promo img{width:100px;height:145px;object-fit:contain}.book-promo h2{font:30px var(--serif);margin:8px 0 14px}.book-link,.map-learn-more{display:inline-block;color:var(--ink);border:1px solid #9ca99c;text-decoration:none;font-size:11px;font-weight:bold;padding:11px 14px}.book-link span,.map-learn-more span{margin-left:8px}.viewer-bottom{align-items:center;gap:12px}.map-learn-more{flex:none;background:#f9f7ef;letter-spacing:0;font-size:11px;padding:7px 10px}.sr-only,.book-link .sr-only,.map-learn-more .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:700px){.brand-logo{width:145px}.footer-logo{width:120px}.book-promo{gap:22px;padding:30px 5%}.book-promo img{width:82px;height:120px}.book-promo h2{font-size:25px}.viewer-bottom .map-learn-more .sr-only{display:block}}
.language-selector{display:flex;align-items:center;gap:5px;flex:none;color:#9aa297;font-size:11px;letter-spacing:.04em}.language-selector button{border:0;background:transparent;color:#79817a;font:inherit;padding:10px 3px;min-width:28px}.language-selector button[aria-pressed="true"]{color:var(--ink);font-weight:bold}.story-top .language-selector{margin-left:auto;margin-right:8px}dialog{max-height:90dvh;overflow:auto}@media(max-width:700px){.header{gap:8px}.header-note{margin-left:auto}.viewer-top{gap:6px}.viewer-title{min-width:0}.viewer-title h2{font-size:clamp(14px,4.5vw,20px);line-height:1.05}.places-toggle{padding:9px 6px}.language-selector{gap:1px}.language-selector button{min-width:26px}.card-body strong{overflow-wrap:anywhere}.viewer-tabs button{white-space:nowrap}dialog h2{overflow-wrap:anywhere}}
.story-top .language-selector button{font:inherit;color:#79817a;padding:10px 3px}.story-top .language-selector button[aria-pressed="true"]{color:var(--ink);font-weight:bold}