*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#010711;color:#eee0c3;font-family:Georgia,"Times New Roman",serif;min-height:100vh}
body:before{content:"";position:fixed;inset:0;z-index:-3;background:
linear-gradient(180deg,rgba(1,7,17,.18),rgba(1,5,13,.38)),var(--resonance) center/cover no-repeat}
body:after{content:"";position:fixed;inset:0;z-index:-2;
background:radial-gradient(ellipse at 50% 45%,rgba(35,82,112,.08),transparent 50%)}
.inner-nav{position:fixed;top:0;left:0;right:0;z-index:1000;display:flex;align-items:center;justify-content:flex-end;gap:28px;padding:18px 4vw;font-family:Arial,sans-serif;background:rgba(1,7,17,.62);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:10px;letter-spacing:.14em}
.inner-nav .brand{margin-right:auto;color:#eee0c3;text-decoration:none;font-size:14px;letter-spacing:.24em;display:flex;align-items:center;gap:9px}
.inner-nav .brand small{color:#d9b15e;font-size:14px;opacity:.7}
.inner-nav nav{display:flex;gap:28px;align-items:center}
.inner-nav nav a{position:relative;color:#ddd2bc;text-decoration:none;display:flex;flex-direction:column;align-items:center;padding-bottom:24px}
.inner-nav nav a:hover{color:#dfb65d}
.inner-nav nav i{position:absolute;top:18px;width:31px;height:31px;color:#dfb65d;opacity:0;transform:translateY(4px) scale(.7);transition:.32s;font-style:normal;text-align:center;line-height:31px}
.inner-nav nav a:hover i,.inner-nav nav a:focus-visible i{opacity:1;transform:translateY(0) scale(1)}
.door-icon{border:1.7px solid #dfb65d;border-bottom:0;border-radius:2px 2px 0 0}.door-icon:after{content:"";position:absolute;left:8px;right:8px;bottom:0;height:15px;border-left:1.2px solid #dfb65d;border-right:1.2px solid #dfb65d;background:radial-gradient(circle at 50% 50%,rgba(255,235,173,.8),rgba(255,204,96,.08) 70%,transparent)}
.compass-icon{font-size:25px}.heart-icon{font-size:24px}.person-icon{border:1.7px solid #dfb65d;border-radius:50%}.person-icon:after{content:"";position:absolute;left:6px;right:6px;bottom:3px;height:10px;border:1.5px solid #dfb65d;border-radius:50%}
.wave-icon{font-size:31px}.camera-icon{border:1.7px solid #dfb65d;border-radius:4px}.camera-icon:after{content:"";position:absolute;left:8px;top:8px;width:11px;height:11px;border:1.4px solid #dfb65d;border-radius:50%}.question-icon{border:1.7px solid #dfb65d;border-radius:50%;font-size:18px}
.page{max-width:1120px;margin:0 auto;padding:125px 6vw 30px}
.opening{text-align:center;max-width:930px;margin:0 auto 115px;padding-top:45px}
.eyebrow{font-family:Arial,sans-serif;font-size:10px;letter-spacing:.32em;color:#d9b15e}
.opening h1{font-size:clamp(5.5rem,15vw,11rem);font-weight:400;line-height:.82;letter-spacing:.08em;color:#f1d38d;text-shadow:0 0 40px rgba(216,174,90,.22);margin:24px 0}
.opening-line{font-size:clamp(1.7rem,3vw,2.55rem);line-height:1.18;margin:55px auto 18px}
.opening-soft{font-size:1.35rem;color:#aaa698;font-style:italic}
.central{display:grid;grid-template-columns:minmax(250px,390px) 1fr;gap:90px;align-items:center;padding:65px 0 125px;border-top:1px solid rgba(216,174,90,.17)}
.book-cover{justify-self:center;width:min(350px,100%);filter:drop-shadow(0 30px 38px rgba(0,0,0,.62))}
.book-cover img{width:100%;display:block}
.copy{font-size:1.35rem;line-height:1.82;color:#c1baae}.copy p{margin:0 0 22px}
.archer{margin-top:45px;padding:25px 0 5px 28px;border-left:1px solid rgba(216,174,90,.55)}.archer p{margin-bottom:12px}.archer p:first-child{font-size:1.8rem;color:#ead9b4}.archer .humour{font-style:italic;color:#d9b15e;margin-top:-2px}
blockquote{margin:45px 0 10px;padding:25px 0 25px 30px;border-left:1px solid #d9b15e;font-size:1.75rem;line-height:1.4;color:#ead9b4;font-style:italic}
.story{max-width:900px;margin:0 auto;padding:85px 0 125px;border-top:1px solid rgba(216,174,90,.13);font-size:1.28rem;line-height:1.85;color:#c0b9ad}
.questions{margin:60px 0 0;padding-left:34px;border-left:1px solid rgba(216,174,90,.52);font-size:1.7rem;line-height:1.35;color:#e5d4ae;font-style:italic}
.deeper{position:relative;padding:125px 0 150px;text-align:center;overflow:hidden}.deeper:before{content:"";position:absolute;inset:-30%;background:radial-gradient(ellipse at 50% 50%,rgba(57,122,157,.13),transparent 46%);filter:blur(20px);z-index:-1}
.deeper-inner{max-width:820px;margin:auto;font-size:1.3rem;line-height:1.75;color:#aaa59c}.deeper .original{font-size:2.35rem;color:#d9b15e;margin:55px 0 5px}
.return-door{display:flex;flex-direction:column;align-items:center;gap:18px;text-decoration:none;padding:60px 0 75px;color:#d9b15e}
.door-frame{position:relative;width:92px;height:135px;border:2px solid rgba(222,186,107,.7);border-bottom:0;border-radius:5px 5px 0 0;box-shadow:0 0 35px rgba(220,177,77,.1);transform:skewY(-1deg);transition:.6s}
.door-light{position:absolute;inset:10px 10px 0;background:radial-gradient(ellipse at 50% 65%,rgba(255,237,175,.95),rgba(235,186,87,.34) 40%,rgba(73,105,125,.08) 70%,transparent 78%);filter:blur(2px);transition:.6s}
.door-frame:before{content:"";position:absolute;left:0;top:0;width:48px;height:125px;border:1.6px solid rgba(222,186,107,.72);border-right:0;transform-origin:left center;transform:perspective(180px) rotateY(-25deg);box-shadow:-16px 8px 35px rgba(255,211,118,.10)}
.door-frame:after{content:"";position:absolute;left:10px;right:10px;bottom:0;height:2px;background:rgba(222,186,107,.7)}
.return-door:hover .door-frame{box-shadow:0 0 65px rgba(255,214,116,.28);transform:translateY(-4px) skewY(-1deg)}
.return-door:hover .door-light{filter:blur(0);transform:scale(1.05)}
.return-label{font-family:"Cinzel","Trajan Pro","Copperplate","Times New Roman",serif;font-size:14px;font-weight:600;letter-spacing:.38em;color:#e1bd69;text-shadow:0 0 12px rgba(220,177,77,.22);position:relative}
@media(max-width:850px){.inner-nav{padding:20px 5vw;display:block}.inner-nav .brand{margin-bottom:20px}.inner-nav nav{display:flex;gap:15px;flex-wrap:wrap;justify-content:flex-start}.inner-nav nav a{font-size:9px}.page{padding-top:150px}.opening{padding-top:30px;margin-bottom:70px}.central{grid-template-columns:1fr;gap:55px}.book-cover{width:min(330px,75vw)}.copy{font-size:1.12rem}.questions{font-size:1.42rem}.door-frame{width:76px;height:112px}}

/* LOCAL TEST: artwork is an explicit image element, not a CSS background. */
.resonance-artwork{
  position:fixed;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:0;
  pointer-events:none;
}
.page{position:relative;z-index:3}
.inner-nav{z-index:1000}
body:before{z-index:1!important;opacity:.16}
body:after{z-index:2!important;opacity:.30}
.door-art{
  display:block;
  width:min(260px,34vw);
  height:min(235px,31vw);
  position:relative;
  filter:drop-shadow(0 10px 30px rgba(255,205,110,.22));
}
.door-art img{display:block;width:100%;height:100%;object-fit:contain}
.return-door:hover .door-art{
  transform:translateY(-5px);
  filter:drop-shadow(0 12px 52px rgba(255,211,118,.38));
  transition:.6s;
}

/* FIXED LOCAL TEST LAYERING */
html,body{background:#010611!important}
.resonance-artwork{
  position:fixed!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  display:block!important;
  opacity:1!important;
  z-index:0!important;
  pointer-events:none!important;
}
body:before{z-index:1!important;opacity:.12!important;pointer-events:none!important}
body:after{z-index:2!important;opacity:.18!important;pointer-events:none!important}
.page{position:relative!important;z-index:3!important}
.inner-nav{position:fixed!important;z-index:1000!important}
.door-art{
  display:block!important;
  width:260px!important;
  height:235px!important;
  position:relative!important;
  filter:drop-shadow(0 10px 30px rgba(255,205,110,.24))!important;
}
.door-art img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important}

/* V11 visual pass */
.resonance-artwork{
  position:fixed!important;inset:0!important;width:100%!important;height:100%!important;
  object-fit:cover!important;display:block!important;opacity:1!important;z-index:0!important;
  pointer-events:none!important;
}
body:before{z-index:1!important;opacity:.08!important}
body:after{z-index:2!important;opacity:.08!important}
.page{position:relative!important;z-index:3!important}
.inner-nav{z-index:1000!important}
.opening{text-align:center!important;margin-left:auto!important;margin-right:auto!important}
.opening h1{text-align:center!important;margin-left:auto!important;margin-right:auto!important}
.door-art{display:block!important;width:300px!important;height:250px!important;position:relative!important;
filter:drop-shadow(0 12px 45px rgba(255,205,110,.28))!important}
.door-art img{display:block!important;width:100%!important;height:100%!important;object-fit:contain!important}
.return-door:hover .door-art{transform:translateY(-6px);filter:drop-shadow(0 15px 70px rgba(255,211,118,.44));transition:.6s}
@media(max-width:850px){.door-art{width:280px!important;height:240px!important}}

/* WEBSITE 2.0 HEADING STANDARD — safe override */
.opening h1{
  font-size:clamp(3.5rem,6vw,5.5rem)!important;
  line-height:.95!important;
  text-align:center!important;
  width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* WEBSITE 2.0 RETURN HOME LABEL */
.return-label{display:inline-block;transform:translateX(.19em);text-rendering:geometricPrecision;}
.return-label:after{content:"";position:absolute;left:0;right:.38em;top:52%;height:1px;background:linear-gradient(90deg,transparent 0 7%,rgba(225,189,105,.34) 8% 19%,transparent 20% 32%,rgba(225,189,105,.22) 33% 48%,transparent 49% 63%,rgba(225,189,105,.28) 64% 82%,transparent 83%);opacity:.55;mix-blend-mode:screen;}
@media(max-width:850px){.copy{font-size:1.18rem}.return-label{font-size:12px;letter-spacing:.32em}}

/* Make the key GET UNPLUGGED statement more prominent without changing the other eyebrow labels. */
.central .eyebrow{font-family:Arial,sans-serif;font-size:clamp(1.35rem,2.1vw,1.65rem);line-height:1.25;letter-spacing:.16em;color:#d9b15e;margin-bottom:28px;}

/* INNER HEADER — FINAL HOME-MATCH TEST v4 */
.inner-nav{
  top:0!important;left:0!important;right:0!important;height:88px;
  padding:12px 3.2vw 10px!important;
  display:flex!important;align-items:center!important;justify-content:flex-end!important;
  gap:30px!important;
  background:linear-gradient(180deg,rgba(3,7,10,.40),rgba(3,7,10,.10) 72%,transparent)!important;
  backdrop-filter:blur(3px)!important;-webkit-backdrop-filter:blur(3px)!important;
  border-bottom:0!important;
  box-shadow:0 8px 28px rgba(0,0,0,.07)!important;
}
.inner-nav .brand{
  margin-right:auto!important;display:flex!important;flex-direction:column!important;
  align-items:flex-start!important;justify-content:center!important;gap:5px!important;
  text-decoration:none!important;
}
.inner-nav .brand .brand-name{
  font-family:"Helvetica Neue","Avenir Next",Avenir,Montserrat,Arial,sans-serif!important;
  font-size:29px!important;font-weight:200!important;line-height:1!important;
  letter-spacing:.24em!important;color:#e7deca!important;
  text-shadow:0 0 10px rgba(238,220,176,.07);
}
.inner-nav .brand .brand-tagline{
  font-family:"Helvetica Neue","Avenir Next",Avenir,Montserrat,Arial,sans-serif!important;
  font-size:9px!important;font-weight:200!important;line-height:1!important;
  letter-spacing:.19em!important;color:#d7d0c3!important;white-space:nowrap;
}
.inner-nav .brand small{display:none!important}
.inner-nav nav{
  display:flex!important;align-items:center!important;gap:29px!important;
}
.inner-nav nav a{
  position:relative!important;display:inline-block!important;
  padding:0 0 10px!important;
  font-family:"Helvetica Neue","Avenir Next",Avenir,Montserrat,Arial,sans-serif!important;
  font-size:10px!important;font-weight:200!important;line-height:1!important;
  letter-spacing:.12em!important;color:#e1ddd4!important;
  text-decoration:none!important;
  transform:translateY(0);
  transition:color .22s ease,transform .22s ease,text-shadow .22s ease;
}
.inner-nav nav a::after{
  content:"";position:absolute;left:12%;right:12%;bottom:1px;height:1px;
  background:rgba(229,184,94,0);
  box-shadow:0 0 0 rgba(229,184,94,0);
  transform:scaleX(.25);
  transition:background .22s ease,box-shadow .22s ease,transform .22s ease;
}
.inner-nav nav a:hover,
.inner-nav nav a:focus-visible{
  color:#f0dfb8!important;
  transform:translateY(-2px);
  text-shadow:0 0 10px rgba(229,184,94,.18);
}
.inner-nav nav a:hover::after,
.inner-nav nav a:focus-visible::after{
  background:rgba(229,184,94,.95);
  box-shadow:0 0 8px rgba(229,184,94,.45),0 0 16px rgba(229,184,94,.16);
  transform:scaleX(1);
}
.inner-nav nav a[aria-current="page"]{color:#f0dfb8!important}
.inner-nav nav a[aria-current="page"]::after{
  background:rgba(229,184,94,.92);
  box-shadow:0 0 7px rgba(229,184,94,.24);
  transform:scaleX(1);
}
.inner-nav nav a i{display:none!important}

@media(max-width:1050px){
  .inner-nav{gap:18px!important;padding-left:3vw!important;padding-right:3vw!important}
  .inner-nav nav{gap:18px!important}
  .inner-nav .brand .brand-name{font-size:24px!important}
  .inner-nav .brand .brand-tagline{font-size:8px!important;letter-spacing:.16em!important}
}
@media(max-width:850px){
  .inner-nav{
    height:auto!important;padding:14px 5vw 16px!important;
    background:linear-gradient(180deg,rgba(3,7,10,.46),rgba(3,7,10,.14) 86%,transparent)!important;
  }
  .inner-nav .brand{margin-bottom:13px!important}
  .inner-nav .brand .brand-name{font-size:22px!important;letter-spacing:.18em!important}
  .inner-nav .brand .brand-tagline{font-size:7px!important;letter-spacing:.12em!important}
  .inner-nav nav{gap:13px!important}
  .inner-nav nav a{font-size:8px!important;letter-spacing:.09em!important}
}

/* PAGE-SPECIFIC SPACING PASS — TEST ONLY */
/* These rules use the page artwork filename so the shared stylesheet stays untouched
   for the other inner pages. */

/* THE BOOK: bring the long story closer to the cover/archer section. */
body:has(.resonance-artwork[src*="v11-book"]) .central{
  padding-bottom:50px!important;
}
body:has(.resonance-artwork[src*="v11-book"]) .story{
  padding-top:55px!important;
}

/* THE JOURNEY: reduce the large hand-off gap into the deeper section. */
body:has(.resonance-artwork[src*="v11-journey"]) .central{
  padding-bottom:50px!important;
}
body:has(.resonance-artwork[src*="v11-journey"]) .deeper{
  padding-top:55px!important;
}

/* GET UNPLUGGED: tighten the lower copy without making it cramped. */
body:has(.resonance-artwork[src*="v11-unplugged"]) .deeper{
  padding-top:65px!important;
  padding-bottom:85px!important;
}
body:has(.resonance-artwork[src*="v11-unplugged"]) .deeper-inner{
  font-size:1.18rem!important;
  line-height:1.62!important;
}
body:has(.resonance-artwork[src*="v11-unplugged"]) .deeper-inner p{
  margin:0 0 16px!important;
}
body:has(.resonance-artwork[src*="v11-unplugged"]) .deeper .original{
  margin-top:34px!important;
}
@media(max-width:850px){
  body:has(.resonance-artwork[src*="v11-unplugged"]) .deeper-inner{
    font-size:1.08rem!important;
    line-height:1.58!important;
  }
}

/* ABOUT PHIL — restore the tested wide, centered layout */
.about-page .central{
  display:block!important;
  padding-left:0!important;
  padding-right:0!important;
}
.about-page .central .copy{
  max-width:920px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
@media(max-width:850px){
  .about-page .central .copy{
    max-width:none!important;
  }
}