:root {
  --ink:#070809;
  --ink-2:#0d0f10;
  --paper:#e8dfcf;
  --muted:#a29a8d;
  --bronze:#b78a50;
  --bronze-soft:#d0aa72;
  --ember:#a84c3e;
  --rule:rgba(217,185,135,.20);
  --display:'Cinzel', Georgia, serif;
  --body:'EB Garamond', Georgia, serif;
  --max:1240px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink)}
body{margin:0;background:radial-gradient(circle at 78% 4%,rgba(119,75,38,.10),transparent 31rem),linear-gradient(180deg,#08090a 0%,#070809 58%,#090909 100%);color:var(--paper);font-family:var(--body);font-size:20px;line-height:1.62;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;z-index:-3;pointer-events:none;background:radial-gradient(circle at 15% 18%,rgba(105,60,33,.08),transparent 28%),radial-gradient(circle at 85% 72%,rgba(110,44,31,.07),transparent 30%)}
a{color:inherit}
button{font:inherit}
.grain{pointer-events:none;position:fixed;inset:0;z-index:100;opacity:.10;mix-blend-mode:screen;background-image:linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);background-size:3px 3px}

/* AAQA-style fixed, minimal header */
.site-header{height:100px;position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:6px clamp(16px,3vw,46px);background:linear-gradient(to bottom,rgba(5,6,6,.96),rgba(5,6,6,.68),transparent);pointer-events:none}
.brand-logo{display:block;width:108px;pointer-events:auto;text-decoration:none;opacity:.94;transition:opacity .2s ease,transform .2s ease}
.brand-logo:hover{opacity:1;transform:translateY(-1px)}
.brand-logo img{display:block;width:100%;height:auto}
.header-map-link{pointer-events:auto;text-decoration:none;color:#bdb1a1;font:600 11px/1 Arial,Helvetica,sans-serif;letter-spacing:.18em;padding:12px 0;transition:color .2s ease}
.header-map-link:hover{color:var(--bronze-soft)}

.hero{width:min(var(--max),calc(100% - 48px));min-height:900px;margin:0 auto;display:grid;grid-template-columns:.90fr 1.10fr;align-items:center;gap:clamp(40px,6vw,86px);padding:142px 0 92px;position:relative}
.eyebrow{margin:0 0 20px;color:var(--bronze-soft);font:700 12px/1.45 Arial,Helvetica,sans-serif;letter-spacing:.22em}
.hero h1{margin:0;max-width:720px;font-family:var(--display);font-size:clamp(48px,5.6vw,82px);line-height:.98;font-weight:500;letter-spacing:-.035em;text-wrap:balance;text-shadow:0 3px 22px rgba(0,0,0,.5)}
.hero h1 span{color:var(--bronze)}
.hero-line{margin:24px 0 28px;color:#c05a49;font:600 15px/1.4 Arial,Helvetica,sans-serif;letter-spacing:.14em}
.hero-intro{max-width:620px;margin:0;color:#c3bbae;font-size:21px}
.hero-actions,.book-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.button{appearance:none;border-radius:0;display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 20px;border:1px solid rgba(207,171,116,.48);text-decoration:none;font:700 11px/1 Arial,Helvetica,sans-serif;letter-spacing:.13em;cursor:pointer;transition:transform .22s ease,background .22s ease,border-color .22s ease,color .22s ease,opacity .22s ease}
.button:hover{transform:translateY(-2px);border-color:var(--bronze-soft)}
.button.primary{background:#a47a45;color:#0c0c0c;border-color:#a47a45}
.button.primary:hover{background:#c29a64}
.button.secondary{color:#d7cebf;background:rgba(255,255,255,.025)}
.book-switch.is-selected{background:#b58b55;color:#080909;border-color:#c6a36f;box-shadow:0 10px 30px rgba(0,0,0,.24)}
.switch-note{margin:14px 0 0;color:#777064;font-size:15px;font-style:italic}

.hero-books{min-height:690px;position:relative;display:flex;justify-content:center;align-items:center;perspective:1800px;isolation:isolate}
.hero-books::after{content:"";position:absolute;width:78%;height:28px;left:11%;bottom:22px;background:rgba(0,0,0,.88);filter:blur(21px);border-radius:50%;z-index:0}
.book{appearance:none;border:0;background:transparent;padding:0;margin:0;position:absolute;z-index:1;cursor:pointer;filter:drop-shadow(0 30px 38px rgba(0,0,0,.62));transition:transform .55s cubic-bezier(.2,.75,.2,1),filter .45s ease,opacity .45s ease,z-index 0s linear .12s;transform-origin:center bottom}
.book img{display:block;width:100%;height:auto;box-shadow:0 0 0 1px rgba(239,211,169,.12)}
.book-one{width:min(49%,345px);left:10%;transform:translateX(32px) translateY(34px) rotateY(8deg) rotateZ(-2.3deg) scale(.94);z-index:3}
.book-two{width:min(46%,325px);right:9%;transform:translateX(-20px) translateY(-2px) rotateY(-7deg) rotateZ(2.1deg) scale(.92);z-index:2;filter:drop-shadow(0 24px 30px rgba(0,0,0,.54)) brightness(.72) saturate(.84)}
.hero-books[data-active="jadumun"] .book-one,.hero-books[data-active="volkaniz"] .book-two{z-index:6;filter:drop-shadow(0 38px 48px rgba(0,0,0,.72)) brightness(1) saturate(1);opacity:1}
.hero-books[data-active="jadumun"] .book-one{transform:translateX(74px) translateY(6px) rotateY(2deg) rotateZ(-.7deg) scale(1.06)}
.hero-books[data-active="jadumun"] .book-two{transform:translateX(-54px) translateY(28px) rotateY(-9deg) rotateZ(2.5deg) scale(.88);z-index:2;filter:drop-shadow(0 22px 28px rgba(0,0,0,.48)) brightness(.64) saturate(.75);opacity:.78}
.hero-books[data-active="volkaniz"] .book-two{transform:translateX(-72px) translateY(2px) rotateY(-2deg) rotateZ(.7deg) scale(1.06)}
.hero-books[data-active="volkaniz"] .book-one{transform:translateX(58px) translateY(28px) rotateY(9deg) rotateZ(-2.4deg) scale(.88);z-index:2;filter:drop-shadow(0 22px 28px rgba(0,0,0,.48)) brightness(.64) saturate(.75);opacity:.78}
.book:focus-visible,.book-switch:focus-visible,.button:focus-visible,a:focus-visible{outline:2px solid var(--bronze-soft);outline-offset:4px}

.statement{width:min(930px,calc(100% - 48px));margin:0 auto;padding:115px 0 128px;text-align:center;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.statement>p:first-child,.closing>p{margin:0 0 18px;color:var(--bronze);font:700 11px/1.4 Arial,sans-serif;letter-spacing:.25em}
.statement h2,.closing h2{margin:0;font-family:var(--display);font-weight:500;font-size:clamp(36px,4.7vw,64px);line-height:1.06}
.statement-body{max-width:720px;margin:28px auto 0;color:#aaa296;font-size:20px}

.book-feature{width:min(1110px,calc(100% - 48px));margin:0 auto;padding:118px 0;display:grid;grid-template-columns:minmax(280px,.58fr) 1fr;gap:clamp(52px,7vw,96px);align-items:center;border-bottom:1px solid var(--rule)}
.book-feature.reverse{grid-template-columns:1fr minmax(280px,.58fr)}
.book-feature.reverse .cover-wrap{order:2}.book-feature.reverse .book-copy{order:1}
.cover-wrap{position:relative;width:min(100%,390px);justify-self:center}.cover-wrap img{display:block;width:100%;height:auto;max-height:640px;object-fit:contain;box-shadow:0 32px 70px rgba(0,0,0,.62),0 0 0 1px rgba(255,255,255,.04)}
.book-number{position:absolute;top:-45px;left:-48px;color:rgba(184,139,79,.22);font-family:var(--display);font-size:100px;line-height:1;z-index:-1}
.book-copy h2{margin:0 0 22px;font-family:var(--display);font-size:clamp(52px,6.2vw,84px);line-height:.95;font-weight:500;letter-spacing:.01em}
.book-copy .lead{margin:0 0 26px;color:#d9cebf;font-size:25px;line-height:1.44}
.book-copy>p:not(.eyebrow):not(.lead){color:#aaa296;max-width:650px;font-size:20px}

.map-section{width:min(var(--max),calc(100% - 48px));margin:118px auto 0;border:1px solid var(--rule);display:grid;grid-template-columns:minmax(0,1.18fr) minmax(310px,.82fr);align-items:stretch;background:#090a0a;overflow:hidden}
.map-visual{position:relative;display:block;min-height:580px;background:#070808;overflow:hidden}
.map-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 62%,rgba(8,9,9,.92) 100%),linear-gradient(0deg,rgba(0,0,0,.16),transparent 30%);pointer-events:none}
.map-visual img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.72) brightness(.74) contrast(1.03);transform:scale(1.015);transition:transform .6s ease,filter .6s ease}
.map-visual:hover img{transform:scale(1.035);filter:saturate(.82) brightness(.82) contrast(1.04)}
.map-copy{display:flex;flex-direction:column;justify-content:center;padding:72px clamp(32px,5vw,70px);background:linear-gradient(140deg,#0d0e0e,#080909)}
.map-copy h2{margin:0 0 20px;font-family:var(--display);font-size:clamp(42px,5vw,70px);line-height:1;font-weight:500}
.map-copy p:not(.eyebrow){color:#aaa296;font-size:20px}
.map-button{align-self:flex-start;margin-top:16px}

.closing{width:min(850px,calc(100% - 48px));margin:0 auto;padding:136px 0 118px;text-align:center}
.closing-actions{margin-top:34px;color:#9f978b;font:600 12px/1 Arial,sans-serif;letter-spacing:.12em}
.closing-actions a{text-decoration:none}.closing-actions a:hover{color:var(--bronze-soft)}.closing-actions span{margin:0 12px;color:var(--bronze)}
footer{width:min(var(--max),calc(100% - 48px));margin:0 auto;padding:30px 0 42px;border-top:1px solid var(--rule);display:flex;align-items:center;justify-content:space-between;gap:20px;color:#777269;font:500 11px/1.4 Arial,sans-serif;letter-spacing:.07em}
.footer-brand{color:#aaa095;text-decoration:none;letter-spacing:.16em}

/* Scroll-load / reveal behavior — sections stay hidden until they enter the viewport. */
.reveal{opacity:1;transform:none;visibility:visible}
.js .reveal:not(.is-visible){opacity:0;transform:translateY(42px);visibility:hidden}
.js .reveal{transition:opacity .92s ease,transform .92s cubic-bezier(.2,.65,.25,1);will-change:opacity,transform}
.js .reveal.is-visible{opacity:1;transform:none;visibility:visible}
.reveal.is-visible .reveal-child{animation:childRise .88s ease both}
.reveal.is-visible .reveal-child:nth-child(2){animation-delay:.15s}
@keyframes childRise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

/* Full map page */
.map-page{background:#060707}.map-page-main{padding:144px clamp(18px,4vw,54px) 90px}.map-page-heading{text-align:center;max-width:850px;margin:0 auto 45px}.map-page-heading h1{font-family:var(--display);font-weight:500;font-size:clamp(52px,7vw,96px);line-height:.96;margin:0}.map-page-heading>p:last-child{color:#91887b;font-size:18px;margin-top:18px}.map-page-frame{width:min(1360px,100%);margin:0 auto}.map-page-frame a{display:block}.map-page-frame img{display:block;width:100%;height:auto;border:1px solid rgba(208,170,114,.28);box-shadow:0 34px 100px rgba(0,0,0,.65)}

@media(max-width:980px){body{font-size:19px}.site-header{height:88px}.brand-logo{width:94px}.hero{grid-template-columns:1fr;min-height:0;padding-top:122px;gap:22px}.hero-copy{text-align:center}.hero-intro{margin-inline:auto}.hero-actions{justify-content:center}.hero-books{min-height:620px}.book-one{left:16%}.book-two{right:16%}.book-feature,.book-feature.reverse{grid-template-columns:1fr;gap:58px}.book-feature.reverse .cover-wrap,.book-feature.reverse .book-copy{order:initial}.cover-wrap{width:min(100%,360px);max-width:360px;margin:0 auto}.book-copy{text-align:center}.book-copy>p:not(.eyebrow):not(.lead){margin-inline:auto}.book-actions{justify-content:center}.map-section{grid-template-columns:1fr}.map-visual{min-height:0;aspect-ratio:16/10}.map-visual::after{background:linear-gradient(0deg,rgba(8,9,9,.95),transparent 34%)}.map-copy{text-align:center}.map-button{align-self:center}}
@media(max-width:620px){body{font-size:17px}.site-header{height:76px;padding:4px 12px}.brand-logo{width:78px}.header-map-link{font-size:9px;letter-spacing:.13em}.hero,.statement,.book-feature,.map-section,.closing,footer{width:min(100% - 28px,var(--max))}.hero{padding:101px 0 70px}.hero h1{font-size:clamp(44px,13vw,68px)}.hero-intro{font-size:19px}.hero-actions{display:grid;grid-template-columns:1fr;width:100%}.button{width:100%}.hero-books{min-height:480px}.book-one{width:54%;left:3%}.book-two{width:51%;right:3%}.hero-books[data-active="jadumun"] .book-one{transform:translateX(36px) translateY(0) rotateY(1deg) rotateZ(-.5deg) scale(1.03)}.hero-books[data-active="jadumun"] .book-two{transform:translateX(-28px) translateY(22px) rotateY(-7deg) rotateZ(2deg) scale(.86)}.hero-books[data-active="volkaniz"] .book-two{transform:translateX(-34px) translateY(0) rotateY(-1deg) rotateZ(.5deg) scale(1.03)}.hero-books[data-active="volkaniz"] .book-one{transform:translateX(28px) translateY(22px) rotateY(7deg) rotateZ(-2deg) scale(.86)}.statement{padding:82px 0 90px}.book-feature{padding:86px 0}.book-number{left:-8px;top:-30px;font-size:76px}.map-section{margin-top:86px}.map-copy{padding:48px 24px}.map-copy h2{font-size:43px}.closing{padding:102px 0 92px}footer{flex-direction:column;text-align:center}.map-page-main{padding-top:108px}.map-page-heading{margin-bottom:28px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js .reveal{transition:none;transform:none}.js .reveal:not(.is-visible){opacity:0;visibility:hidden;transform:none}.js .reveal.is-visible{opacity:1;visibility:visible;transform:none}.reveal.is-visible .reveal-child{animation:none}.book,.map-visual img,.button,.brand-logo{transition:none}}


/* v4 refinements: compact logo, natural cover proportions, standard copyright */
.site-header .brand-logo{width:78px}
.site-header .brand-logo img{width:100%;height:auto;object-fit:contain}

/* Never stretch the book artwork in the individual book sections. */
.book-feature .cover-wrap{width:auto;max-width:330px;justify-self:center}
.book-feature .cover-wrap img{
  display:block;
  width:auto;
  height:auto;
  max-width:100%;
  max-height:520px;
  object-fit:contain;
  object-position:center;
}

.site-footer{
  width:min(var(--max),calc(100% - 48px));
  margin:0 auto;
  padding:30px 0 42px;
  border-top:1px solid var(--rule);
  display:block;
  text-align:center;
}
.site-footer .copyright{
  margin:0;
  color:#777269;
  font:500 11px/1.4 Arial,Helvetica,sans-serif;
  letter-spacing:.07em;
}

@media(max-width:980px){
  .site-header .brand-logo{width:70px}
  .book-feature .cover-wrap{max-width:310px}
  .book-feature .cover-wrap img{max-height:490px}
}
@media(max-width:620px){
  .site-header .brand-logo{width:62px}
  .book-feature .cover-wrap{max-width:270px}
  .book-feature .cover-wrap img{max-height:430px}
  .site-footer{width:min(100% - 28px,var(--max));padding:26px 0 34px}
}